如何获取动态表单中选择下拉列表的名称或ID

时间:2014-10-28 22:36:51

标签: javascript html dynamicform

我有一个带有选择下拉列表的动态表单,我想知道哪个选项被更改了,但是无论何时我添加新表单并尝试更改任何选择警报都是相同的:“origen1”

这是我的js代码:

<SCRIPT language="javascript">
    function addRow(divId) {
        count = 0;
        count++;
        var etiquetas = new Array();
        var origenes = new Array();
        var parentDiv = document.getElementById(divId);

        // create a div dynamically
        var eleDiv = document.createElement("div");
        eleDiv.setAttribute("name", "olddiv");
        eleDiv.setAttribute("id", "olddiv");

         // create a label dynamically
        var etiqueta = document.createElement("input");
        etiqueta.setAttribute("name", 'etiqueta' + count);
        etiqueta.setAttribute("value", "etiqueta");
        etiqueta.setAttribute('disabled', true);
        etiquetas.push(etiqueta);

        //create a select dynamically
        var myarray=new Array(3)
        myarray[0] = "Opt1"
        myarray[1] = "Opt2"
        myarray[2] = "Opt3"
        var origen = document.createElement("select");
        origen.setAttribute("name", 'origen' + count);          
        for (i=0; i<3; i++) 
        {
            opt = document.createElement('option');
            opt.value = i;
            opt.innerHTML = myarray[i];
            origen.appendChild(opt);
        }          
        origen.onchange = function(){testselect(this);};
        origenes.push(origen);

        // create a delete button dynamically
        var eleBtn = document.createElement("input");
        eleBtn.setAttribute("type", "button");
        eleBtn.setAttribute("value", "delete");
        eleBtn.setAttribute("name", "button");
        eleBtn.setAttribute("id", "button");
        eleBtn.setAttribute("onclick", "deleteRow('button')");

        // append new div to parent div 
        parentDiv.appendChild(eleDiv);

        // append textbox & button to new div 
        eleDiv.appendChild(etiqueta);
        eleDiv.appendChild(origen);
        eleDiv.appendChild(eleBtn); 
    }

    function testselect(seleccion)
    {
        alert(seleccion.name);
    }

    function deleteRow(tableID) {
            var div = document.getElementById('olddiv');
            if (div) {
                div.parentNode.removeChild(div);
            }
    }

</SCRIPT>

和html:

<form name="objForm" action="test1.php">
    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
    <div id="dataTable" width="350px">

   </div>
    <input  type="submit" value="Submit"/>
</form>

1 个答案:

答案 0 :(得分:0)

尝试使用firebug检查下拉菜单。这样您就可以获得所选下拉列表的名称和ID,但请记住,必须使用firebug选择所选下拉列表,以便查看随其使用的ID或名称。

由于这是JS并且未正确选择下拉列表,因此您可能看不到使用的名称或ID。

因此请确保选择正确