动态添加的下拉列表未发布

时间:2013-11-01 03:35:20

标签: jquery html css post

说我的页面有以下HTML:

<form action="/some/where" method="POST">
     <div id="someDiv">
     </div>
</form>

然后假设我单击一个按钮,该按钮调用一个函数,该函数使用jQuery以某种方式向该DIV添加下拉列表。

(我正在使用DataTables而DIV真的是TD)

    var ddlSubset = '<select id="ddlSubset_' + rowNum + '"></select>';
    oTable.fnUpdate(ddlSubset, rowNum, 3, false, true);

    var subsetsURL = "/TotalTuple/Subsets";

    $.getJSON(subsetsURL, function (data) {
        for (i = 0; i < data.length; i++) {
            if (data[i] == subsetData) {
                $('#ddlSubset_'+rowNum).append($('<option selected></option>').text(data[i]));
            }
            else {
                $('#ddlSubset_' + rowNum).append($('<option></option>').text(data[i]));
            }
        }

    });

如果我在控制之前和之后查看页面源,它​​们都是相同的。

当我提交表单时,新的DDL不会传递。

如何确保表格中包含DDL?

1 个答案:

答案 0 :(得分:1)

试试这个: - http://jsfiddle.net/adiioo7/2Ra2S/1/

只需提供name属性即可动态添加选择。

<强> JS: -

jQuery(function($){
    $("#btnAddDropdown").on("click",function(){
        $("#someDiv").html("<select name='test'><option>Test</option></select>");                           
    });

     $("#btnSubmit").on("click",function(){
         $("#myForm").submit();
     });

    $("#myForm").on("submit",function(){
        var datastring = $("#myForm").serialize();
        console.log(datastring);
    });
});

<强> HTML: -

<form id="myForm" action="/some/where" method="POST">
     <div id="someDiv">
     </div>
</form>

<input type="button" value="Add Dropdown" id="btnAddDropdown" />
<input type="button" value="Submit Form" id="btnSubmit" />