ajax - jquery accessing newly loaded dom elements -
I have a simple form to dynamically load some objects from my database
& lt; Input type = "text" name = "search" /> & Lt; Input type = "submit" name = "submit" />
When I click on the submit button, my DOM will add in some way
& lt; Ul & gt; & Lt; Li class = "name" & gt; Item 1 & lt; / Li & gt; & Lt; Li class = "volume" & gt; 120 & lt; / Li & gt; & Lt; Li class = "update" & gt; & Lt; Input type = "text" name = "update_qnt" /> gt; & Lt; / Li & gt; & Lt; Li class = "submit_quantity" & gt; Input type = "submit" name = "submit" value = "update" & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; Ul & gt; & Lt; Li class = "name" & gt; Item 2 & lt; / Li & gt; & Lt; Li class = "volume" & gt; 14 & lt; / Li & gt; & Lt; Li class = "update" & gt; & Lt; Input type = "text" name = "update_qnt" /> gt; & Lt; / Li & gt; & Lt; Li class = "submit_quantity" & gt; Input type = "submit" name = "submit" value = "update" & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; Ul & gt; & Lt; Li class = "name" & gt; Item 3 & lt; / Li & gt; & Lt; Li class = "volume" & gt; 13 & lt; / Li & gt; & Lt; Li class = "update" & gt; & Lt; Input type = "text" name = "update_qnt" /> gt; & Lt; / Li & gt; & Lt; Li class = "submit_quantity" & gt; Input type = "submit" name = "submit" value = "update" & gt; & Lt; / Li & gt; & Lt; / Ul & gt;
I have a php that I need all the arguments: to display objects, to update the quantity, to display quantity
That's why I want to access newly loaded DOM elements and when I insert a quantity in the text field for each item and then when I load the new stock value dynamically and display it in the volume list item Sector would press for the submit button.
i did it in a conventional way, after reaching them to the DOM elements
$. Ajax ({url: php file url ", type: 'post', cache: incorrect, data: 'input =' + field, success: function (data) {// with each element $ $. For item, click one (update the amount and call the ajax function to show the new volume))}}}
All is fine, but when I load the page I want to keep current stock and then what I have described above, and something is wrong, it seems that I repeat a lot of code, this code is too far from clearing.
I did some research and it seems that I have to use an .on () event handler, I do not use for page load. I need some help to guide my path, some articles guide me to some good material guidance
In everything I've read Some of my One way is to store and combine variables into variables .on ()
There is a jQuery plugin that can be helpful to you LiveQuery gives you the ability to connect with your elements such as you are usually with jQuery but in the event that new elements are added, Automatically defined behavior without additional management Will attach.
In order to wire your event handling for elements, you may have to wait until the DOM is ready, you can do this by adding a jquery code to a domReady callback, eg.
$ (document) .domReady (function () {...}); Edit: As mentioned in the comments below, another user is apparently hooked in dynamically added elements similar to livequoets mentioned above on jQuery.
Comments
Post a Comment