Javascript 使用JS检测textbox何时具有值,radiobuttonlist何时具有选定索引
我有一个GridView,它的倒数第二列包含一个文本框(由jQueryUI DatePicker小部件填充)和一个RadioButtonList。另外,最后一列有一个检查图像(类似于stackoverflow的“已回答”和“未回答”检查) 我需要的是能够检测,最好是使用Javascript,当用户将文本框的值更改为某个值(在我的例子中是一个日期)并选择了单选按钮,然后将图像源从空复选标记更改为彩色复选标记(再次,类似于stackoverflow中的答案复选标记)时,如果用户从文本框中删除所有文本,我需要将图像源更改回空复选标记。哦,我还需要更改图像的替代文本 我的GridviewJavascript 使用JS检测textbox何时具有值,radiobuttonlist何时具有选定索引,javascript,asp.net,gridview,textbox,radiobuttonlist,Javascript,Asp.net,Gridview,Textbox,Radiobuttonlist,我有一个GridView,它的倒数第二列包含一个文本框(由jQueryUI DatePicker小部件填充)和一个RadioButtonList。另外,最后一列有一个检查图像(类似于stackoverflow的“已回答”和“未回答”检查) 我需要的是能够检测,最好是使用Javascript,当用户将文本框的值更改为某个值(在我的例子中是一个日期)并选择了单选按钮,然后将图像源从空复选标记更改为彩色复选标记(再次,类似于stackoverflow中的答案复选标记)时,如果用户从文本框中删除所有文本
<asp:GridView ID="gvBlah" runat="server" AutoGenerateColumns="false">
<Columns>
...
<asp:TemplateField>
<HeaderTemplate>
<asp:Label ID="warrantyDateHeader" Text="Warranty Date" ToolTip="Choose a date..." runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txtWarrantyDate" runat="server" CssClass="datepicker" />
<asp:RadioButtonList ID="rblWarrantyDate" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Value="0" Text="Start" />
<asp:ListItem Value="1" Text="End" />
</asp:RadioButtonList>
</ItemTemplate>
<ItemStyle VerticalAlign="Top" HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:Image ID="imgRowChecked" ImageUrl="~/images/check-empty.png" AlternateText="Not Selected" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
我认为你没有在gridview中实现多个编辑。下面是jQuery代码,它将测试日期文本框中的长度 我建议您将图像设置为CSS类,如下所示:
div.check-empty {
background: url("/images/check-empty.png") repeat scroll 0 0 transparent;
height: 11px;
width: 55px;
}
div.checked-green {
background: url("/images/check-green.png") repeat scroll 0 0 transparent;
height: 11px;
width: 55px;
}
<div class="check-empty"></div>
并在gridview中提供如下默认值:
div.check-empty {
background: url("/images/check-empty.png") repeat scroll 0 0 transparent;
height: 11px;
width: 55px;
}
div.checked-green {
background: url("/images/check-green.png") repeat scroll 0 0 transparent;
height: 11px;
width: 55px;
}
<div class="check-empty"></div>
$("rblWarrantyDate").change(function()
{
if ($(this).val() == '1')
{
WarrantyStatus = 1;
if(dateStatus != 0)
$(".check-empty").addClass("checked-green");
}
else
WarrantyStatus = 0;
});
这似乎只有在用户从DateTimePicker中选择日期两次时才起作用。原因是,.blur事件在单击DateTimePicker小部件时触发,发生在TextBox值更改为日期之前。我试图使用.change事件,但似乎不起作用。有什么建议吗?我不能再编辑上面的评论了,但是,似乎textbox.change事件正在根据需要触发。但是,由于某种原因,radiobuttonlist.change事件不再触发。我终于让所有这些都起作用了。谢谢Sayed的回答。请参阅我上面的更新以查看最终使用的解决方案(以及您在解决方案中提供的css类)。我现在确实有一个问题。因为这些控件存储在GridView中,所以我需要获取包含所述控件的行的行索引,并且只更改该复选标记。到目前为止,它将所有.chkSerialNumber div的类都更改为check filled。实际上我没有测试这段代码。。。只是给你写了个提示。。。。不管怎样,很高兴你让它工作了。。。谢谢你提出这个问题。。我回忆起我的jQuery。。。还有+1。。。