jQuery：ajax，點擊提交按鈕

我有一個表單有幾個元素和兩個提交按鈕：保存和刪除。當通過jQuery ajax提交表單時，我需要知道用戶是否單擊了DELETE，以便我可以相應地執行代碼。問題是，jQuery不會發送提交名稱和值。因此，我在這裏閱讀並發現它看起來像是理想的解決方法：使用輸入SAVE和DELETE按鈕。使用DELETE按鈕，我可以發送帶有按鈕名稱和值的表單，因此執行刪除的代碼。問題是，即時通訊試圖綁在一起，沒有成功。這裏是我的代碼：jQuery：ajax，點擊提交按鈕

HTML：

<form id="f-release" method="post" action="includes/submit_release.php"> 
    <fieldset> 
     <input name="save" type="submit" value="save"> 
     <button name="delete" type="button" value="delete" onClick="return confirm('Do you really wish to permanently delete the record?')">Delete</button> 
    </fieldset> 
</form>

AJAX：

$("form button[name=delete]").click(function() { 
    var formData = $(this).closest('form').serializeArray(); 
    formData.push({name: this.name, value:this.value }); 
}); 

$('form#f-release').submit(function(event) { 
    event.preventDefault(); 

    var form = $(this); 

    $.ajax({ 
     type: form.attr('method'), 
     url: form.attr('action'), 
     data: form.serialize(), 
     dataType: "json" 
    }).done(function(data) { 

     alert('done'); 

    }).fail(function(data) { 

     alert('error!'); 

    }); 
});

PHP：

if (isset($_POST['releaseid']) && is_numeric($_POST['releaseid'])) { 

    // save 

} elseif (...delete...) { 

    //delete 

}

當我點擊刪除，我如何提交表單的名稱和刪除按鈕的值，以便我可以正確執行php DELETE代碼？

來源

2015-03-08 Marco

使用數據屬性？ – a7omiton 2015-03-08 17:50:32

你能說清楚嗎？ – Marco 2015-03-08 18:01:37

有一些選項可以考慮：

通常你不會使用POST方法來刪除記錄，你應該使用DELETE方法來代替。然後在你的php代碼中，根據http方法決定服務應該做什麼。（我不熟悉PHP，但我相信這是可能的，看到這個帖子Detecting request type in PHP (GET, POST, PUT or DELETE)）
如果你真的必須使用POST方法進行刪除，那麼你可以有一個隱藏的輸入：

<輸入類型=「隱藏」名稱=「方法」值=「提交」 >

然後當用戶點擊刪除按鈕，其值設置爲「刪除」，當用戶點擊提交按鈕，其值設置爲「提交「（或者保持它不變，因爲我將它的默認值設置爲」提交「）。這樣做應該讓你的php代碼能夠根據$ _POST ['method']來決定動作。

來源

2015-03-08 18:11:46 WorldFS

我不知道在PHP中存在DELETE方法。這使事情變得非常簡單。謝謝 – Marco 2015-03-08 18:52:02

你可以保留刪除和提交作爲輸入或按鈕，它並沒有真正有所作爲。但它們可以具有相同的元素。

有幾種方式來處理這個問題：

爲delete和submit元素**創建標識。

**然後創建一個在線點擊處理，像這樣：

<button id="save" onClick="reply_click(this.id)">Save</button> 
<button id="delete" onClick="reply_click(this.id)">Delete</button> 

<script type="text/javascript"> 
function reply_click(clicked_id) 
{ 
    // whatever code here... 
    // clicked_id will refer to the ID that was clicked 
    console.log(clicked_id); // try this 
} 
</script>

或者，如果你喜歡採取更簡潔的方法是分離的擔憂，並在HTML不處理行爲，您可以嘗試如下所示：

**爲delete和submit元素創建ID。

**然後遍歷每個匹配元素並附加一個事件處理函數，該函數會在單擊時返回特定的ID。這看起來是這樣的：

var element = document.querySelectorAll('button'); 
      var elementLength = element.length; 
      for(var i = 0; i < elementLength; i++){ 
       element[i].addEventListener('click', function(){ 
        console.log(this.id); 
       }); 
      }

如果你想堅持jQuery的：

**創建爲delete和submit元素的ID。

**那麼你可以做這樣的事情：

$('button').click(function (event) { 
    var currentId = event.target.id; 
    // do stuff with currentId 
});

[注：這個答案解決您的點擊事件從未來的檢測，但沒有具體的AJAX調用的工作方式。我知道這解決了你所問的問題。]

來源

2015-03-08 18:11:55 shmuli

jQuery：ajax，點擊提交按鈕

回答

相關問題