javascript中c#验证的网格视图中的复选框
我有一个有2个ItemTemplate的网格视图-一个checkBox，一个TextBox如果复选框被选中并且复选框中没有写入数量，我必须使用Javascript Validate4 !！我必须告诉客户我该怎么做？复选框和文本框位于网格视图的同一行。请提前把脚本给我谢谢。
回答 2
Stack Overflow用户
发布于 2011-12-30 21:31:44
如果你使用的是jQuery，这可以很容易的完成。创建一个将"this“作为参数的函数，并在复选框中"Click”事件将"this“传递给该函数。然后使用jQuery的.prev()方法可以获得网格的"tr“行
var trContainer = $(this).prev("tr")一旦你有了just do (使用jQuery find)
//如果行中只有一个文本框
var txtBox = $(trContainer).find("input"); //如果您有多个文本框
//在此文本框中添加一些虚拟css类，如txtValidateClass
var txtBox = $(trContainer).find(".txtValidateClass");现在，一旦您有了这个文本框，只需检查
if($(txtBox).val().trim() == ""){
//Show error
}else{
//Continue
}希望这对你有帮助。
Stack Overflow用户
发布于 2016-04-17 00:30:08
这个问题很古老，但为了以防万一，其他人需要一个只适用于JavaScript的解决方案，这里是如何解决的。
1. C#部件(在Page_Load方法中)
在Page_Load中，我们需要添加一个小技巧：
foreach(GridViewRow row in YourGridViewControlID.Rows)
{
if (row.RowType == DataControlRowType.DataRow )
{
((CheckBox) row.FindControl("YourCheckBoxID")).Attributes.Add("onchange", "javascript:ShowErrorMessage(" + (row.RowIndex ) + ");");
}
}这样，我们就可以在GridView的每个CheckBox的OnChange事件上添加JavaScript函数调用。特殊的是，我们不能通过HTML实现的是，我们在JavaScript函数中传递每个元素的Row Index，这是我们稍后需要的。
2. HTML部分的一些重要注意事项
通过使用如下所示的ClientIDMode="Static"，确保Checkbox控件和Textbox控件以及(更重要的是，您的GridView控件)都具有静态id：
<asp:CheckBox ID="YourCheckBoxID" runat="server" ClientIDMode="Static"/>
<asp:TextBox ID="YourTextBoxID" TextMode="SingleLine" runat="server" ClientIDMode="Static" />对于GridView控件：
<asp:GridView ID="YourGridViewControlID" ...... ClientIDMode="Static" runat="server">3. Javascript部分
然后在您的JavaScript文件/代码中：
function ShowErrorMessage(Row) {
// Get current "active" row of the GridView.
var GridView = document.getElementById('YourGridViewControlID');
var currentGridViewRow = GridView.rows[Row + 1];
// Get the two controls of our interest.
var rowTextBox = currentGridViewRow.cells[2].getElementsByTagName("input")[0];
var rowCheckbox = currentGridViewRow.cells[0].getElementsByTagName("input")[0];
// If the clicked checkbox is unchecked.
if( rowCheckbox.checked && rowTextBox.value === '') {
// Empty textbox therefore show error message.
return;
}
// Optionally hide the error message here.
}4.上述实现的一些注意事项
- 注意，在JavaScript代码中，在行：
var currentGridViewRow = GridView.rows[Row + 1];
[Row + 1]对此很重要，不应更改。
- ，最后：
以下行：
var rowTextBox = currentGridViewRow.cells[2].getElementsByTagName("input")[0];
var rowCheckbox = currentGridViewRow.cells[0].getElementsByTagName("input")[0];对于您来说，.cells[2]和.cells[0]可能不同，因此您必须在[]中选择正确的数字。
通常，这将是从0开始计数的GridView的列数。
因此，如果您的CheckBox位于GridView的第一列，那么您需要.cells[0]。
如果您的TextBox在GridView的第二列中，那么您需要.cells[1] (在上面的例子中，TextBox位于我的GridView的第三列中，因此我使用了.cells[2])。
5.一个小小的补充
上面的代码是作为问题所有者描述问题的代码。
但我认为在这种情况下，在对文本框进行更改时隐藏错误消息也是一个好主意。这是当用户选中复选框而文本框为空时，会得到一条错误消息，然后在文本框中键入一些内容，我们应该隐藏错误消息。
简而言之，下面是对上面注释的补充(为了简单起见，我删除了其他代码，但如果您想保留整个功能，则应该保留这两个代码)：
下面是对C#的修改：
foreach(GridViewRow row in YourGridViewControlID.Rows)
{
if (row.RowType == DataControlRowType.DataRow )
{
((TextBox) row.FindControl("YourTextBoxID")).Attributes.Add("onkeyup", "javascript:HideErrorMessage(" + (row.RowIndex ) + ");");
((TextBox) row.FindControl("YourTextBoxID")).Attributes.Add("onblur", "javascript:HideErrorMessage(" + (row.RowIndex ) + ");");
}
}可以在这里看到，他还添加了onblur事件，因为这个事件与onkeyup的组合确保了代码将在所有情况下执行。
下面是对JavaScript的修改：
function HideErrorMessage(Row) {
// Get current "active" row of the GridView.
var GridView = document.getElementById('YourGridViewControlID');
var currentGridViewRow = GridView.rows[Row + 1];
// Get the two controls of our interest.
var rowTextBox = currentGridViewRow.cells[2].getElementsByTagName("input")[0];
var rowCheckbox = currentGridViewRow.cells[0].getElementsByTagName("input")[0];
// If the clicked checkbox is unchecked.
if( rowCheckbox.checked && rowTextBox.value !== '') {
// Hide the error message here.
}
}https://stackoverflow.com/questions/8679637
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号