jquery - Dynamically loaded javascript doesn't work second time loaded -
I am working on a webpage which uses a jQuery UI dialog (in modal mode) which displays a form Dynamically generated to Django The basic flow is:
- The user clicks on a button
- jquery (using AJAX) receives a request that returns html for the form which The dialog is made to fill in
- The html contains a script tag that handles some UI on the form that loads properly and does the desired job < / Li>
- The user fills with the form and the click "complete" and the form has been submitted.
The problem occurs when the user generates an error on the form of the reply to the post request (which submits the form) with the modified original form (including the script) to show server errors gives. This is the second time the script is full, it is "not defined by the Unkit Reference error: $ (anonymous function) " The script is actually exactly as before when it works fine in this entire process The page is never refreshing to be clear.
Here is a summary of JavaScript that takes care of the model:
var add_container = $ ("#add_container"); Add_container.dialog ({...}) function show_form (form, feedback_func) {add_container.html (form); Add_container.dialog ("open"); $ ("#Add_form"). Submit (function (event) {return submit_form ($ (this), response_func);}); } Function submit_form (form, response_funk) {add_container.append ('& lt; p & gt; adding ... & lt; / p & gt;'); // This page form. Writer ('target', 'upload_tag') is a trick to upload a file without reloading; $ ('# Upload_target') Load (function () {var response = $ ('# upload_target'). Content (). ('Body'). Html (); add_container.dialog ("close"); resp_obj = $ (Response) if (resp_obj.is ('form')) {// *** is that it reloads the form when show_form (response, response_func);} and {response_func (resp_obj);} error) ; } $ ('# Add_link'). Click (ad_link); Function add_link () {$ .get ('/ add_link', function) {function add_response (response) {// display successfully submit} show_form (data, add_response);}); } // ... more stuff that is not important
this html / add_link
add_form.js is a pretty standard javascript file that uses jQuery. It starts with $ (document). (Function () {...}) and the first $, where the reference is alright
This form should be dynamically generated, depending on what is clicked on the page Everything was not fixed steadily. The script is not dynamically generated so it does not necessarily need to be loaded dynamically, but I was not sure how to put it in the file itself, and this also happens when the form loads. . I am open to suggestions of alternative ways to fulfill the same effect.
Your form action is a different relative path with a JQuery framework script,
& lt; Script type = "text / javascript" src = "/ scripts / add_form.js" & gt; & Lt; / Script & gt; & Lt ;! - src = "/ script" - & gt; & Lt; Form id = "add_form" enctype = "multipart / form-data" verb = "/ add_link /" method = "post" & gt; & Lt ;! - action = "/ add_link" - & gt;
To ensure that this structure is being loaded after form submission, just use something like developer tools on your browser and check the head tag for jQuery script src . Is it still?
Comments
Post a Comment