2011-12-12 89 views
0

我有一個燈箱形式在框中工作的新條目添加到我datatable形式與此代碼:防止多個Ajax查詢

$("#add-quotation").click(function(event) { 
event.preventDefault(); 
var customer_id = $(this).attr('data-customer');  
$.nmManual(
    '#quotation_manage',{ 
     sizes: { // Size information 
     w: 500, // Initial width 
     h: 500 // Initial height 
    } 
    }); 
    $('#quotation_submit').live('click', function(event){ 
    event.preventDefault(); 
    if(typeof($.nmTop()) != "undefined"){ 
     $.nmTop().close(); 
    } 
    var loading = $('.loading-notification'); 
    loading.removeClass('hidden'); 
    var date = $('#date_activate').val(); 
    var budget = $('#budget').val(); 
    var hospital = [$('#hospital').val(), $('#hospital option:selected').text()]; 
    var dental = [$('#hospital').val(), $('#hospital option:selected').text()]; 
    var optical = [$('#optical').val(), $('#optical option:selected').text()]; 
    var doctor = [$('#doctor').val(), $('#doctor option:selected').text()]; 
    $.ajax({ 
       type: 'POST', 
       data: 'create=true&customer_id=' + customer_id + '&date=' + date + '&budget=' + budget + '&hospital=' + hospital[0] + '&dental=' + dental[0] + '&optical=' + optical[0] + '&doctor=' + doctor[0], 
       url: 'quotation.php', 
       dataType: 'json', 
       async: false, 
       success: function(result){ 
        if (result){ 
        oTable.fnAddData([ 
         result.id, 
        result.date, 
        budget, 
        hospital[1], 
        dental[1], 
        optical[1], 
        doctor[1], 
        '', 
        '', 
        '', 
        'test' 
        ]); 
      } 
     loading.addClass('hidden'); 
       } 
     }); 
    }); 
}); 

它工作得很好,但有時它發送3個或更多的查詢,我怎樣才能防止這個?通常它應該只發送一個查詢。

+0

是該事件'$( 「#附加報​​價」)。單擊(''中創建的document.ready()'?有的時候'click'事件創建的多個時間代碼和你確實有這種行爲 –

+0

它創建在頁面末尾 – Awea

回答

2

當您單擊#add-quotation時,您將另一個單擊事件綁定到#quotation_submit。由於您使用的是live,因此您可以安全地將其移出。試試這個:

$("#add-quotation").click(function(event) { 
    event.preventDefault(); 
    var customer_id = $(this).attr('data-customer'); 
    $.nmManual('#quotation_manage', { 
     sizes: { // Size information 
      w: 500, 
      // Initial width 
      h: 500 // Initial height 
     } 
    }); 
}); 
$('#quotation_submit').live('click', function(event) { 
    event.preventDefault(); 
    if (typeof($.nmTop()) != "undefined") { 
     $.nmTop().close(); 
    } 
    var loading = $('.loading-notification'); 
    loading.removeClass('hidden'); 
    var date = $('#date_activate').val(); 
    var budget = $('#budget').val(); 
    var hospital = [$('#hospital').val(), $('#hospital option:selected').text()]; 
    var dental = [$('#hospital').val(), $('#hospital option:selected').text()]; 
    var optical = [$('#optical').val(), $('#optical option:selected').text()]; 
    var doctor = [$('#doctor').val(), $('#doctor option:selected').text()]; 
    $.ajax({ 
     type: 'POST', 
     data: 'create=true&customer_id=' + customer_id + '&date=' + date + '&budget=' + budget + '&hospital=' + hospital[0] + '&dental=' + dental[0] + '&optical=' + optical[0] + '&doctor=' + doctor[0], 
     url: 'quotation.php', 
     dataType: 'json', 
     async: false, 
     success: function(result) { 
      if (result) { 
       oTable.fnAddData([ 
        result.id, result.date, budget, hospital[1], dental[1], optical[1], doctor[1], '', '', '', 'test']); 
      } 
      loading.addClass('hidden'); 
     } 
    }); 
}); 
+0

它很好地工作,但我不明白你爲什麼能解釋?^^ – Awea

0

使用one()vs live()會阻止多次提交。與使用on()相同,除了處理程序在第一次事件發生後被刪除。

http://api.jquery.com/one/