使用Kendo验证验证多个文本框

时间:2017-04-12 14:44:36

标签: html validation kendo-ui

我有多个文本框,用户可以在其中输入搜索参数来查询Oracle数据库以将数据返回到网格。我很难将这些文本框作为一组进行验证。按组分组我的意思是我想确保至少有一个文本框中包含数据。如果我不这样做,用户可能会带回1600万条记录。这显然需要一段时间,我不能这样做。我尝试过5种不同的方法来做到这一点。我可以验证每个领域,但我不能继续前进,因为每个领域都需要一些东西。同样,我想检查并确保9个文本框中至少有一个文本框中包含某些内容。我为验证码的混乱道歉。我尝试过几种不同的混合方式。

code:
    <div class="col-lg-12 col-md-12">
    <div class="panel panel-primary" style="margin-top:5px;" id="CustHistSearchPanel">
        <div class="panel-heading">
            <h3 class="panel-title"  id="collapseAll" data-toggle="collapse" data-target="#collapsePanelCustHist" href="#collapsePanelCustHist">
                Customer History
            </h3>
        </div>
        <div id="collapsePanelCustHist" class="panel-collapse collapse in">
            <div class="panel-body" id="CustHistSearchPanelBody">
                <form id="CustHistForm"  data-role="validator" novalidate="novalidate">
                    <div class="col-lg-12 col-md-12">
                        <div class="col-lg-3 col-md-3">
                            <div class="form-group">

                                <label for="acctNum">Account Number</label>
                                @Html.TextBox("acctnum", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "acctNum"
                            })

                                <label for="premiseNum">Premise Number</label>
                                @Html.TextBox("premisenumber", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "premiseNum"
                            })

                                <label for="timeFrame" class="control-label">Timeframe</label><br />
                                @Html.RadioButton("timeframe", "1", new { @type = "radio", @class = "formElements", @id = "ALL" }) All&nbsp;&nbsp;
                                @Html.RadioButton("timeframe", "2", new { @type = "radio", @class = "formElements", @id = "LAST5" }) Last 5 Years&nbsp;&nbsp;
                                @Html.RadioButton("timeframe", "3", new { @type = "radio", @class = "formElements", @id = "YTD" }) YTD&nbsp;&nbsp;
                                @Html.RadioButton("timeframe", "4", new { @type = "radio", @class = "formElements", @id = "MTD", @checked = "checked" }) MTD&nbsp;&nbsp;
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3">
                            <div class="form-group">

                                <label for="busLastName">Bus/Last Name</label>
                                @Html.TextBox("buslastname", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "busLastName"
                            })

                                <label for="firstName">First Name</label>
                                @Html.TextBox("firstname", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "firstName"
                            })
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3">
                            <div class="form-group">

                                <label for="houseNum">House Num</label>
                                @Html.TextBox("housenum", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "houseNum"
                            })

                                <label for="street">Street</label>
                                @Html.TextBox("street", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "street"
                            })

                                <label for="cityState">City, State</label>
                                @Html.TextBox("citystate", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "cityState"
                            })
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3">
                            <div class="form-group">


                                <label for="homePhone1">Home Phone</label>
                                @Html.TextBox("homephone", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "homePhone",
                                @type = "text"
                            })
                                <label for="contactPhone">Contact Phone</label>
                                @Html.TextBox("contactphone", "",
                            new
                            {
                                @class = "form-control formElements",
                                @id = "contactPhone"
                            })
                            </div>

                        </div>

                    </div>
                </form>

验证码

**$(function () {
        var formContainer = $("#CustHistForm");
        kendo.init(formContainer);
        formContainer.kendoValidator(
            {
                rules:
                    {
                        customRule: function (input)
                            {
                                var ret// = true;
                                //if (                                         

                                        var allTxtBox = document.getElementsByName ("formValidate");
                                        var valid = false;
                                        for (var i = 0, max = allTxtBox.length; i < max; i++) {
                                            if (allTxtBox[i].value != "") {
                                                valid = true;
                                                break;
                                            }
                                        }

                                        console.log("[name1=" + input.attr("name") + ']  '  + valid);


                                    //((input.is("[id=acctNum]") && input.val == "")
                                        //&& (input.is("[id=premiseNum]") && input.val == ""))


                                        //&& (input.is("[id=premiseNum]") && input.val = "")
                                        //&& input.is("[id=premiseNum]") == ""
                                        //&& input.is("[id=busLastName]") == ""
                                        //&& input.is("[id=firstName]") == ""
                                        //&& input.is("[id=houseNum]") == ""
                                        //&& input.is("[id=street]") == ""
                                        //&& input.is("[id=cityState]") == ""
                                        //&& input.is("[id=homePhone]") == ""
                                    //&& input.is("[id=contactPhone]") == ""

                                        //(input.is("[id=acctNum]"))
                                        //|| (input.is("[id=premiseNum]"))
                                        //|| input.is("[id=busLastName]")
                                        //|| input.is("[id=firstName]")
                                        //|| input.is("[id=houseNum]")
                                        //|| input.is("[id=street]")
                                        //|| input.is("[id=cityState]")
                                        //|| input.is("[id=homePhone]")
                                        //|| input.is("[id=contactPhone]")
                                    //)
                                        {
                                    ret = input.val().match(/^\S+$/) != null;
                                    console.log("[name2=" + input.attr("name") + ']  '  + ret);
                                            //ret = $.trim(input.val()) !== "";
                                            //return input.val() === "true";
                                        }
                                return ret;
                            }
                    },
                messages:
                    {
                        customRule: "At least one field must contain data."
                    }
            }).data("kendoValidator");
    });**

1 个答案:

答案 0 :(得分:0)

jQuery(function () 
  { 
    $("#SubmitCustHistPanelBtn").removeClass('hidden').removeCla‌​ss.'button').attr('d‌​isabled', true); 
    $("#CustHistForm input[type='text']").on('keyup', function () 
        { 
            validate(); 
        }); 
  }) 

  function validate() 
    { 
      console.log("hi"); 
      var valid = false; //default is false 
      var toValidate = $("#CustHistForm input[type='text']"); 

      toValidate.each(function () 
        { 
           if ($(this).val().length > 0) 
              { 
                valid = true; //non-empty element found 
                return false; //break 
              } 
        }); 

       $("#SubmitCustHistPanelBtn").attr('disabled', !valid).toggleClass('button', valid);