首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在AJAX删除请求之后,如何重定向到提供的URI?

在AJAX删除请求之后,如何重定向到提供的URI?
EN

Stack Overflow用户
提问于 2017-02-22 18:00:42
回答 1查看 836关注 0票数 0

我有以下AJAX电话..。

代码语言:javascript
复制
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包装如下..。

代码语言:javascript
复制
UrlHelper.go = function (url) {
    location.href = url;
};

当触发成功回调时,我遇到的问题是使用DELETE动词调用成功URL,尽管这不是我想要的。有什么东西我错过了吗?

注意:这是使用箭头函数和ES6调用。

问题是,this.successUri中的URL使用的是Http谓词,而不是HTTPGET谓词。因为这是一个重定向,所以我需要用Http调用它。该URL中没有响应Http删除谓词的任何内容。

这是整个部件这是..。

代码语言:javascript
复制
/// <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..。

代码语言:javascript
复制
    <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>

在删除操作成功后,将生成以下请求.

代码语言:javascript
复制
: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
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-02-22 18:52:39

这不是客户端问题,而是服务器重定向问题,原因是方法调用错误。在响应者的大量帮助下,我能够确定成功的回调并不是真正的启动--服务器正在尝试做其他的事情。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42399003

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档