简体   繁体   English

Asp.net动态gridview与下拉列表

[英]Asp.net dynamic gridview with dropdownlists

I have a dynamic (allows addition of rows on the fly) an ASP gridview that has a dropdownlist in one of its columns. 我有一个动态(允许动态添加行)一个ASP gridview,它的一个列中有一个下拉列表。 I would like to take an action enable/disable the textbox in the column after depending on the selection in the dropdownlist during data entry. 我希望根据数据输入期间下拉列表中的选择,在列中启用/禁用文本框。

Any help will be highly appreciated. 任何帮助将受到高度赞赏。

You can do this easily with jQuery. 您可以使用jQuery轻松完成此操作。 With a bit of modification, you can get it working exactly as you want it to. 通过一些修改,您可以按照您的意愿使其正常工作。

First, add the following to your <head> tag: 首先,将以下内容添加到<head>标记中:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
   $(".ddlClass").change(function () {
      var txt = $(this).closest("tr").find(".txtClass");
      if ($(this).val() == 0) {
         txt.css("background", "#cccccc");
         txt.attr("disabled", "disabled");
      }
      else {
         txt.css("background", "#ffffff");
         txt.attr("disabled","");
      }
    });
});

Next, create your gridview and add template columns for your textbox and dropdown list. 接下来,创建gridview并为文本框和下拉列表添加模板列。 In the code below, notice that the dropdown list has been given a class "ddlClass" and the textbox has been given a class "txtClass". 在下面的代码中,请注意下拉列表已被赋予类“ddlClass”,文本框已被赋予类“txtClass”。 You can change these as you see fit. 您可以根据需要更改这些。

<asp:gridview runat="server" ID="gvw" AutoGenerateColumns="false">
            <Columns>
                <asp:BoundField DataField="field1" />
                <asp:BoundField DataField="field2" />
                <asp:TemplateField HeaderText="Name">
                    <ItemTemplate>
                        <asp:TextBox runat="server" ID="txtName" CssClass="txtClass"></asp:TextBox>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <ItemTemplate>
                        <select class="ddlClass">
                            <option value="1">Enabled</option>
                            <option value="0">Disabled</option>
                        </select>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:gridview>

The .ready function attaches a click event to each dropdownlist with the class "ddlClass". .ready函数将click事件附加到具有类“ddlClass”的每个下拉列表。 When changed, the code will find the textbox with the class "txtClass" in the same row as the dropdownlist and then enable/disable accordingly. 更改后,代码将在下拉列表的同一行中找到类“txtClass”的文本框,然后相应地启用/禁用。

Well you can use Javascript if you are familiar with that. 那么你可以使用Javascript,如果你熟悉它。 I recommend using JQuery since its a query language for transversing through the DOM. 我推荐使用JQuery,因为它是一种用于遍历DOM的查询语言。

But if you are not familiar with Javascript then I recommend adding a SelectionChangedEvent on your DropDownList and then in the code behind for your page in the SelectionChangedEvent handler: Cast the sender object to a DropDownList and then get the parent of that object which would be the GridViewRow. 但是如果您不熟悉Javascript,那么我建议您在DropDownList上添加SelectionChangedEvent,然后在SelectionChangedEvent处理程序中为您的页面添加代码:将发送方对象转换为DropDownList,然后获取该对象的父级,这将是GridViewRow。

With that GridViewRow you can use the FindControl method to get a reference to the TextBox in the same row and then you can enable it or disable it. 使用GridViewRow,您可以使用FindControl方法获取对同一行中TextBox的引用,然后您可以启用它或禁用它。

If you dont like the page refresh (post-back) everytime they change a selection in your dropdownlist then wrap your grid in an UpdatePanel. 如果您不希望页面刷新(回发后)每次更改下拉列表中的选择,则将网格包装在UpdatePanel中。

Let me know if you are having a hard time with this and I'll post code to 1 of the above solutions. 如果您对此感到困难,请告诉我,我会将代码发布到上述解决方案之一。 Just let me know which one you are most comfortable with. 请告诉我您最熟悉哪一个。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM