1

テキストボックスの入力に基づいて値を更新する更新アクションがあります。検証にはJavaScriptを使用しました。スクリプトと検証は、最初のテキストボックス値に対してのみ正常に機能します。
マイビューコード

     @foreach (var item in Model)
      {     <tr>          
         <td align="right" class="Text_nocolor" valign="top">
      @using (Html.BeginForm("Update", "Cart", new { UserID = Request.QueryString["UserID"] }, FormMethod.Post, new { id = "myForm" }))
     {          
         @Html.Hidden("id", @Request.QueryString["UserID"] as string)
         @Html.Hidden("productid", item.ProductID as string)
         <input id="Quantity" type="text" class="Text_nocolor" name="Quantity" value="@item.Quantity"  onblur="return allownumbers() " maxlength="3"/>  
          @Html.Hidden("unitrate", item.Rate)               
          <input type="submit" value="Edit" class="Text_nocolor" onclick="return RegainFocus();" />
     }
       </td >
<tr>
    }

私が使用したスクリプト：

 <script type="text/javascript">
    function RegainFocus() {
            if ((document.getElementById("Quantity").value).length == 0) {
                document.getElementById("Quantity").focus();
                alert("Quantity cannot be empty");
                document.getElementById("Quantity").value = document.getElementById("Quantity").defaultValue;
                return false;
            }
            else if ((document.getElementById("Quantity").value) > 100) {
                alert("There is no enough inventory for this product to fulfill your order");
                document.getElementById("Quantity").value = document.getElementById("Quantity").defaultValue;
                return false;
            }           
        }
            function allownumbers() {
                var val = parseInt(document.getElementById("Quantity").value);
                if (!val || val < 1) {
                    alert('Please enter a valid value');
                    document.getElementById("Quantity").value = document.getElementById("Quantity").defaultValue;
                    return false;                 
                }
                document.getElementById("Quantity").value = val;
                return true;
            }
    </script>

また、テキストボックスに別のIDを取得するかどうかも確認しました。ただし、すべてのテキストボックスのIDは同じであり、最初のテキストボックスを除く他のテキストボックスでは検証は機能しません。
助言がありますか。

編集 ：：

  function allownumbers() {
            alert('fasfa');
            var elements = document.getElementsByName('Quantity');
            for (var i = 0; i < elements[i].length; i++) {  
                alert(elements);
                if (!elements || elements < 1) {
                    alert('Please enter a valid value');                    
                    return false;
                }
                else if (elements > 100) {
                    alert('Please enter a value less than 100');
                    return false;
                }
            }               
            return true;
        }

モデルには値があり、各テキストボックスには値が含まれています。ただし、要素は値としてNaNのみを返します。

4

2 に答える 2

1

  1. 名前の付いた要素を取得して、それらを反復処理できます。

    var elements = document.getElementsByName('Quantity');
for(var i = 0; i < elements.length; i++){
    //validate elements[i].value
}

  2. 各テキストボックスに一意のIDを指定できます（最初の解決策の方が優れています）

  3. jQuery検証プラグインを使用する

編集：コードを修正する

function allownumbers() {
        var elements = document.getElementsByName('Quantity');
        for (var i = 0; i < elements.length; i++) {  
            if (elements[i].value == '' || elements[i].value < 1) {
                alert('Please enter a valid value');                    
                return false;
            }
            else if (elements[i].value > 100) {
                alert('Please enter a value less than 100');
                return false;
            }
        }               
        return true;
    }​

フィドル： http： //jsfiddle.net/kDVDb/

于 2012-10-31T06:17:45.817 に答える
1

同じIDを持つ複数のDOM要素を持つことはできません。ループでは、テキスト入力ごとに一意のIDを生成してから、検証メソッドを個別に呼び出す必要があります。

または、jQueryの.each（）メソッドを使用して、複数の要素を反復処理することもできます。何かのようなもの：

$('input[name=Quantity]').each(function(index) {
    validation logic here
});
于 2012-10-31T06:19:40.037 に答える