Triggering field js

For some reason I’m having a problem getting my js field function to trigger.

I did
$.fn.usersdatatable = function() { console.log($('#usersdatatable')); $('#usersdatatable').DataTable(); };

when my class is defined like this

class UsersdatatableField extends BaseField {
}

I know my js file is being loaded becuase before I added the $.fn it would get triggered but before my field was created.

@1n3JgKl9pQ6cUMrW - I was trying to follow your post, but it doesn’t trigger my js at all right now. Do you have any more tips?

Thanks!

Have you followed the boilerplate to create a jquery field plugin: https://gist.github.com/bastianallgeier/9398bbd72dcc782827a8

Now I did. It still doesn’t trigger.

(function($) {

      $.fn.usersdatatable = function() {

        return this.each(function() {

          var field = $(this);

          // avoid multiple inits
          if(field.data('usersdatatable')) {
            return true;
          } else {
            field.data('usersdatatable', true);
          }

            console.log($('#usersdatatable'));
            $('#usersdatatable').DataTable();
            $('#usersdatatable').attr('onclick',"");

        });

      };

    })(jQuery);

I didn’t notice that I needed to have some

<i id=\"userdatatablegrid\" data-field=\"userdatatable\"></i>

tag in my html.

probably my lack of experience with jquery.
anyway, that might be helpful for future field makers.

The function is “triggered” by that field (with data-field as the most important value).

So without it, nothing happens :slight_smile:

You can even remove the field after the function is triggered; it’s an empty italic-wrapper, which has no purpose at all :stuck_out_tongue:

Yea, I realize it and instead connected this to the element that I want to exist there (it’s silly to have extra useless elements).

Right now I’m struggling to tame the kirby users routes. Ill put an “alpha” version up in a second, so people can take a look.