Loading JS files in ajax-generated content

Question

This is a general question. My platform in jQuery in an old installation of bootstrap (2.3 - needed for legacy..., buts ins intranet).

I have a setup of jquery tabs - each one loads a section of html content via ajax. 1) If in this content, I have such things as datepickers and form validations- do I need to load those relevant js files again, as part of that content? If not - how would I apply these tools (validation, datepicker, for example) to the newly generated tags? I seem to be getting errors such as $(...).datepicker is not a function (which is called automatically after ajax content is loaded)

2) Does it make a difference if these JS files were called onload of the original/parent page? What if I need to call a new JS file that was nor called as part of the parent page - would i need to recall jQuery and then all the other relevant JS files?

3) I assume the content that comes in should NOT have tags etc- but rather it would become part of the existing page's DOM, correct? Would having an tag have any affect on the JS files question, above?

charlietfl · Accepted Answer · 2019-09-15 22:02:54Z

1

If the plugin files ( like datepicker.js, someValidationplugin.js) are already in main page you don't need to reload them but you need to make sure you don't load jQuery.js again in your ajax or it will wipe out the original jQuery object where the plugin functions are attached.

If there are other script resources you need that don't already exist you can use $.getScript() to retrieve them

answered Sep 15, 2019 at 22:02

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Loading JS files in ajax-generated content

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related