0
我有以下的AJAX調用...在AJAX DELETE請求之後,我如何重定向到提供的URI?
remove() {
$.ajax({
url: this.deleteUri,
type: `DELETE`,
contentType: `application/json; charset=utf-8`,
cache: false,
success:() => {
if (this.successUri) { UrlHelper.go(this.successUri); }
},
error: (xhr, status) => {
this.showFailed();
}
});
}
UrlHelper.go簡單包裝location.href如下...
UrlHelper.go = function (url) {
location.href = url;
};
當成功回調被解僱,我有問題是成功的URL被稱爲使用DELETE動詞,雖然這不是我想要的。有沒有什麼我錯過讓這個GET?
注意:這是使用箭頭函數和ES6調用。
問題是this.successUri中的URL是使用Http DELETE動詞而不是Http GET動詞來調用的。因爲它是一個重定向我需要用Http GET來調用它。該URL沒有響應Http DELETE動詞的任何內容。
這裏的整個部件,這是一部分...
/// <reference path="../../../node_modules/jquery/dist/jquery.js" />
/// <reference path="../../../node_modules/bootbox/bootbox.js" />
import Guard from "../helpers/guard";
import UrlHelper from "../helpers/url-helper";
export default class DeleteButton {
/**
* Creates an instance of DeleteButton.
*
* @param {object} element The DOM element to make into a delete button.
*
* @memberOf DeleteButton
*/
constructor(element) {
Guard.throwIf(element, "element");
this.deleteUri = element.getAttribute("data-delete-uri") || UrlHelper.current.url().split('?')[0];
this.title = element.getAttribute("data-title") || `Delete the item?`;
this.cancelText = element.getAttribute("data-cancel") || `Cancel`;
this.confirmText = element.getAttribute("data-confirm") || `Remove`;
this.message = element.getAttribute("data-message") || `Do you want to delete the item? This cannot be undone.`;
this.successUri = element.getAttribute("data-success-uri");
this.errorMessage = element.getAttribute("data-error-message") || `Unable to complete operation.`;
$(element).click(this.confirmRemove.bind(this));
}
/**
* Confirms deletion of an item.
*
* @memberOf DeleteButton
*/
confirmRemove() {
window.bootbox.confirm({
title: this.title,
message: this.message,
buttons: {
cancel: {
label: `<i class=\"fa fa-times\" aria-hidden=\"true\"></i>${this.cancelText}`
},
confirm: {
className: `btn-danger`,
label: `<i class=\"fa fa-check\" aria-hidden=\"true\"></i>${this.confirmText}`
}
},
callback: (result) => {
if (result) { this.remove(); }
}
});
}
/**
* Removes an item from the server.
*
* @memberOf DeleteButton
*/
remove() {
$.ajax({
url: this.deleteUri,
type: `DELETE`,
contentType: `application/json; charset=utf-8`,
cache: false,
success:() => {
if (this.successUri) { UrlHelper.go(this.successUri); }
},
error: (xhr, status) => {
this.showFailed();
}
});
}
/**
* Shows failure of deletion.
*
* @memberOf DeleteButton
*/
showFailed() {
window.bootbox.alert({
message: this.errorMessage,
size: `small`,
backdrop: true
});
}
}
和它連接到下面的HTML ...
<a class="js-delete-button btn btn-danger" data-id="@Model.ID" data-title="Stop the Route?" data-confirm="Stop Route" data-success-uri="/routes"
data-message="Do you want to stop running this route? Routes with no journeys will be permanently deleted. This cannot be undone."><i class="fa fa-ban" aria-hidden="true"></i>Stop Running</a>
其中,刪除操作成功後,然後生成以下請求...
:authority:localhost:44333
:method:DELETE
:path:/Routes?Message=The%20route%20requested%20has%20been%20stopped.
:scheme:https
accept:*/*
accept-encoding:gzip, deflate, sdch, br
accept-language:en-GB,en-US;q=0.8,en;q=0.6
cache-control:no-cache
content-type:application/json; charset=utf-8
origin:https://localhost:44333
pragma:no-cache
referer:https://localhost:44333/Route/30005?Message=A%20new%20route%20has%20been%20created.%20Now%20download%20and%20complete%20the%20Timetable%20template%20to%20configure%20all%20of%20the%20stops%20and%20journey%20times.
user-agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36
x-requested-with:XMLHttpRequest
那麼,爲什麼你使用DELETE,如果你需要GET? –
AJAX調用從數據庫中刪除記錄。如果刪除成功,我需要將瀏覽器重定向到列表頁面。 –
你確定'這是你在'成功'期待的內容嗎? 'this'是'jqXHR'對象,默認情況下在'$ .ajax()'調用的'success'中。 – guest271314