0

一旦验证完成并提交表单,我想停止禁用提交按钮,这样我就不会向数据库插入多个。我没有用完整的表单验证更新帖子,因为你们中的大多数人都说这是错误的,但我不这么认为。

这是提交:

<input class="button2" style="border-right:none; font-size:13px;" name="List Item" id="submit" type="submit" value="List Item" />

在 jQuery 验证之下:

   <script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<script src="http://jquery.bassistance.de/validate/additional-methods.js"></script>   

<script>
$( "#UploadForm" ).validate({

  errorLabelContainer: "#messageBox",
  wrapper: "td",

  rules: {  

   <?php if ($type == 'Aution' || $type == 'Both') {  ?> 
    auction_price: {
    required: true,
    number: true,
    min: 1.00
    }, 
    auction_reserve_price: {
    number: true,
    range: [1.00, 500000.00]
    },
    <?php } ?>

    <?php if ($type == 'BuyItNow' || $type == 'Both') {  ?> 
    auction_bin_price: {
    required: true,
    number: true,
    range: [1.00, 500000.00]

    }, <?php } ?>


    Country: {
        required: true
    },

    select3: {
        required: true
    },
    select2: {
        required: true
    },
    auction_postage_type: {
        required: true

    },
        auction_postage_type_price: {
        number: true,
        range: [0.00, 500000.00]
    },

    auction_int_postage_type_price: {
        number: true,
        range: [1.00, 500000.00]
    },

     Europe1: {
        number: true,
        range: [1.00, 500000.00]
    },
     Russia1: {
        number: true,
        range: [1.00, 500000.00]
    },
     NorthAmerica1: {
        number: true,
        range: [1.00, 500000.00]
    },
     Australia1: {
        number: true,
        range: [1.00, 500000.00]
    },
     SouthAmerica1: {
        number: true,
        range: [1.00, 500000.00]
    },
     Africa1: {
        number: true,
        range: [1.00, 500000.00]
    },
     Asia1: {
        number: true,
        range: [1.00, 500000.00]
    },
     MiddleEast1: {
        number: true,
        range: [1.00, 500000.00]
    },


    <?php if ($type == 'BuyItNow') {  ?> 
    auction_item_quantity: {
        required: true,
        digits: true,
        range: [1, 99]
    },
    <?php } ?>

    auction_description: {
    required: true
    },
    auction_int_postage_type: {
    required: true
    },
    listing_type: {
    required: true
    }
  },
  messages: {
    auction_price: "Please Enter Auction Start Price - In Decimal Format, minimum value 1.00",
    auction_reserve_price: "Please Enter Auction Reserve Price - In Decimal Format 0.00",
    auction_bin_price: "Please Enter Buy It Now Price - In Decimal Format, minimum value 1.00",
    select3: "Please Select Main Category",
    select2: "Please Select Sub Category",
    auction_item_quantity: "Please Enter Quentity - min 1 - max 99",
    auction_description: "Please Enter Auction Description -  Min 10, Max 1000 characters",
    listing_type: "Please Select Listing Type",
    auction_postage_type: "Please Select Postage Type",
    auction_int_postage_type_price: "Please Enter International Postage Cost In Decimal Format, minimum value 1.00",
    auction_postage_type_price: "Please Enter Postage Cost In Decimal Format",
    auction_int_postage_type: "Please Select",
    Country: "Please Select Country",

  },
  submitHandler:function(form){
       $('#submit').attr('disable',true).css('pointer-events','none');
  }


});
</script>
4

4 回答 4

4

在您submitHandler禁用提交按钮时:

$("#UploadForm").validate({

   //all your options here

   submitHandler:function(form){
       $('#submit').attr('disabled','disabled');
   }
});

submitHandler仅在成功验证表单时调用。只要它返回true,表单就会在之后正常提交。如果你想更花哨而不禁用提交按钮,你可以有一个全局变量来记住表单是否已经提交,然后在第一次之后从这个函数中返回 false。

第一次提交后禁用提交按钮的工作示例:http: //jsfiddle.net/ryleyb/hHAvD/

于 2013-08-01T20:47:23.753 回答
2

应该适用于任何地方的最简单的方法,显然您将运行您的代码并在必要时重新启用它:

$(document).ready(function(){
    $("#submitBtn").on("click",function(){
        $(this).attr("disabled","disabled");
    });
});

http://jsfiddle.net/calder12/8Syrh/1/

于 2013-08-01T17:52:23.287 回答
0

我遇到了同样的问题,我提出了一个简单的解决方案。从javascript中,每次单击提交时,我都会在cookie中发送一个标志,然后检查服务器端的cookie,如果cookie是有效的,则执行相应的操作,否则将控件重定向给用户。

注意:我是 java 开发人员,所以我没有上传代码,但我认为这也可以在 .net、php 和其他语言中实现。

于 2014-10-21T06:16:13.703 回答
-1

我认为这样的事情应该有效

$( "#UploadForm" ).submit(function(){
  //some other code here
  $('#submit').attr('disable',true).css('pointer-events','none');
});

有一个属性“禁用”通常会阻止按钮可用。指针事件是一个较新的 css 变量,可以和 event.preventDefault(); 做同样的事情。

但是也总是有 preventDefault :

$( "#UploadForm" ).submit(function(){
  //some other code here
  $('#submit').click(function(event){
     event.preventDefault();
  });
});

你在用ajax吗?如果是这样,您可能希望在 ajax 发送其回调后删除禁用属性并将指针事件更改为自动。

为了澄清这一点,我在这里给出的示例只是按照所提出的问题执行并禁用提交按钮。不多不少,不多不少。它可以与验证一起工作,而无需尝试添加任何特殊内容。

于 2013-08-01T17:47:44.333 回答