在javascript函数中使用ID无法识别所选的下拉列表

时间:2015-11-17 21:49:41

标签: jquery asp.net gridview drop-down-menu jquery-chosen

我在嵌套网格视图中使用了几个jquery选择的下拉列表。当我调用.change事件时,我可以识别所选下拉列表的唯一方法是使用$("select")。问题是我有一个不是所选类型的下拉列表,并且此下拉列表的初始值设置为空字符串,我不希望它具有此下拉列表的选项。因此,当它显示时,它显示为非常窄。 这是函数调用:

 $(function () {
         bindEvents();
     });

    //This change function is when the Device grid is in Insert Mode
    function bindEvents() {
        $(document).on("change", "#recdevgvDDListDeviceNameInsert", function () {
            $("select").prop("disabled", false);
            $("select:not(.chosen-select, .no-chosen)").chosen({
                search_contains: true,
                width: "200px",
                no_results_text: "Sorry, no match!"
            });

            var DeviceSelValue = $(this).val();
//This is the problem...
//I need to set the dropdown to the empty string
//this function call does not work
    //     $("#recdevgvDDListServiceNameInsert").val('');
//This function call does work but sets all of the dropdowns to empty.
           $("select").val('');         
    //       $("#recdevgvDDListServiceNameInsert").children("option").hide();
            $("select").children("option").hide();
            $("select").trigger("chosen:updated");
            //$("#recdevgvDDListServiceNameInsert").trigger("chosen:updated");

            switch (DeviceSelValue) {
                case "1":     
             //       $("#recdevgvDDListServiceNameInsert option[value*='cell']").show();
            //       $("#recdevgvDDListServiceNameInsert").trigger("chosen:updated");
                    $("select option[value*='cell']").show();
                    $("select").trigger("chosen:updated");
                    $("#recdevgvAddressExtInsert").hide();
                    break;
                case "2":
        //          $("#recdevgvDDListServiceNameInsert option[value*='email']").show();
        //          $("#recdevgvDDListServiceNameInsert").trigger("chosen:updated");
                    $("select option[value*='email']").show();
                    $("select").trigger("chosen:updated");
                    $("#recdevgvAddressExtInsert").hide();
                    break;
                case "3":                    
        //          $("#recdevgvDDListServiceNameInsert option[value*='page']").show();
        //          $("#recdevgvDDListServiceNameInsert").trigger("chosen:updated");
                    $("select option[value*='page']").show();
                    $("select").trigger("chosen:updated");
                    $("#recdevgvAddressExtInsert").hide();
                    break;
                default:
                    break;
            }
        });
     };

这是嵌套gridview的标记:

<asp:UpdatePanel ID="updatePnlDeviceNestedGrid" runat="server" UpdateMode="Conditional">
<ContentTemplate>
    <div id="div<%# Eval("RecipientID") %>" style="display:none">
        <asp:GridView ID="RecipientDeviceGridView" runat="server" AutoGenerateColumns="false" CssClass="grid" ShowFooter="true" Caption="Device Information" 
            CaptionAlign="Top" AllowPaging="true" PageSize="3" HorizontalAlign="Left"
             onpageindexchanging="RecipientDeviceGridView_PageIndexChanging" 
             OnPageIndexChanged="RecipientDeviceGridView_PageIndexChanged" 
             onrowcommand="RecipientDeviceGridView_RowCommand" 
             onrowediting="RecipientDeviceGridView_RowEditing"
             onrowupdating="RecipientDeviceGridView_RowUpdating"
             OnRowCancelingEdit="RecipientDeviceGridView_RowCancelingEdit"
             OnRowDeleting="RecipientDeviceGridView_RowDeleting"
             OnRowDataBound="RecipientDeviceGridView_RowDataBound">
            <Columns>
                <asp:TemplateField HeaderText="DeviceID">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvLblDeviceID" runat="server" Text='<%# Bind("DeviceID") %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Device"  ItemStyle-Wrap="false">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvDeviceID" runat="server" Visible="false" Text='<%# Bind("DeviceID") %>'></asp:Label>
                        <asp:Label ID="recdevgvLblDeviceName" runat="server" Text='<%# Bind("DeviceName") %>'></asp:Label>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:Label ID="recdevgvEditDeviceID" runat="server" Visible="false" Text='<%# Bind("DeviceID") %>'></asp:Label>
                        <asp:Label ID="recdevgvEditDeviceName" runat="server" Visible="false" Text='<%# Bind("DeviceName") %>'></asp:Label>
                        <asp:DropDownList ID="recdevgvDDListDeviceName" runat="server" ClientIDMode="Static" 
                            data-placeholder="Choose device…" class="chosen-single">
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="recdevReqValueDDLDeviceNameEdit" runat="server"  
                                ControlToValidate="recdevgvDDListDeviceName" ValidationGroup="recdevEditDeviceValidation" 
                                ErrorMessage="Selection required." CssClass="message-error-dropdown">
                        </asp:RequiredFieldValidator>
                    </EditItemTemplate>
                    <FooterTemplate> 
                        <asp:DropDownList ID="recdevgvDDListDeviceNameInsert" runat="server" ClientIDMode="Static"
                            data-placeholder="Choose device..." class="chosen-single">
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="recdevReqValueDDLDeviceNameInsert" runat="server" InitialValue="0" 
                            ControlToValidate="recdevgvDDListDeviceNameInsert" ValidationGroup="recdevInsertDeviceValidation" 
                            ErrorMessage="Selection required." CssClass="message-error-dropdown">
                        </asp:RequiredFieldValidator>
                    </FooterTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Service Provider">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvLblServiceName" runat="server" Text='<%# Bind("ServiceName") %>'></asp:Label>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:Label ID="recdevgvEditServiceName" runat="server" Visible="false" Text='<%# Bind("ServiceName") %>'></asp:Label>
                        <asp:DropDownList ID="recdevgvDDListServiceName" runat="server" ClientIDMode="Static" 
                            OnSelectedIndexChanged="RecipientDeviceGridView_SelectedIndexChanged_EditServiceName" AutoPostBack="true" EnableViewState="true"
                             data-placeholder="Choose service…" class="chosen-single">
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="recdevReqValueDDLServiceNameEdit" runat="server" 
                                ControlToValidate="recdevgvDDListServiceName" ValidationGroup="recdevEditDeviceValidation" 
                                ErrorMessage="Selection required." CssClass="message-error-dropdown">
                        </asp:RequiredFieldValidator>
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:DropDownList ID="recdevgvDDListServiceNameInsert" runat="server" ClientIDMode="Static" Enabled="false"
                            OnSelectedIndexChanged="RecipientDeviceGridView_SelectedIndexChanged_InsertServiceName" AutoPostBack="true" EnableViewState="true" 
                            data-placeholder="Choose service…" class="chosen-single">
                        </asp:DropDownList>
                        <asp:RequiredFieldValidator ID="recdevReqValueDDLServiceNameInsert" runat="server" InitialValue="0" 
                                ControlToValidate="recdevgvDDListServiceNameInsert" ValidationGroup="recdevInsertDeviceValidation" 
                                ErrorMessage="Selection required." CssClass="message-error-dropdown">
                        </asp:RequiredFieldValidator>
                    </FooterTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Address">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvLblAddress" runat="server" Text='<%# Bind("Address") %>'></asp:Label>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:TextBox ID="recdevgvTxtBoxAddress" runat="server" Text='<%# Bind("Address") %>' ClientIDMode="Static"></asp:TextBox>
                        <asp:Label ID="recdevgvEditAddressExt" runat="server" Visible="false" Text='<%# Bind("ServiceExtension") %>' 
                                ClientIDMode="Static">
                        </asp:Label>
                        <asp:RequiredFieldValidator ID="recdevReqValueAddressEdit" runat="server" 
                                ControlToValidate="recdevgvTxtBoxAddress" ValidationGroup="recdevEditDeviceValidation" 
                                ErrorMessage="Required field." CssClass="message-error">
                        </asp:RequiredFieldValidator>
                        <asp:CustomValidator ID="recdevCustomValAddressEdit" runat="server" ControlToValidate="recdevgvTxtBoxAddress" CssClass="message-error" 
                            ErrorMessage="*" ClientValidationFunction="ValidateAddressEdit" EnableClientScript="true" 
                            ValidationGroup="recdevEditDeviceValidation">
                        </asp:CustomValidator>
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:TextBox ID="recdevgvTxtBoxAddressInsert" runat="server" ClientIDMode="Static"></asp:TextBox>
                        <asp:Label ID="recdevgvAddressExtInsert" runat="server" Visible="false" ClientIDMode="Static"></asp:Label>
                        <asp:RequiredFieldValidator ID="recdevReqValueAddressInsert" runat="server" 
                            ControlToValidate="recdevgvTxtBoxAddressInsert" ValidationGroup="recdevInsertDeviceValidation" 
                            ErrorMessage="Required field." CssClass="message-error">
                        </asp:RequiredFieldValidator>
                        <asp:CustomValidator ID="recdevCustomValAddressInsert" runat="server" ControlToValidate="recdevgvTxtBoxAddressInsert" CssClass="message-error" 
                            ErrorMessage="*" ClientValidationFunction="ValidateAddressInsert" EnableClientScript="true" 
                            ValidationGroup="recdevInsertDeviceValidation">
                        </asp:CustomValidator>
                    </FooterTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Active">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvLblActive" runat="server" Text='<%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %>'></asp:Label>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:DropDownList ID="recdevgvDDListActive" runat="server" class="no-chosen"
                            Text='<%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %>'>
                            <asp:ListItem>Yes</asp:ListItem>
                            <asp:ListItem>No</asp:ListItem>
                        </asp:DropDownList>
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:DropDownList ID="recdevgvDDListActiveInsert" runat="server" class="no-chosen">
                            <asp:ListItem Selected="True">Yes</asp:ListItem>
                            <asp:ListItem>No</asp:ListItem>
                        </asp:DropDownList>
                    </FooterTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Cortext Enabled">
                    <ItemTemplate>
                        <asp:Label ID="recdevgvLblCortextEnabled" runat="server" Text='<%# (Boolean.Parse(Eval("CortextEnabled").ToString())) ? "Yes" : "No" %>'></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Action" ShowHeader="False" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center">
                    <ItemTemplate>
                        <asp:Button ID="recdevgvEditButton" runat="server" CausesValidation="True" CommandName="Edit" 
        Text="Edit" CssClass="gridActionbutton" ValidationGroup="EditDeviceValidation"></asp:Button>

                                                                                                                                                                                                                                                                                                                     

有人可以向我解释为什么选择的下拉列表无法识别ID吗?我在编辑模式时使用类似的函数调用。

感谢

更新 使用'ourmandave'中的建议,ID ID复制控件,我删除了属性ClientModeID = Static,并试图通过这种方式识别控件:

var serviceNameCtrl = document.getElementById('<%= recdevgvDDListServiceNameInsert.ClientID %>');

但是,我必须做错误,因为我不断收到错误'名称'recdevgvDDListServiceNameInsert'在当前上下文中不存在'。任何建议将不胜感激......

0 个答案:

没有答案