代码之家 › 专栏 › 技术社区 › J.C

在json返回之前在asp.net mvc中给出用户反馈

asp.net-mvc

J.C · 技术社区 · 5 年前

我想在json返回之前给用户反馈。但它不起作用。

以下是如何创建我的消息UI

@{
    <link rel="stylesheet" href="~/Content/css/messages.css" type="text/css" />
    <script>
        function myFunction() {
            var x = document.getElementById("myDiv");
            if (x.style.display === "none") {
                x.style.display = "block";
            } else {
                x.style.display = "none";
            }
        }

        setTimeout(function () {
            $('#myDiv').fadeOut('fast');
        }, 5000); // <-- time in milliseconds
    </script>
    if (TempData["msg"] != null && TempData["msgType"] != null)
    {
        string messageTitle = "";
        string messageClass = "";
        string mainDivMessageClass = "";

        switch (@TempData["msgType"])
        {
            case messageType.warning:
                messageTitle = "Advertencia :";
                messageClass = "fa fa-warning fa-2x";
                mainDivMessageClass = "message-box message-box-warn";
                break;
            case messageType.success:
                messageTitle = "Ãxito :";
                messageClass = "fa fa-check fa-2x";
                mainDivMessageClass = "message-box message-box-success";
                break;
            case messageType.info:
                messageTitle = "InformaciÃ³n :";
                messageClass = "fa fa-info-circle fa-2x";
                mainDivMessageClass = "message-box message-box-info";
                break;
            case messageType.error:
                messageTitle = "Error :";
                messageClass = "fa fa-ban fa-2x";
                mainDivMessageClass = "message-box message-box-error";
                break;
            default:
                break;
        }

        <div id="messageSection">
            <div id="myDiv" class="@mainDivMessageClass">
                <i class="@messageClass"></i>
                <span class="message-text"><strong> @messageTitle </strong></span>
                <span class="message-text">@TempData["msg"]</span>
                <i class="fa fa-times fa-2x exit-button" onclick="myFunction()"></i>
            </div>
        </div>
    }
}

这是我的httpPost,我想在这里填写反馈消息。

[HttpPost]
public ActionResult Editar(gestionDeUbicacionesModel gestiondeubicacione)
{
    gestionDeUbicacionesContext gestiondeubicaciones = new gestionDeUbicacionesContext();
    bool status = false;
    if (ModelState.IsValid)
    {
            if (gestiondeubicacione.ubicacion_id > 0)
            {
                //Edit 
                var gestiondeubicacionesFound = gestiondeubicaciones.GetAllInvenotryLocation().Where(a => a.ubicacion_id == gestiondeubicacione.ubicacion_id).FirstOrDefault();
                if (gestiondeubicacionesFound != null)
                {
                    gestiondeubicacionesFound.armario = gestiondeubicacione.armario;
                    gestiondeubicacionesFound.cajon = gestiondeubicacione.cajon;
                }
            }
            else
            {
            gestiondeubicaciones.addInvenotryLocationToDB(gestiondeubicacione);
            TempData["msgType"] = messageType.success;
            TempData["msg"] = "Nueva ubicaciÃ³n agregada!";
        }

        TempData["msgType"] = messageType.success;
        TempData["msg"] = "La ubicaciÃ³n ha sido actualizada!";
        gestiondeubicaciones.updateInvenotryLocationToDB(gestiondeubicacione);
        status = true;                
    }
    return new JsonResult { Data = new { status = status } };
}

在我的cshtml中,我想在这里看到我的消息

<div>
    @{
        Html.RenderPartial("messages");
    }
</div>

以下是我在jquery中到目前为止所能做的事情,我在更新成功后添加了以下行。

              data: $('#popupForm').serialize(),
                success: function (data) {
                    if (data.status) {
                        $dialog.dialog('close');
                        oTable.ajax.reload();
                        var x = document.getElementById("testP");
                        if (x.style.display === "none") {
                            x.style.display = "block";
                        } else {
                            x.style.display = "none";
                        }
                        setTimeout(function () {
                            $('#testP').fadeOut('fast');
                        }, 5000); // <-- time in milliseconds
                    }
                }
            })

这是我测试的html

<p id="testP">test</p>

当我保存消息时,会出现消息测试,但我想拥有我在剃刀中制作的自定义消息UI。

我必须更改什么才能在json返回之前看到消息。谢谢你的帮助。

0 回复 | 直到 5 年前

Aabir Hussain 5 年前

您可以使用 beforeSend 在向服务器发送请求之前调用的回调函数。下面是相同的示例代码

$.ajax({
    url: YOUR_URL,
    type: 'POST',
    data: data,
    beforeSend: function () {
        //give user feedback here
    },
    success: function (res) {
        if (res) {
            //you logic after receiving the data
        }
    },
    error: function () {
        //when any error occur
    },
    complete: function () {
        //called when ajax completed
    }
});

Shyam 5 年前

你可以试试Thread。睡眠或任务。A在C#端等待/使J-Query调用同步[它将等待直到收到响应/执行操作],尝试并标记此答案已解决,这将有助于他人。