2014-10-31 77 views
0

我试图确保用户必须从下拉框中选择一些内容,以便我使用JavaScript来检查他们是否从下拉框中选择了某些内容数据被写入数据库。我在DetailView中有一个按钮,我无法在这里访问按钮ID。如果用户没有从下拉列表中选择任何内容,我希望用户在点击插入按钮时发出警告。在下拉菜单的选择不应该是这个“ - 选择公制名称 - ”强制用户从下拉框中进行选择

<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%>

+0

你可以更新你的问题,并解释当他们点击“插入”按钮时发生了什么? – jeuton 2014-10-31 16:25:16

回答

0

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

事情是这样的:

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

我已经尝试过,但java脚本没有发出警告消息,不知道为什么它是.. – moe 2014-10-31 18:19:09

+0

也许是因为国旗总是假?你可以检查一些JavaScript调试工具的标志变量的值?根据我在代码中看到的内容,您似乎在检查您的选择是否已被“选中”,也许您可​​以使用SelectedIndex代替? 而不是检查循环中的下拉列表的值,尝试这样看看是否选择了一个选项:dropdowns.item(i).selectedIndex!==“-1”; – GPierre 2014-10-31 20:26:21

0

如果需要使用客户端的JavaScript指服务器端控件,然后我发现它通常更容易控制的的ClientIDMode设置为“静态” - 然后你可以把它无论你想要什么ID,并且你知道它会在页面上有这个ID,所以你可以编写JavaScript来使用它。

0

这可能是一种方法

通过类名,如下添加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将返回给定的类名元素的数组,以便确保其独特的或使用适当的索引来访问它。

相关问题