Question

我想在包含Dropdown和文本框的表中插入一个新行？我需要使用另一个将从数据库填充的DLL中的数据加载新行的DDL。现在，我有一个硬编码的DDL，我试图从中提取。为什么新行不从源DDL填充其DDL？代码如下。请参阅说明//WHY DOESNT THIS WORK???

的部分

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
function createTextbox(counter){
    return "<input id='"+ counter +  "' type='text' />"
}
function createDropDown(counter){

     var newSelectBox = "<select id='sel'" + counter + "></select>"


    return newSelectBox
}
function createRow(counter){
    return "<tr><td>" + createDropDown(counter) + "</td><td>"+ createTextbox(counter) +  "</td></tr>";
}
function getValuesForPostback(){
    //format as XML, JSON, or Whatever
    var ToReturn = "<items>"; 
    $('#sampleTable tr').each(function(){
    ToReturn += "<item>";
    //Get the textbox value
    ToReturn += "<text>" + $(this).find('input[type=text]').val() + "</text>";

    //Get the select values
    $(this).find('select option:selected').each(function(){
    ToReturn += "<select>" + $(this).val() + "</select>";
    });
    ToReturn += "</item>";
    });
    ToReturn += "</items>";
    return ToReturn;
}
function submitValues()
{
    alert(getValuesForPostback());
    //NOW: Just ajax or post back this value to the server and parse for your data.
}
$(document).ready(function(){
    $("#SourceDDL").hide();

    var counter = 2;
    $('#sampleTable').append(createRow(1));


    $('#btnAdd').click(function(){
        if(counter>10)
          {
               alert("You are only allowed to enter 10 Metrics for this project.");
               return false;
            }   
    $('#sampleTable').append(createRow(counter));

    $('#SourceDDL option').clone().appendTo("'#sel" + counter + "'")//WHY DOESNT THIS WORK???

    alert("'#sel" + counter + "'");
    counter++;
    });

    $('#btnSubmit').click(function(){
    submitValues();
    });
});
</script>
</head>
<body>

<button id="btnAdd">Add</button>
<button id="btnSubmit">Submit</button>
<table id="sampleTable">
</table>



<select id='SourceDDL'>
    <option>Zippy</option>
    <option>ZippyTwo</option>
    <option>ZippyThree</option>
</select>
</body>
</html>

Answer 1

您将错误的字符串传递给appendTo - 选择器没有引号。

Answer 2

为什么要写

$("#sampleTable")

但是

$("'#sel" + counter + "'")

解析为：

$("'#selN'")

？由于某种原因，你有额外的报价。

写：

$("#sel" + counter);

JQUERY Clone DropDown

2 个答案: