0

使用以下代码定义购物车数量输入表单。数量最初必须为空。

表单是通过 ajax 使用 jquery post() 提交的。

提交前如何检查数量是否填写了大于0的整数?

我尝试了下面的代码,但警报框返回 [htmlinputelement],因此检查失败。

    <form class='browse-addtocart-form' action="<%= Url.Action("AddToCartPost", "Store")%>" method="post">
       <input class='amount ui-corner-all' name="quantity" type="number" value=""
     size="3" min="0" step="1" /></span>
    <input type="submit" value="Add to cart" />
       </form>
  <script>    
    $(function() {
$(".browse-addtocart-form").submit(function(event){
    var $form = $(this);
    var serializedData = $form.serialize();
    alert($form[0].quantity);
    if ($form[0].quantity==="" || $form[0].quantity==="0") {
      alert('Please fill quantity with non zero integer');
      event.preventDefault();
      return;
      }
    $.post('<%= Url.Action("AddToCart", "Store")%>',
      serializedData, function(response) {
          $("#cart-status").text(response.Total);
          showMessage(response.Message);
          showFadeOutMessage(response.Message);
        }));
   event.preventDefault();
  });
  });
      </script>

使用 jquery、jquery UI、ASP.NET MVC2。

4

3 回答 3

1

在您的event.preventDefault();. 你可以做 return false;` 这也将停止发送你的帖子,你甚至不需要 event 参数。

正如您已经拥有的那样var serializedData = $form.serialize();,我建议您从那里提取“数量” serializedData.quantity

于 2013-04-24T12:34:01.420 回答
1

最简单的可能是调用 parseInt 并检查它是否不返回 NaN。

var q = parseInt($form[0].quantity, 10);
if(isNaN(q) || q === 0){
  alert('Please fill quantity with non zero integer');
}

编辑添加 base=10 到 parseInt,并使用 isNaN()。如果不添加明确的基数 10,则 parseInt 会将以零开头的字符串误认为是八进制数,十六进制也是如此。

于 2013-04-24T12:34:17.770 回答
1

尝试

$(function() {
    $(".browse-addtocart-form").submit(function(event) {
        var $form = $(this);
        var serializedData = $form.serialize();
        if (this.quantity.value === "" || this.quantity.value === "0") {
            alert('Please fill quantity with non zero integer');
            return false;
        }
        $.post('<%= Url.Action("AddToCart", "Store")%>',
                serializedData, function(response) {
                    $("#cart-status").text(response.Total);
                    showMessage(response.Message);
                    showFadeOutMessage(response.Message);
                });
        return false;
    });
});
于 2013-04-24T12:35:38.480 回答