如何在javascript中获取在gridview中运行时创建的文本框的id

时间:2010-10-20 10:46:33

标签: javascript asp.net html

我有一个可编辑的gridview。当我点击gridview中与行对应的编辑按钮时,我提供了两个文本框来输入两个新值.2文本框,因为我有2列。现在这个文本框是在运行时生成的。我想在javascript中访问这个文本框并对它们进行验证。这是html语法。

<table cellspacing="0" rules="all" border="1" id="TableGridView" style="border-collapse:collapse;table-layout:fixed">
            <tr>
                <th scope="col"><b>Action</b></th><th scope="col"><b>PROCESSOR_ID</b></th><th scope="col"><b>PROCESSOR_NAME</b></th>
            </tr><tr>
                <td><input type="image" name="TableGridView$ctl02$edit_button" id="TableGridView_ctl02_edit_button" title="Edit" src="images/edit.gif" style="border-width:0px;" /><input type="image" name="TableGridView$ctl02$delete_button" id="TableGridView_ctl02_delete_button" title="Delete" src="images/delete.gif" onclick="return confirm('Are you sure you want to delete the record?');" style="border-width:0px;" /><input type="image" name="TableGridView$ctl02$insert_button" id="TableGridView_ctl02_insert_button" title="Insert" src="images/insert.bmp" style="border-width:0px;" /></td><td><span id="TableGridView_ctl02_PROCESSOR_ID">23</span></td><td><span id="TableGridView_ctl02_PROCESSOR_NAME">dasdas</span></td>
            </tr><tr>
                <td><input type="image" name="TableGridView$ctl03$edit_button" id="TableGridView_ctl03_edit_button" title="Edit" src="images/edit.gif" style="border-width:0px;" /><input type="image" name="TableGridView$ctl03$delete_button" id="TableGridView_ctl03_delete_button" title="Delete" src="images/delete.gif" onclick="return confirm('Are you sure you want to delete the record?');" style="border-width:0px;" /><input type="image" name="TableGridView$ctl03$insert_button" id="TableGridView_ctl03_insert_button" title="Insert" src="images/insert.bmp" style="border-width:0px;" /></td><td><span id="TableGridView_ctl03_PROCESSOR_ID">123</span></td><td><span id="TableGridView_ctl03_PROCESSOR_NAME">asdasdas</span></td>
            </tr><tr>
                <td><input type="image" name="TableGridView$ctl04$update_button" id="TableGridView_ctl04_update_button" title="Add" src="images/update.gif" onclick="return (textfieldvalidation());" style="border-width:0px;" /><input type="image" name="TableGridView$ctl04$cancel_button" id="TableGridView_ctl04_cancel_button" title="Cancel" src="images/cancel.gif" style="border-width:0px;" /></td><td><input name="TableGridView$ctl04$PROCESSOR_ID" type="text" id="TableGridView_ctl04_PROCESSOR_ID" /></td><td><input name="TableGridView$ctl04$PROCESSOR_NAME" type="text" id="TableGridView_ctl04_PROCESSOR_NAME" /></td>
            </tr><tr>
                <td><input type="image" name="TableGridView$ctl05$edit_button" id="TableGridView_ctl05_edit_button" title="Edit" src="images/edit.gif" style="border-width:0px;" /><input type="image" name="TableGridView$ctl05$delete_button" id="TableGridView_ctl05_delete_button" title="Delete" src="images/delete.gif" onclick="return confirm('Are you sure you want to delete the record?');" style="border-width:0px;" /><input type="image" name="TableGridView$ctl05$insert_button" id="TableGridView_ctl05_insert_button" title="Insert" src="images/insert.bmp" style="border-width:0px;" /></td><td><span id="TableGridView_ctl05_PROCESSOR_ID">6456</span></td><td><span id="TableGridView_ctl05_PROCESSOR_NAME">dg</span></td>
            </tr>
        </table>

我必须使用IE 6.0。

我已经尝试过该表的document.getElementbyID和它们无法正常工作的getElementsByTagName。

var curValue = document.getElementById(“&lt;%= TableGridView.ClientID%&gt;”)。rows; 在IE中,curValue为1,在firefox中为4。

3 个答案:

答案 0 :(得分:2)

这里我将举例说明如何在这里执行java脚本代码

enter code here

// JScript文件

//如果验证了电子邮件字段,则此方法用于添加行   function addRows(tableID)       {            如果(验证(this.obj))            {                var emailTableRow = document.getElementById(“ctl00_ContentPlaceHolder1_EmailTableRow”)。value;

        var table = document.getElementById(tableID);

        var rowCount = table.rows.length;


        var lastRow;
        if (emailTableRow == '') {
            emailTableRow = "'1'";
            lastRow = 1;
        }
        else 
        {

            lastRow = emailTableRow.substr(emailTableRow.lastIndexOf(",") + 2, emailTableRow.lastIndexOf("'") - (emailTableRow.lastIndexOf(",") + 2));


        }

        var newRow = parseInt(lastRow) + 1;

        emailTableRow = emailTableRow + ",'" + newRow.toString() + "'";

        document.getElementById("ctl00_ContentPlaceHolder1_EmailTableRow").value = emailTableRow;


        var row = table.insertRow(rowCount);


        var cell0 = row.insertCell(0);

    cell0.style.marginLeft="0px";
cell0.style.width="200px";
cell0.style.height="12px";
//cell0.style.line-height="12px";
cell0.style.paddingLeft="0px";
cell0.style.background="#70b9ee";
cell0.style.fontFamily="Trebuchet MS";
cell0.style.fontSize="11px";
cell0.style.fontWeight="normal";
cell0.style.color="#fff";
cell0.style.textAlign="center";
cell0.style.border="0px solid #000";

        var element0 = document.createElement("label");
        element0.innerHTML = newRow;
        element0.setAttribute("size", "3");

        element0.setAttribute("name", "lblRownumber" + newRow.toString());
        element0.setAttribute("id", "lblRownumber" + newRow.toString());
        cell0.appendChild(element0);



        var cell1 = row.insertCell(1);
        cell1.style.marginLeft="0px";
cell1.style.width="200px";
cell1.style.height="12px";
//cell0.style.line-height="12px";
cell1.style.paddingLeft="0px";
cell1.style.background="#70b9ee";
cell1.style.fontFamily="Trebuchet MS";
cell1.style.fontSize="11px";
cell1.style.fontWeight="normal";
cell1.style.color="#fff";
cell1.style.textAlign="center";
cell1.style.border="0px solid #000";
        var element1 = document.createElement("input");
        element1.type = "text";

        element1.setAttribute("name", "txtEMAIL_ADDRESS" + newRow.toString());
        element1.setAttribute("id", "txtEMAIL_ADDRESS"+ newRow.toString());

        cell1.appendChild(element1);


        var cell2 = row.insertCell(2);

        cell2.style.marginLeft="0px";
cell2.style.width="200px";
cell2.style.height="12px";
//cell0.style.line-height="12px";
cell2.style.paddingLeft="0px";
cell2.style.background="#70b9ee";
cell2.style.fontFamily="Trebuchet MS";
cell2.style.fontSize="11px";
cell2.style.fontWeight="normal";
cell2.style.color="#fff";
cell2.style.textAlign="center";
cell2.style.border="0px solid #000";
        var element2 = document.createElement("input");
        element2.setAttribute("name", "txtName"+newRow.toString());
        element2.setAttribute("id", "txtName"+newRow.toString());
        element2.type = "text";
        cell2.appendChild(element2);



        var cell3 = row.insertCell(3);

        cell3.style.marginLeft="0px";
cell3.style.width="200px";
cell3.style.height="12px";
//cell0.style.line-height="12px";
cell3.style.paddingLeft="0px";
cell3.style.background="#70b9ee";
cell3.style.fontFamily="Trebuchet MS";
cell3.style.fontSize="11px";
cell3.style.fontWeight="normal";
cell3.style.color="#fff";
cell3.style.textAlign="center";
cell3.style.border="0px solid #000";
        var element3 = document.createElement("input");
        element3.setAttribute("name", "txtPROMOTIONAL_COMPAIGN"+newRow.toString());
        element3.setAttribute("id", "txtPROMOTIONAL_COMPAIGN"+newRow.toString());
        element3.type = "text";
        cell3.appendChild(element3);


        var row = table.insertRow(rowCount+1);


        var cell0 = row.insertCell(0);
        cell0.colSpan = 4;
        cell0.style.textAlign = "left";
        cell0.style.paddingLeft = "0px"
        cell0.style.fontWeight="normal";
        cell0.style.fontSize="11px";

cell0.style.fontFamily =“Trebuchet MS”; cell0.style.marginLeft = “0像素”;     //cell0.style.margin="0px“; // cell0.style.width =“200px”; // cell0.style.height =“20px”; // cell0.style.line-height =“12px”;     cell0.style.paddingLeft = “5像素”;             cell0.style.background = “#70b9ee”; // cell0.style.font-family =“Trebuchet MS”; // cell0.style.font-size =“11px”; // cell0.style.font-weight =“normal”;             cell0.style.color = “#FFF”; // cell0.style.text-align =“left”;     //cell0.style.border="0px solid#000“;

        var element0 = document.createElement("label");
        element0.innerHTML ="Please feel free to change the Text";
        element0.setAttribute("size", "100");

        element0.setAttribute("name", "lblMessage" + newRow.toString());
        element0.setAttribute("id", "lblMessage" + newRow.toString());
        element0.setAttribute("class","srn-td-space3");
        cell0.appendChild(element0);




        var row = table.insertRow(rowCount+2);



            var cell0 = row.insertCell(0);
            cell0.colSpan = 4;
            cell0.style.textAlign = "left";
        cell0.style.paddingLeft = "5px"
        cell0.style.fontWeight="normal";
        cell0.style.fontSize="11px";

cell0.style.fontFamily =“Trebuchet MS”;    cell0.style.marginLeft = “1像素”; // cell0.style.width =“200px”; // cell0.style.height =“20px”; // cell0.style.line-height =“12px”; // cell0.style.paddingLeft =“0px”;             cell0.style.background = “#70b9ee”; // cell0.style.font-family =“Trebuchet MS”; // cell0.style.font-size =“11px”; // cell0.style.font-weight =“normal”;             cell0.style.color = “#FFF”; // cell0.style.text-align =“left”;     //cell0.style.border="0px solid#000“;

            var element0 = document.createElement("textarea");

            element0.setAttribute("cols", "50");

            element0.setAttribute("rows", "4");
            element0.setAttribute("name", "txtAreaEmailBody" + newRow.toString());
            element0.setAttribute("id", "txtAreaEmailBody" + newRow.toString());
            cell0.appendChild(element0);







   }

        return false;

}

//此方法用于验证电子邮件..... function validate(formobj){

var emailPattern = /^([0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-\w]*[0-9a-zA-Z]\.)+[a-zA-Z]{2,9})$/;

var getWorkFields;

getWorkFields = getFieldRequired('ctl00_ContentPlaceHolder1_SendmailsTable', 'ctl00_ContentPlaceHolder1_EmailTableRow', 'txtEMAIL_ADDRESS');

var fRequired = getWorkFields;

var fieldRequired = fRequired.split(",");

var validRegExp = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/i;
var email = document.getElementById(fieldRequired).value;


if (email == "") {
    alert("email cannot be empty");
     return false;
}
else {

    if (email.search(validRegExp) == -1) {

        alert(" A valid E-mail is required");

        return false;
    }
    else {
        return true;
    }

}

} //此方法用于动态生成ID     function getFieldRequired(tableID,hiddenFieldID,filedNamePrefix){

    try {
        var returnValue = '';
        var accRow = document.getElementById(hiddenFieldID).value;

        if (accRow == null || accRow == '')
            accRow = "'1'";

        var arrayString;
        arrayString = accRow.toString().split(",");


        aFieldPrefix = filedNamePrefix.toString().split(",");

        var I = parseInt(0);
        var J = parseInt(0);
        for (I = 0; I < arrayString.length; I++) {
            for (J = 0; J < aFieldPrefix.length; J++) {
                if (I == 0 && J == 0)
                {
                    returnValue = aFieldPrefix[J] + arrayString[I].replace("'", "").replace("'", "");

                 }
                else
                {
                    returnValue = aFieldPrefix[J] + arrayString[I].replace("'", "").replace("'", "");

                }

            }
        }

        return returnValue;

    }
    catch (e) {
        alert(e);
    }

}

答案 1 :(得分:2)

您应该传递所点击元素的引用,并避免使用ID's。

<input type="image" ... onclick="return textfieldvalidation(this)"...

功能

function textfieldvalidation(button){

  var tr = button.parentNode.parentNode,
      inputs = tr.getElementsByTagName('INPUT'), //all INPUT tags of the TR
      id = inputs[0].getAttribute('id'); //or inputs[0].id
}

答案 2 :(得分:0)

使用jquery,因为它具有跨浏览器支持

$.each("#TableGridView tr td input",function(){
    alert($(this).attr("id"));
});