使用jQuery

时间:2017-07-06 14:39:07

标签: c# jquery asp.net gridview

早上好,我想知道你是否可以帮我在gridview上应用一些必要的逻辑。我有一个asp.net gridview,每列有几个控件,下拉列表,文本框,复选框等。基于dropdowlist更改我想要执行或修改同一行中的其他下拉列表。例如,这是当前的gridview:

                   <asp:GridView ID="gridScopeItem" runat="server" AllowPaging="True"  DataKeyNames="ItemID" AutoGenerateColumns="False" OnPageIndexChanging="gridScopeItem_PageIndexChanging" OnRowCommand="gridScopeItem_RowCommand" OnSelectedIndexChanged="gridScopeItem_SelectedIndexChanged"
                        OnRowDataBound="gridScopeItem_RowDataBound" CssClass="Grid" AlternatingRowStyle-CssClass="alt" PagerStyle-CssClass="pgr" OnRowUpdating="gridScopeItem_RowUpdating" OnRowCancelingEdit="gridScopeItem_RowCancelingEdit" OnRowEditing="gridScopeItem_RowEditing" OnRowUpdated="gridScopeItem_RowUpdated" PageSize="1" Caption="Scope Items">
                    <AlternatingRowStyle CssClass="alt" />
                    <Columns>
                        <asp:BoundField DataField="ScopeItemId"  HeaderText="ID" HeaderStyle-CssClass="hiddencol" ItemStyle-CssClass="hiddencol">
                        <HeaderStyle CssClass="hiddencol" />
                        <ItemStyle CssClass="hiddencol" />
                        </asp:BoundField>
                        <asp:BoundField DataField="ItemID" HeaderText="Item ID">
                        <ItemStyle CssClass="hideItemID" />
                        <HeaderStyle CssClass="hideItemID" />
                        </asp:BoundField>
                        <asp:TemplateField HeaderText="Re-Inspect?" Visible="false">
                            <ItemTemplate >
                                <asp:TextBox ID="txtItemID" runat="server" Text='<%#Bind("ItemID") %>' Visible="false"></asp:TextBox>
                            </ItemTemplate>
                        </asp:TemplateField>   
                         <asp:BoundField DataField="Location" HeaderText="Location" ReadOnly="true"/>                        
                        <asp:TemplateField HeaderText="CAT" >
                            <ItemTemplate>
                                <asp:HyperLink id="scopeitemdetail" runat="server" title="See full record detail" style="cursor: pointer; cursor:hand;" Text='<%# Bind("Cat") %>' ReadOnly="true"></asp:HyperLink>
                                </ItemTemplate>
                        </asp:TemplateField>
                        <asp:BoundField DataField="Cat" HeaderText="CAT" ReadOnly="true"/>
                        <asp:BoundField DataField="Sel" HeaderText="SEL" ReadOnly="true"/>
                        <asp:BoundField DataField="Activity" HeaderText="ACT" ReadOnly="true"/>
                        <asp:BoundField DataField="SpecDetailedDescription" ReadOnly="true" HeaderText="Description" >
                        <HeaderStyle Width="100%" />
                        </asp:BoundField>
                        <asp:BoundField DataField="Quantity" HeaderText="QTY" ReadOnly="true">
                           <ItemStyle HorizontalAlign="Center" />
                        </asp:BoundField>
                        <asp:BoundField DataField="Unit" HeaderText="Unit" ReadOnly="true" >
                        <ItemStyle HorizontalAlign="Center" />
                        </asp:BoundField>
                        <asp:TemplateField HeaderText="Result" ControlStyle-CssClass="clsresult">
                            <ItemTemplate>
                                <asp:Label ID="lblResult" runat="server" Text='<%# Eval("Result") %>' Visible="false" />
                                <asp:DropDownList ID="ddlResultDescription" runat="server" DataTextField="ResultDescription" DataValueField="Result" SelectedValue='<%# Bind ("Result") %>' Font-Size="X-Small">
                                    <asp:ListItem Value="0">Select</asp:ListItem>
                                    <asp:ListItem Value="1">Not Insp</asp:ListItem>
                                    <asp:ListItem Value="2">Def</asp:ListItem>
                                    <asp:ListItem Value="3">Non Def</asp:ListItem>
                                </asp:DropDownList>
                            </ItemTemplate>
                            <ControlStyle CssClass="clsresult" />
                            <ItemStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="%Done" ControlStyle-CssClass="clspercent">
                            <ItemTemplate>
                                <asp:DropDownList ID="ddlPercentDone" runat="server" DataTextField="PercentDone" DataValueField="PercentDone" SelectedValue='<%# Bind ("PercentDone") %>'>
                                    <asp:ListItem></asp:ListItem>
                                    <asp:ListItem>0%</asp:ListItem>
                                    <asp:ListItem>25%</asp:ListItem>
                                    <asp:ListItem>50%</asp:ListItem>
                                    <asp:ListItem>75%</asp:ListItem>
                                    <asp:ListItem>100%</asp:ListItem>
                                    <asp:ListItem>Full SJO</asp:ListItem>
                                    <asp:ListItem>Partial SJO</asp:ListItem>
                                </asp:DropDownList>
                            </ItemTemplate>
                            <ControlStyle CssClass="clspercent" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Re-Inspect?" ControlStyle-CssClass="clsreinspect">
                            <ItemTemplate>
                                <asp:DropDownList ID="ddlReInspected" runat="server" DataTextField="ReInspect" DataValueField="ReInspect" SelectedValue='<%# Bind ("ReInspect") %>'>
                                    <asp:ListItem></asp:ListItem>
                                    <asp:ListItem>Yes</asp:ListItem>
                                    <asp:ListItem>No</asp:ListItem>
                                </asp:DropDownList>
                            </ItemTemplate>
                            <ControlStyle CssClass="clsreinspect"/>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Inspection Comments" ControlStyle-CssClass="clscomment">
                            <ItemTemplate>
                                <asp:TextBox ID="txtComments" runat="server" Text='<%#Bind("Comments") %>' TextMode="MultiLine" style="overflow: auto;"></asp:TextBox>
                            </ItemTemplate>
                            <ControlStyle CssClass="clscomment" />
                        </asp:TemplateField>
                        <asp:BoundField DataField="PictureQty" HeaderText="Pcts" ReadOnly="true">
                        <ItemStyle HorizontalAlign="Center" />
                        </asp:BoundField>
                        <asp:TemplateField HeaderText="Ready to Inspect" ControlStyle-CssClass="clsreadytoinspect">
                            <ItemTemplate>
                                <asp:DropDownList ID="ddlReadyToInspect" runat="server" DataTextField="ReadyToInspect" DataValueField="ReadyToInspect" SelectedValue='<%# Bind ("ReadyToInspect") %>'>
                                    <asp:ListItem Value="No">No</asp:ListItem>
                                    <asp:ListItem Value="Yes">Yes</asp:ListItem>                                        
                                </asp:DropDownList>
                            </ItemTemplate>
                            <ControlStyle CssClass="clsreadytoinspect"/>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Financial Hold" ControlStyle-CssClass="clsfinancialhold">
                            <ItemTemplate>
                                <asp:CheckBox ID="chkFinancialHold" runat="server" Checked='<%# Bind("FinancialHold") %>' Enabled="false"></asp:CheckBox>
                            </ItemTemplate>
                            <ControlStyle CssClass="clsfinancialhold"/>
                            <ItemStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:CommandField ShowEditButton="true" CausesValidation="false" HeaderText="Edit">
                        <HeaderStyle CssClass="hideButtonClumn" />
                        <ItemStyle CssClass="hideButtonClumn" />
                        </asp:CommandField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:LinkButton runat="server" ID="Link1" CommandName="detail" CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" Text="<img src='img/upload.png' title= 'Upload Pictures' style='max-height: 20px; max-width: 30px;' />" />
                            </ItemTemplate>
                        </asp:TemplateField>
                       <%-- <asp:ButtonField ButtonType="Link" Text="<img src='img/upload.png' title= 'Upload Pictures' style='max-height: 20px; max-width: 30px;' />" CommandName="detail"></asp:ButtonField>--%>
                    </Columns>
                    <PagerStyle CssClass="pgr" />
                </asp:GridView>

逻辑1:如果列上的下拉列表&#34;结果&#34; (class:clsresult)改为&#39; Def&#39; (值2),我希望类clspercent(%Done)的下拉列表更改为0%并获得锁定。 逻辑2:如果相同的dorpdownlist结果变为&#39; Non Def&#39; (值3),因此同一行中的结果下拉列表仅包含可用项:&#39; 100%&#39;和&#39;部分SJO&#39;,其他人得到锁定或只是删除它们(仅在这一特定行),以及&#34;重新检查&#34;下拉列表将更改为值&#39;否&#39;。 对于这些逻辑,这就是我在jQuery上所做的:

$(function () {
    // Find all of your drop downs within your Grid and initialize the enabled, disabled ones
    $('#ContentPlaceHolder1_pGridScopeItems [id$=".clsresult"]').each(function () {
        // Based on the selection, enable or disable certain elements
        var $row = $(this).closest('tr');

        // Check the percent field and enable/disabled and change the value
        $row.find('[id$=".clspercent"]').prop('disabled', $(this).val() == "2");
        // So in the second code line I change the value to 0 and change Re-Inspect to Yes
        $row.find('[id$=".clspercent"]').val('0%', $(this).val() == "2");   $row.find('[id$=".clsreinspect"]').val('Yes', $(this).val() == "2");
    });

    // Whenever one of your DropDownLists is changed, perform the appropriate logic
    $('#ContentPlaceHolder1_pGridScopeItems [id$=".clsresult"]').change(function () {
        // Based on the selection, enable or disable certain elements
        var $row = $(this).closest('tr');

        // Check the percent and enable/disabled
        $row.find('[id$=".clspercent"]').prop('disabled', $(this).val() == "2");
        // Do the same thing for Reinspect field
        $row.find('[id$=".clsreinspect"]').prop('disabled', $(this).val() == "2");   $row.find('[id$=".clsreinspect"]').val('Yes', $(this).val() == "2");

    });
});

正如您所看到的,我使用母版页,这就是为什么元素ID更改为ContentPlaceHolder1_Name#,而我更愿意使用该类来引用控件。最后,我在两个事件中应用逻辑,当下拉列表更改时以及页面加载时。我非常感谢以最佳方式或更好的做法实现这一目标的任何帮助。我想念第二个逻辑,第一个逻辑不正常。

0 个答案:

没有答案