0

I have multiple html elements on the view that are loaded with the ajax call. These html elements depends on javascript files that i have included. It is working properly when loaded without ajax but when i load it with ajax it stops working.

jQuery(document).on('submit','form#hc',function(e){
    jQuery.ajax({
                    'url' : baseUrl+'manage-function',
                    'dataType': 'json',
                    'type' : 'post',
                    'data': {formData : formData},
                    success:function(response){
                        jQuery('.function_div').html(response.html);
                    } 
                });
});
user3653474
  • 3,393
  • 6
  • 49
  • 135
  • In the success callback, whats the result of `console.log(jQuery('.function_div').length)`? – fonini Sep 26 '19 at 13:45
  • @fonini: If i place javascript depended code in success function then it starts working. But it is too large code i do not want to repeat. – user3653474 Sep 26 '19 at 13:52
  • Don't. just make sure it is delegated the same way you already did with your submit above – mplungjan Sep 26 '19 at 13:56
  • @mplungjan: Can u please provide me some link. – user3653474 Sep 26 '19 at 13:57
  • Look at the dupe! `$('.function_div').on("click","someselectorfromresponse",function() {})` – mplungjan Sep 26 '19 at 14:05
  • @mplungjan: html is loading but in that html there is timepicker that is initialised in some other script that was loaded on page load and working on page load but after rendering that view with ajax timepicker does not load – user3653474 Sep 26 '19 at 14:31
  • You cannot load HTML without re-initialising things like time pickers – mplungjan Sep 26 '19 at 14:38

0 Answers0