Question

I’m new to JavaScript. I have a script which loaded in layout (master page). This script for customization form fields (Custom forms elements). This link to js file.

I have many blocks on the page which are loaded via ajax. Therefore, my elements are sometimes, not styled the way they are supposed to.

My question: How to deal with this situation when plugin laoded in main page but target elements loaded later, via ajax?

Answer 1

If your styles are applied by applying classes and CSS it should work for ajax-loaded content. But not so if there’s a script that applies them.

For that, you need to separate out that part of code and call it on the new elements every time you append some content.

$.ajax({
.
.
.

    success:function(data){
      var newElem = $(data);
      target.append(newElem );

      applyStyles(newElem);
    }

});