vb.net中带有RadioButtonList控件的嵌套GridView
vb.net中带有RadioButtonList控件的嵌套GridView
提问于 2019-03-13 06:20:22
我有两个GridViews嵌套在另一个单选按钮列表控件中。第一个网格视图的单选按钮列表具有Yes、No、N/A等列表项。当单击"No“列表项时，应显示嵌套网格视图及其关联的单选按钮。
加载页面时，我可以看到所有的网格视图及其关联的单选按钮，但单击"no“单选按钮时，gridview2不会显示或隐藏。我使用javascript实现了这个功能，但没有达到预期的效果。我提供了我的vb.net代码和aspx代码。任何帮助都是非常感谢的。
Vb.net代码
公共类_Default
Inherits Page
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
GridView1.DataSource = GetData("select * from Questions")
GridView1.DataBind()
End If
End Sub
Private Shared Function GetData(query As String) As DataTable
Dim strConnString As String = ConfigurationManager.ConnectionStrings("String").ConnectionString
Using con As New SqlConnection(strConnString)
Using cmd As New SqlCommand()
cmd.CommandText = query
Using sda As New SqlDataAdapter()
cmd.Connection = con
sda.SelectCommand = cmd
Using ds As New DataSet()
Dim dt As New DataTable()
sda.Fill(dt)
Return dt
End Using
End Using
End Using
End Using
End Function
Protected Sub OnRowDataBound(sender As Object, e As GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow Then
Dim questid As String = GridView1.DataKeys(e.Row.RowIndex).Value.ToString()
Dim GridView2 As GridView = TryCast(e.Row.FindControl("GridView2"), GridView)
GridView2.DataSource = GetData(String.Format("SELECT * from Standards where Questions= '{0}'", questid))
GridView2.DataBind()
End If
End Sub结束类
Aspx页面
<%@ Page Title="Home Page" Language="VB" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.vb" Inherits="WebApplication1._Default" %>
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" GridLines="None" CssClass="Grid"
DataKeyNames="QstnID" OnRowDataBound="OnRowDataBound">
<Columns>
<asp:BoundField DataField="Question" HeaderText="Questions" />
<asp:TemplateField>
<ItemTemplate>
<asp:RadioButtonList ID="QuestList" runat="server" DataValueField="Question" RepeatDirection="Horizontal">
<asp:ListItem Enabled="False" Style="display: none" Text="" Value="0"></asp:ListItem>
<asp:ListItem Value="Yes">Yes</asp:ListItem>
<asp:ListItem Value="No">No</asp:ListItem>
<asp:ListItem Value="N/A">N/A</asp:ListItem>
</asp:RadioButtonList>
<br>
</br>
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" CssClass="ChildGrid" GridLines="None">
<Columns>
<asp:BoundField DataField="Description" HeaderText="Standards" />
<asp:TemplateField>
<ItemTemplate>
<asp:RadioButtonList ID="StandList" runat="server" DataValueField="Description" RepeatDirection="Horizontal">
<asp:ListItem Enabled="False" Style="display: none" Text="" Value="0"></asp:ListItem>
<asp:ListItem Value="Yes">Yes</asp:ListItem>
<asp:ListItem Value="No" Selected="False">No</asp:ListItem>
<asp:ListItem Value="N/A">N/A</asp:ListItem>
</asp:RadioButtonList>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<br>
</br>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="Response" runat="server" ConnectionString="<%$ ConnectionStrings:String1%>" SelectCommand="SELECT [Description] FROM [Standards]"></asp:SqlDataSource>
<asp:SqlDataSource ID="WcmQC" runat="server" ConnectionString="<%$ ConnectionStrings:String2 %>" SelectCommand="SELECT [Question] FROM [Questions]"></asp:SqlDataSource>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
$(document).ready(function () {
$('#QuestList input').click(function () {
var value = $('#QuestList input:checked').val();
if (value == "Yes") {
$("#GridView2").show();
else {
$("#GridView2").hide();
}
}
});
});
</script>
</asp:Content>回答 2
Stack Overflow用户
发布于 2019-03-13 06:31:56
在你的JS中，你使用了id "QuestList"：
$('#QuestList input').click(function () {
因为它是一个服务器控件，所以它将有一个由"QuestList“组成的客户端id，前面是容器名称的层次结构。而且它也在一个中继器/网格中，这使得它的id变得更加复杂。
使用class而不是id来确定列表的目标。如下所示：
<asp:RadioButtonList ID="QuestList" CssClass="MyListClass" runat="server" DataValueField="Question" RepeatDirection="Horizontal">
和
$('.MyListClass input').click(function () {
Stack Overflow用户
发布于 2019-03-14 20:47:46
我试用了您的代码，发现了几个JS错误，它们阻止了事件处理的工作。我在下面的代码示例中显示了一些修复，它们是：
- 当你拉入JQuery脚本时，你需要用
</script>来结束这一行。你不能像你尝试的那样把它和一个通用的脚本块合并。 - 提到了我的第一个答案(关于客户端和服务器id的问题)，你也需要为#GridView2修复你的id。在这种情况下，我可能会使用服务器脚本块来获取客户端id (下面将对此进行详细介绍)。
- 您的
if语句中的大括号不匹配。您不需要在第一行使用大括号，但是如果您更喜欢这种样式并包含它，那么在我建议使用elseif (value == "Yes") { $("#GridView2").show(); else - Whereas而不是id来附加单击处理程序之前，您将缺少匹配的样式，请不要在处理程序中执行相同的操作来指向被单击的单选按钮。该类有多个单选按钮。而应使用
this来确定事件源对象(单击的单选按钮)的目标。
下面为您复制的是我在应用上述修复后最终使用的工作JS。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.MyListClass input').click(function () {
alert($(this).val());
<%-- if (this.value == "Yes")
$("#GridView2").show();
else
$("#GridView2").hide(); --%>
});
});
</script>正如您所看到的，它目前只显示一个警报，因为恐怕您仍有一些调查和设计要做，以决定如何在您的事件处理程序中针对正确的GridView2实例。然而，这将非常容易，有不止一种方法，只要有一点耐心，你现在应该能够通过我给出的其他信息加上一些谷歌搜索来解决这个问题。HTH。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55131489
复制相关文章
相似问题