【问题标题】:How to show a "Saved!" message after Redirect() is made..?如何显示“已保存!”重定向()后的消息..?
【发布时间】:2014-05-28 00:20:11
【问题描述】:

我目前正在从事 MVC4 项目。

想象以下场景:


(1) 允许用户将数据添加到多个表中,然后需要通过点击提交确认。 <input type="submit" value="" id="saveBtn" title="Save" /> 没有值的原因是因为我在提交时应用了 CSS。

(2) 之后,为了避免之前的一个bug,防止刷新页面重复数据,我需要在我的Controller中重定向用户:return Redirect("Edit?Id=" + id);

(3) 在 Redirect() 完成后,我想显示一条简单的消息,上面写着“已保存!”延迟 5 秒。我不想要alert("Saved!");


我目前有一个可用的伪解决方案,但不是首选。这是jQuery中的一个简单的点击函数:

CSS

.successMessage {
    color: darkgreen;
}

HTML

<div class="successMessage" style="display: none;">Saved!</div>

JS

$('#saveBtn').click(function () {
    $(".successMessage").delay(500).show(0);
});

问题是,由于我Redirect();用户,我的消息不能被这个“解决方案”延迟。在Redirect(); 之后,该消息将不再显示。

为了获得“延迟”消息,有什么更好的方法?提前致谢。

【问题讨论】:

    标签: javascript jquery html css redirect


    【解决方案1】:

    显示通知消息的最佳解决方案是使用TempData["Message"] 来存储值并在每个页面上执行此操作-

     if (TempData["Message"] != null)
     {
       ViewBag.Message = TempData["Message"];
     }
    

    现在在视图中,

            <div>
                @if (ViewData["Message"] != null)
                {
                    <div>Saved!</div>
                }
           </div>
    

    【讨论】:

    • 感谢您的回答。我尝试了这个解决方案,但恐怕这不起作用。
    【解决方案2】:

    在您的提交操作中添加一个 TempData,并通过在页面准备好时确认 TempData 是否具有值来在您的视图中显示延迟消息。

    行动:

    //save info
    TempData["Message"]="Saved!";
    return Redirect("Edit?Id=" + id)
    

    查看:

    string message=TempData["Message"]==null?"":TempData["Message"].ToString();
    @if(message!="")
    {
        <div class="successMessage" style="display: none;">@message</div>
        <script type='text/javascript'>
          $(document).ready(function(){
             $(".successMessage").delay(500).show(0);
          })
        </script>
    }
    

    【讨论】:

    • 感谢您的回答。我认为 string message=TempData["Message"]==null?"":TempData["Message"].ToString(); 的语法是错误的,因为我无法在视图中解析符号“消息”。
    • @urbz 使用 var 消息而不是字符串消息。
    • @Ash 谢谢,但我搞定了! :) jarvanJiang 我多么愚蠢,我试图在一个段落中这样做,这导致了问题。否则你的回答就像一个魅力,谢谢!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-04-12
    • 2010-11-06
    • 2017-10-29
    • 2012-12-12
    • 2018-07-24
    相关资源
    最近更新 更多