Question

我有编辑/更新对话框，由jquery创建并打开，在用户点击提交按钮后，我想用另一个jquery对话框显示操作结果。问题是我希望结果对话框的标题颜色根据结果（无论是成功还是失败）而改变。并且它可以工作并使当前打开的所有对话框的颜色变为特定颜色，或者它根本不起作用。这是代码：

这是css：

<style type="text/css">
.ui-widget-header {
    color:white;
    background:#012567;
    font-family:Tahoma;
    font-weight:bold;
}

.ui-exclamation-message{
    background:#c2c80d;
}

.ui-success-message{
    background:#066417;
}

.ui-failed-message{
    background:#670500;
}
</style>

这是jQuery部分：

function message_dialog_open() {

    switch ($("#messageType").attr("value").toString())
    {
        case "Exclamation":
            $(".ui-widget-header").addClass("ui-exclamation-message");
            break;
        case "Failed":
            $(".ui-widget-header").addClass("ui-failed-message");
            break;
        case "Success":
            $(".ui-widget-header").addClass("ui-success-message");
            break;
    }

    $(".message-dialog-window").dialog("open");
}

这是剃刀部分：

@using (Ajax.BeginForm("Edit", new AjaxOptions { UpdateTargetId = "message-dialog-window", HttpMethod = "POST", OnSuccess = "message_dialog_open" }))

这是控制器/动作部分：

[HttpPost]
public PartialViewResult Edit(T_account newAccount)
{
            var _result = new account().UpdateAccount(newAccount);
            if (_result == false)
                return PartialView("_Message", new Message { type = MessageType.Failed, text = "failure message" });
            return PartialView("_Message", new Message { type = MessageType.Success, text = "success message" });

最后这里是html部分：

<div class="dialog-window edit-dialog-window" id="edit-dialog-window" title="update account information"></div>

<div class="dialog-window message-dialog-window" id="message-dialog-window" title="Request's result"></div>

消息类型属性将存储在_Message局部视图的隐藏输入中。在基于该值的jquery中，我尝试通过添加适当的类来更改ui-widget-header的颜色。问题是当我尝试通过这个selectot添加类时：$（“。ui-widget-header”）。addClass（“ui-success-message”）;

程序会将该类添加到具有“ui-widget-header”类的每个元素。意味着所有以前打开的对话框也会有标题的颜色变化。如果尝试使用这个选择器：$（“div＃message-dialog-window .ui-widget-header”）。addClass（“ui-success-message”）;它不起作用，因为标题元素不是div＃message-dialog-window的一部分。它们应该是因为ajaxOption：UpdateTargetId =“message-dialog-window”，当我想使用ajax表单时我使用它。

如果有人知道发生了什么，我将不胜感激。或者我怎样才能以任何其他方式获得我想要的东西。

PS：对不起我的长篇文章和糟糕的英语：）

Answer 1

我找到了答案。它似乎有效。但我不确定多个嵌套消息。这是解决方案。我已经更改了jQuery函数，只将类添加/删除到最后一个“ui-widget-header”元素，该元素应该是向用户显示的最后/当前消息：

function message_dialog_open() {

    $(".ui-widget-header").last().removeClass("ui-exclamation-message");
    $(".ui-widget-header").last().removeClass("ui-failed-message");
    $(".ui-widget-header").last().removeClass("ui-success-message");

    switch ($(".messageType").last().attr("value").toString())
    {
        case "Exclamation":
            $(".ui-widget-header").last().addClass("ui-exclamation-message");
            break;
        case "Failed":
            $(".ui-widget-header").last().addClass("ui-failed-message");
            break;
        case "Success":
            $(".ui-widget-header").last().addClass("ui-success-message");
            break;
    }

    $(".message-dialog-window").dialog("open");
}

在其他对话框打开时更改jquery对话框标题的颜色，我们不希望它们更改

1 个答案: