Question

我正在尝试确保用户必须从下拉框中选择一些内容，因此我使用javascript检查他们是否在将数据写入数据库之前从下拉框中选择了某些内容。我在DetailView中有一个按钮，我无法在此处访问按钮ID。我希望用户在点击插入按钮时收到警告，如果他们没有从下拉列表中选择任何内容。下拉列表中的选择不应该是＆＃34; - 选择度量标准名称 - ＆＃34;

<asp:DetailsView ID="DV_InputForm" runat="server" Height="69px" Width="763px" AutoGenerateRows="False"
                CellPadding="3" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" OnItemInserting="DV_InputForm_ItemInserting"
                OnModeChanging="DV_InputForm_ModeChanging" BackColor="#DEBA84" DefaultMode="Insert"
                CellSpacing="2" Style="margin-top: 0px">

                <Fields>
                    <asp:TemplateField HeaderText="Metric Name:">
                        <ItemTemplate>
                            <asp:Label ID="lblMetricName" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MetricName") %>'></asp:Label>
                        </ItemTemplate>
                        <EditItemTemplate>

                            <asp:DropDownList ID="ddl_NewMetricName" DataTextField="NAME" DataValueField="NAME"
                                runat="server" AutoPostBack="false" Width="400" Height="25" AppendDataBoundItems="true"
                                DataSourceID="DD_METRIC_DS">
                                <asp:ListItem Text="--Select Metric Name--" Value="--Select Metric Name"></asp:ListItem>
                            </asp:DropDownList>

                        </EditItemTemplate>
                    </asp:TemplateField>

                    <asp:TemplateField ShowHeader="False">
                        <ItemTemplate>
                            <asp:Button ID="btnNew" runat="server" CausesValidation="False" CommandName="New"
                                Text="Create New Server Monitoring" Font-Bold="True" BorderColor="#003366" BorderStyle="Groove"
                                Height="30px" />
                        </ItemTemplate>
                        <InsertItemTemplate>
                            <asp:Button ID="Button1" runat="server" CausesValidation="True" CommandName="Insert" OnClientClick="return validate();"
                                Text="Insert" />
                            &nbsp;<asp:Button ID="Button2" runat="server" CausesValidation="False" CommandName="Cancel"
                                Text="Cancel" />
                        </InsertItemTemplate>
                    </asp:TemplateField>
                </Fields>
                <HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White" />
                <EditRowStyle BackColor="#FFFFCC" Font-Bold="True" ForeColor="#003366" />

这是我的javascript：

  <script type="text/javascript">
         function validate() {
             var flag = true;
             var dropdowns = new Array(); //Create array to hold all the dropdown lists.
             var gridview = document.getElementById('<%=DV_InputForm.ClientID%>'); //GridView1 is the id of ur gridview.
            dropdowns = gridview.getElementsByTagName('Select'); //Get all dropdown lists contained in GridView1.
            for (var i = 0; i < dropdowns.length; i++) {
                if (dropdowns.item(i).value == 'Select') //If dropdown has no selected value
                {
                    flag = false;
                    break; //break the loop as there is no need to check further.
                }
            }
            if (!flag) {
                alert('Please make selection from the drop-down and click the insert button again.  Thanks');
                document.getElementById('<%=Button1.ClientID%>').style.visibility = 'hidden';
            }
            return flag;
        }
</script> 

                    <RowStyle BackColor="#CCCCCC" ForeColor="#8C4510" />
                </asp:DetailsView>

我现在无法编译它，因为它不喜欢这样：<%=Button1.ClientID%>我在Button1下面得到红线。看来我在DetailView中访问Button1的方式是错误的。 <%=Button1.ClientID%>

Answer 1

您需要在尝试访问该按钮之前找到该按钮的属性，因为它在您的详细信息视图中。

这样的事情：

<%=((Button)DV_InputForm.FindControl("Button1")).ClientID%>

Answer 2

如果你需要使用客户端JavaScript引用服务器端控件，那么我发现将控件的clientidmode设置为'static'通常更容易 - 然后你可以给它任何你想要的ID，你知道它会有该页面上的ID，因此您可以编写JavaScript以使用它。

Answer 3

这可能是一种方法

将CssClass属性添加到按钮

<asp:Button ID="Button1" runat="server" CausesValidation="True" CommandName="Insert" OnClientClick="return validate();" CssClass="UniqueClass"
                                Text="Insert" />

并按类名访问它。

  var btn= document.getElementsByClassName("UniqueClass");
  var Button1 = btn[0];

<强>当心

getElementsByClassName将返回给定类名的元素数组，因此请确保其唯一或使用适当的索引访问它。

强制用户从下拉框中进行选择

3 个答案: