如何在jquery ajax调用完成后推迟默认表单操作?

时间:2014-07-08 07:25:17

标签: javascript jquery ajax forms

我有这样的表格:

<form class='setPricetInput' method='post' action='mos.php'>
<label>
<span class = 'boldFont'>Your Selling Price:</span>
<input type='text' class='moneyFormat reqPrice' autocomplete='off' name='b2'>
</label>    
<button class='setPriceButton'>set</button>
</form>

这个jquery点击功能:

$(".setPriceButton").click(function(){
$this = $(this);
var $thisForm = $this.parent();
var $detailLine = $this.next(".detailLine");
var buyOrderID = $detailLine.find('.orderID');    
var priceSet =ParseFloat($thisForm.find('.reqPrice').val().replace('$','')).toFixed(2);
var sendData = {'value': buyOrderID, 'type': 'Buy_Order_ID'};
$.getJSON('addToSession.php',sendData);        
var sendData = {'value': priceSet, 'type': 'Price_Set'};
$.getJSON('addToSession.php',sendData);
})   

我希望在jquery点击功能之后运行默认表单操作(mos.php)。 jquery代码将值添加到_SESSION,并且mos.php正确运行需要它。如何在jquery函数完成后推迟默认操作?

2 个答案:

答案 0 :(得分:1)

要在表单上运行默认提交,您需要运行.submit()。通常我们只是把它放在一个回调中,但由于你有2个ajax调用运行,我们需要确保两个在我们提交表单之前完成。为此,我们在.click范围之外创建变量和函数。接下来,我们创建一个在$.getJSON完成每个firstFinished时运行的函数。现在,第一次运行该函数时,它会检查true是否设置为true,如果不是,那么它会将其设置为$.getJSON以便第二次电话会提交表格。这样,如果第一个var firstFinished = false, getJSONDone = function(){ if(!firstFinished){ firstFinished = true; return false; } $('.setPricetInput').submit(); }; $(".setPriceButton").click(function(e){ e.preventDefault(); $this = $(this); var $thisForm = $this.parent(); var $detailLine = $this.next(".detailLine"); var buyOrderID = $detailLine.find('.orderID'); var priceSet =ParseFloat($thisForm.find('.reqPrice').val().replace('$','')).toFixed(2); var sendData = {'value': buyOrderID, 'type': 'Buy_Order_ID'}; $.getJSON('addToSession.php',sendData, getJSONDone); var sendData = {'value': priceSet, 'type': 'Price_Set'}; $.getJSON('addToSession.php',sendData, getJSONDone); }); 请求在第二个之后返回,则您将没有任何问题。

{{1}}

答案 1 :(得分:0)

使用$.getJSON()回拨函数提交表单。

    $.getJSON('addToSession.php',sendData,function()
    {
        //call this another one
          $.getJSON('url','data',function()
           {
               //in the last,make form submit.
              $( ".setPricetInput" ).submit();
    }
    );
});

http://api.jquery.com/jquery.getjson/

http://api.jquery.com/submit/