【问题标题】:Validating multiple text boxes in single JavaScript Function在单个 JavaScript 函数中验证多个文本框
【发布时间】:2017-10-06 07:29:29
【问题描述】:

我有 7 个文本框,我想验证为必填字段 OnClientClick 单击名为“更新”的按钮 那么我有什么办法可以使用Javascript来做到这一点 我已经尝试过这段代码,但它不能作为其中之一工作 ps:我是JS新手

   function fnCheck(val) {
            var v = val.id.split('_')[1];
            var merter = document.getElementById('GridSubMeter_' + v + '_txtMeterIdn').value.trim();
            var Billper = document.getElementById('GridSubMeter_' + v + '_txBillPer').value.trim()
            var Endkwh = document.getElementById('GridSubMeter_' + v + '_txEndKwh').value.trim();
            var startkwh = document.getElementById('GridSubMeter_' + v + '_txStartKwh').value.trim();
            var ReadEndDate = document.getElementById('GridSubMeter_' + v + '_txReadEndDate').value.trim();
            var ReadStartDate = document.getElementById('GridSubMeter_' + v + '_txReadStartDate').value.trim();
            var CTFACT = document.getElementById('GridSubMeter_' + v + '_txCTFact').value.trim();
            if (merter != '') {
                return true;
            }
            else {
                alert("Meter Identifier is Required Field");
            return false;
        }

        if (Billper != '') {
            return true;
        }
        else {
            alert("Bill Period is Required Field");
            return false;
        }

        if (Endkwh != '') {
            return true;
        }
        else {
            alert("EndKwh is Required Field");
            return false;
        }
        if (startkwh != '') {
            return true;
        }
        else {
            alert("StartKwh is Required Field");
            return false;
        }
        if (ReadEndDate != '') {
            return true;
        }
        else {
            alert("Read EndDate is Required Field");
            return false;
        }

        if (ReadStartDate != '') {
            return true;
        }
        else {
            alert("Read StartDate is Required Field");
            return false;
        }
        if (CTFACT != '') {
            return true;
        }
        else
        { alert("CT Factor is Required Field");
        return false;
        }
        }
 <asp:Button ID="btn_Update" Style="background-color: #B2DE94; width: 40px"  CausesValidation="false" runat="server"  OnClientClick="fnCheck(this);" Text="Update" CommandName="Update" />

【问题讨论】:

  • 你为什么不用RequiredFieldValidator
  • 已经尝试过了,但由于某些奇怪的原因在可编辑的网格视图中无法正常工作
  • @KarthickRaju 没有办法通过 JS 验证吗?
  • @KarthickRaju 使用 JS 解决了请查看

标签: javascript asp.net validation


【解决方案1】:

试试下面

<asp:TemplateField HeaderText="">
      <ItemTemplate>
          <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
           <asp:RequiredFieldValidator ID="rfv" runat="server" ControlToValidate="TextBox3" ValidationGroup="gridview" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
      </ItemTemplate>
        </asp:TemplateField>
      <asp:TemplateField HeaderText="">
            <ItemTemplate>
                <asp:Button ID="Button2" runat="server" Text="Button" ValidationGroup="gridview" CausesValidation="true" />
            </ItemTemplate>
        </asp:TemplateField>

代码取自here

我已通过示例项目验证并适用于您的场景

【讨论】:

  • 什么是JS解决方案?如果您使用 GridView,那么它就是 asp.net,对吗?如果是这样,您可以只使用RequiredFieldValidator 来实现相同的效果。此场景不需要 JS 代码。就像我说的,我尝试了代码,它为该字段设置了错误消息
  • 如果必需的验证器正在工作,我就不会使用 JS
  • 对我来说听起来像是X-Y Problem。尝试修复原始问题:验证器控件不起作用。
  • 是的 VDWWD。我不知道它对 Deepak Jain 是如何不起作用的。我已经发布了 2 个带有屏幕截图的工作代码。希望,问题会为他解决
  • 实际上我已经做了 CausesValidation="false" 因为我的 rowupdating 事件因此而失败@KarthickRaju
【解决方案2】:

迪帕克,

下面是我的 Gridview 代码

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="DataKeyId" DataSourceID="SqlDataSource1" EnableModelValidation="True">
            <Columns>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:Button ID="Button2" runat="server" Text="Button" ValidationGroup="gridview" CausesValidation="true" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="rfv11" runat="server" ControlToValidate="TextBox1" ValidationGroup="gridview" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="rfv2" runat="server" ControlToValidate="TextBox2" ValidationGroup="gridview" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="rfv3" runat="server" ControlToValidate="TextBox3" ValidationGroup="gridview" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="">
                    <ItemTemplate>
                        <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="rfv4" runat="server" ControlToValidate="TextBox4" ValidationGroup="gridview" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                    </ItemTemplate>
                </asp:TemplateField>                    
            </Columns>
        </asp:GridView>

点击GridView里面的按钮avail,会出现下面的附件错误

【讨论】:

    【解决方案3】:

    下面是在行级别抛出错误消息的另一组版本

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="YourDataKey" DataSourceID="SqlDataSource1" EnableModelValidation="True">
                <Columns>
                    <asp:TemplateField HeaderText="">
                        <ItemTemplate>
                            <asp:Button ID="Button2" runat="server" Text="Button" ValidationGroup = '<%# "Group_" + Container.DataItemIndex %>' CausesValidation="true" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="">
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rfv1" runat="server" ControlToValidate="TextBox1" ValidationGroup = '<%# "Group_" + Container.DataItemIndex %>'  ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="">
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rfv2" runat="server" ControlToValidate="TextBox2" ValidationGroup = '<%# "Group_" + Container.DataItemIndex %>'  ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rfv3" runat="server" ControlToValidate="TextBox3" ValidationGroup = '<%# "Group_" + Container.DataItemIndex %>' ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="">
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rfv4" runat="server" ControlToValidate="TextBox4" ValidationGroup = '<%# "Group_" + Container.DataItemIndex %>' ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
                        </ItemTemplate>
                    </asp:TemplateField>                    
                </Columns>
            </asp:GridView>
    

    在下面的附件中单击第三行按钮,第二列具有值。因此,该行的其余控件出现错误

    【讨论】:

      【解决方案4】:

      好的,我已经在我的 JS 函数上工作了,它对我有用。希望它会 为其他人工作。在我的代码中,我采用了一个变量

      success 作为一个标志工作,我正在检查它两次,然后 最后返回true,这样如果其中一个文本框不为空 而其他不是它不会返回true。 抱歉编辑不佳

       function fnCheck(val) {
              var success = true;
              var v = val.id.split('_')[1];
              var merter = document.getElementById('GridSubMeter_' + v + '_txtMeterIdn').value.trim();
              var Billper = document.getElementById('GridSubMeter_' + v + '_txBillPer').value.trim()
              var Endkwh = document.getElementById('GridSubMeter_' + v + '_txEndKwh').value.trim();
              var startkwh = document.getElementById('GridSubMeter_' + v + '_txStartKwh').value.trim();
              var ReadEndDate = document.getElementById('GridSubMeter_' + v + '_txReadEndDate').value.trim();
              var ReadStartDate = document.getElementById('GridSubMeter_' + v + '_txReadStartDate').value.trim();
              var CTFACT = document.getElementById('GridSubMeter_' + v + '_txCTFact').value.trim();
              debugger;
              if (merter != '') {
      
              }
              else {
                  alert("Meter Identifier is Required Field");
                  success = false;
          }
      
          if (Billper != '') {
      
          }
          else {
              alert("Bill Period is Required Field");
              success = false;
          }
      
          if (Endkwh != '') {
      
          }
          else {
              alert("EndKwh is Required Field");
              success = false;
          }
          if (startkwh != '') {
      
          }
          else {
              alert("StartKwh is Required Field");
              success = false;
          }
          if (ReadEndDate != '') {
      
          }
          else {
              alert("Read EndDate is Required Field");
              success = false;
          }
      
          if (ReadStartDate != '') {
      
          }
          else {
              alert("Read StartDate is Required Field");
              success = false;
          }
          if (CTFACT != '') {
      
          }
          else
          { alert("CT Factor is Required Field");
          success = false;
      }
      
      return success;
      
          }
      

      onclientclick

      <asp:Button ID="btn_Update" Style="background-color: #B2DE94; width: 40px"  CausesValidation="false" runat="server"  OnClientClick="return fnCheck(this);" Text="Update" CommandName="Update" />
      

      【讨论】:

        猜你喜欢
        • 2012-02-03
        • 1970-01-01
        • 1970-01-01
        • 2014-06-23
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多