Question

我正在开发一个asp.net MVC项目。我希望在发布表单后向用户显示一个对话框，以便用户了解它是否成功，如果用户想要关闭对话框，也可以。

我搜索了很多并阅读了一些我可以返回部分视图的内容，但我不确定在这种情况下我是否需要部分视图

我的问题是，有可能使用带有.dialog()的java脚本，或者如果我应该使用局部视图，那么请给我一些解释它是如何工作的。用户点击提交按钮后，我需要显示这样的内容 http://jsfiddle.net/db5SX/

这是我的控制器：

public ActionResult Index()
    {
        ViewBag.ResultMessage = TempData["ResultMessage"];
        return View();
    }
 public ActionResult Create()
    {


        return View();
    }
  [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create([Bind(Include = "Id,Name,Email,Phone,Message,Date")] Contact_US contact_US)
    {
        if (ModelState.IsValid)
        {
            db.Contact_US.Add(contact_US);
            db.SaveChanges();
            TempData["ResultMessage"] = "POSTED SUCESSFULLY...!  We WILL CONTACT YOU SOON.";
            return RedirectToAction("Index");
        }


        return View(contact_US);
    }

如果需要，这是我的观点：

    <div class="form-group col-md-8">


        <h3 class="txtformat padbot50px">Get in touch with us</h3>

        <div class="text-danger message ">
            @ViewBag.ResultMessage
        </div>




        @using (Html.BeginForm("Create", "Contact_Us", FormMethod.Post, new { @id = "contactusform" }))
        {
            @Html.AntiForgeryToken()

            <div class="form-horizontal">



                <div class="form-group">
                    @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2 txtformat" })
                    <div class="col-md-12">
                        @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.Email, htmlAttributes: new { @class = "control-label col-md-2 txtformat" })
                    <div class="col-md-12">
                        @Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(model => model.Phone, htmlAttributes: new { @class = "control-label col-md-2 txtformat" })
                    <div class="col-md-12">
                        @Html.EditorFor(model => model.Phone, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Phone, "", new { @class = "text-danger" })
                    </div>
                </div>
                <div class="form-group hidden">
                    @Html.LabelFor(model => model.Date, htmlAttributes: new { @class = "control-label col-md-2" })
                    <div class="col-md-10">
                        @Html.EditorFor(model => model.Date, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Date, "", new { @class = "text-danger" })
                    </div>
                </div>
                <div class="form-group">
                    @Html.LabelFor(model => model.Message, htmlAttributes: new { @class = "control-label col-md-2 txtformat" })
                    <div class="col-md-12 contactusmsg">
                        @Html.TextAreaFor(model => model.Message, new { htmlAttributes = new { @class = "form-control" } })
                        @Html.ValidationMessageFor(model => model.Message, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group contactuspostbtn">
                    <div class="col-md-12">
                        <input id="postcontactusmessage" type="submit" value="Send" class="btn btn-default" data-toggle="modal" data-target="#myModal" />
                    </div>

                </div>
            </div>
        }





    </div>






</div>

如果需要，我的布局信息：

<script src="~/Scripts/jquery-3.1.0.min.js"></script>
 <link href="~/Scripts/jquery-ui-1.12.1.custom/jquery-ui.css" rel="stylesheet" />
<script src="~/Scripts/jquery-ui-1.12.1.custom/jquery-ui.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/modernizr-2.6.2.js"></script>
<script src="~/Scripts/tinymce/tinymce.min.js"></script>

Answer 1

执行此操作的一种好方法是将其抽象到基本控制器中并在_layouts.cshtml文件中显示消息，例如：

创建一个将由所有控制器继承的基本控制器

public class BaseController : Controller
    {
        public string SucccessMessage
        {
            get
            {
                return TempData["SuccessMessage"] as string;
            }
            set
            {
                TempData["SuccessMessage"] = value;
            }
        }

        public string ErrorMessage
        {
            get
            {
                return TempData["ErrorMessage"] as string;
            }
            set
            {
                TempData["ErrorMessage"] = value;
            }
        }
    }

在_Layouts.cshtml中，

 <div class="container body-content" id="bodyContainer">
        <div class="spacer"></div>
        @if (@TempData["SuccessMessage"] != null)
            {
            <div class="alert alert-success alert-dismissable">
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                @TempData["SuccessMessage"]
            </div>
        }
        else if (@TempData["ErrorMessage"] != null)
        {
            <div class="alert alert-danger alert-dismissable">
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                @TempData["ErrorMessage"]
            </div>
        }

        <div class="spacer"></div>
        @RenderBody()
        <hr id="hr" />
        <footer>
            <p>&copy; @DateTime.Now.Year - Your APp </p>
        </footer>
    </div>

现在，您需要在控制器内完成所有操作：

public class MyController:BaseController
{
 [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create([Bind(Include = "Id,Name,Email,Phone,Message,Date")] Contact_US contact_US)
    {
        if (ModelState.IsValid)
        {
            db.Contact_US.Add(contact_US);
            db.SaveChanges();
            SucccessMessage = "POSTED SUCESSFULLY...!  We WILL CONTACT YOU SOON.";
            return RedirectToAction("Index");
        }


        return View(contact_US);
    }
}

如何在提交表单成功发布后打开一个对话框 - asp.net MVC

1 个答案: