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 回答