jQuery pass dynamic element id/value into PHP.

Question

Hi, I want to pass the dynamicLi element id and text into the PHP which look like this.

<ul id ='dynamicUL'>
    <li id='dynamicLi'><div id="fieldname">Field 1</div></li>
    <li id='dynamicLi'><div id="fieldname">Field 2</div></li>
    <li id='dynamicLi'><div id="fieldname">Field 3</div></li>
</ul>

The dynamicLi and the fieldname is generate from database through PHP and jQuery, and therefore do not have a fix number.

What method should I use to pass this fieldname id and text (Field 1, 2, 3) into PHP? Using array, json or xml? And how should I do it using jQuery?

thank you.

Answer 1

you can use ajax to submit the values to a php script. the values can be in any format, preferably json.

Answer 2

You can see my answer working here: http://jsfiddle.net/kq2uQ/

HTML I added numbers at the end of the dynamicLi because you IDs need to be unique on a page. I also added a wrapper

<div id="wrapper">
    <ul id ='dynamicUL'>
        <li id='dynamicLi1'><div id="fieldname">Field 1</div></li>
        <li id='dynamicLi2'><div id="fieldname">Field 2</div></li>
        <li id='dynamicLi3'><div id="fieldname">Field 3</div></li>
    </ul>
</div>

Javascript

$(document).ready(function() {

    var unordered_lists = $("#wrapper ul");

    $.each (unordered_lists, function(i, list) {
        var list_elements = $(list).children("li");
        var list_id = { data: [] }

        $.each (list_elements, function(i, element) {
           var id = $(element).attr("id");
           list_id.data[i] = id;
        });

        //alert(list_id.data);
        $.post("/path/to/file.php", list_id.data);
    });

});