在部分视图中联系表单

时间：2012-12-14 22:12:57

标签： asp.net-mvc redirect asp.net-mvc-partialview asp.net-mvc-ajax

我不得不承认，从Web Forms到MVC的过渡实际上让我大吃一惊。我似乎无法理解MVC如何与Web Forms相比起作用，并且在试图执行看似简单的任务时我继续遇到障碍。再加上javascript / jquery的基本知识，我大部分时间都在摸不着头脑。

我一直致力于将我公司从Web Forms构建的自定义CMS转换为MVC。此CMS允许创建页面和操作站点导航，从而创建页面模型以及相关视图和控制器。

虽然客户端可以编辑99％的站点，但某些元素是静态的，并且在特定页面上按需加载。例如，CMS中存在 Contact 页面，但该站点会根据需要注入实际的联系表单。

在Web窗体中构建时，此联系表单只是一个用户控件，具有用于处理回发的自己的逻辑。我认为这里的逻辑转换将是创建一个局部视图，但是我在完成这项任务时遇到了一些荒谬的困难。虽然我已经能够为这个联系表单创建模型，视图和控制器，但我似乎无法使其正常工作。

经过3天的Stack Overflow搜索建议后，我完成了几乎所有工作。但是，我无法弄清楚如何从部分视图执行看似简单的重定向来挽救我的生命。我尝试了很多方法，包括在Doug.Instance描述的方法，但没有任何运气。发布后，即使控制器使用“返回PartialView”，部分视图也会返回整个视图。如果我再次发布它，它将返回原始显示的部分视图。此外，我的Redirect变量在成功时未更新，并且OnSuccess javascript未触发。

以下是我的代码。请帮助我，因为我的头发已经用完了......

PAGE VIEW（为了生活而缩短） 

...
@if (Model.ID == 8)
{
  //LOAD CONTACT FORM
  @Html.Action("Contact","ContactForm")
}...

联系表格部分视图（为了健康而缩短） 

@model NCOWW.Models.ContactForm

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
  // Labels over the inputs.
  window.addEvent("load", function () {
    var myForm = document.id('contactForm');
    myForm.getElements('[type=text], textarea').each(function (el) {
      new OverText(el);
    });
  });
  function FormComplete() {
    if ($("#Redirect").val() != '') {
      document.location = $("#Redirect").val();
    } 
  } 
</script>
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "contactForm", OnSuccess = "FormComplete" }))
{
  @Html.ValidationSummary(true)
  <div id="contactForm">
    @Html.HiddenFor(model => model.Redirect)

    @Html.TextBoxFor(model => model.Name, new { tabindex = 1, @class = "half", Title = @Html.DisplayNameFor(model => model.Name) })
    @Html.ValidationMessageFor(model => model.Name)

       @Html.TextAreaFor(model => model.Comments, new { tabindex = 13, Title =     @Html.DisplayNameFor(model => model.Comments) })
    @Html.ValidationMessageFor(model => model.Comments)

    <br />
    <input type="submit" value="Submit" name="Submit" class="button" />
  </div>
}

联系表单控制器（为了健康而缩短） 

public ActionResult Contact(ContactForm c)
    {
      try
      {
        MailMessage message = new MailMessage();
        message.IsBodyHtml = true;
        message.From = new MailAddress(c.Email);
        message.Body += "<b>Name:</b> " + c.FullName + "<br/><br/>";
        message.Body += "<b>Questions/Comments:</b><br> " + c.Comments;

        SmtpClient client = new SmtpClient();
        client.Send(message);
        c.Redirect = "/formsuccess";

        return PartialView("contactForm", c);
      }
      catch
      {
        return PartialView();
      }
    }

3 个答案:

答案 0 :(得分：0)

你遇到的问题与ajax相同。 您需要注意的是，当ajax呈现响应时，它不知道您返回的javascript。

你需要有一些方法来注册你的javascript才能触发它。

现在怎么做？ 我创造了一种适用于我的方法：

在页面上有重新加载的javascript函数。

function RedirectToLocation(url) {
//your javascript event here
        }

你的ajax调用，我有ajax动作链接但是开始形式几乎是相同的

您感兴趣的部分是AjaxOptions。 和事件OnSuccess。当呼叫成功时，这将被触发。

链接示例：

  

@ Ajax.ActionLink（“评论”，“AddComment”，“任务”，新{id =   Model.Task.TaskId，TaskStatus =（int）State.Closed}，   新的AjaxOptions {HttpMethod =“Get”，UpdateTargetId =“showResults”，OnSuccess =“RedirectToLocation”} ，null）

And here you can read about ajax options more

只需在代码示例中指出您的操作结果中的问题

try
      {
        MailMessage message = new MailMessage();
        message.IsBodyHtml = true;
        message.From = new MailAddress(c.Email);
        message.Body += "<b>Name:</b> " + c.FullName + "<br/><br/>";
        message.Body += "<b>Questions/Comments:</b><br> " + c.Comments;

        SmtpClient client = new SmtpClient();
        client.Send(message);
        c.Redirect = "/formsuccess";

        return PartialView("contactForm", c);
      }
      catch
      {
        return PartialView();  <-- will render what, better will be if it renderes error mesasge partial view
      }

答案 1 :(得分：0)

通过在PARTIAL VIEW

中添加操作名称来尝试
  

@using（Ajax.BeginForm（“Action Name”，新的AjaxOptions {UpdateTargetId =   “contactForm”，OnSuccess =“FormComplete”}））{

答案 2 :(得分：0)

一旦我开始重新思考我实际上想要实现的目标，我就能够将其付诸实践。我没有返回PartialView("contactForm", c);，而是返回Json(c);。然后我解析了返回的Json并从那里重定向。最终的工作代码如下。

PAGE VIEW（为了生活而缩短） 

...
@if (Model.ID == 8)
{
  //LOAD CONTACT FORM
  @Html.Action("Contact","ContactForm")
}...

联系表格部分视图（为了健康而缩短） 

@model NCOWW.Models.ContactForm

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
  // Labels over the inputs.
  window.addEvent("load", function () {
    var myForm = document.id('contactForm');
    myForm.getElements('[type=text], textarea').each(function (el) {
      new OverText(el);
    });
  });
  function FormComplete(result) {
    if (result.Redirect != null && result.Redirect != '') {
      document.location = result.Redirect;
    }
  }
</script>
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "contactForm", OnSuccess = "FormComplete" }))
{
  @Html.ValidationSummary(true)
  <div id="contactForm">
    @Html.HiddenFor(model => model.Redirect)

    @Html.TextBoxFor(model => model.Name, new { tabindex = 1, @class = "half", Title = @Html.DisplayNameFor(model => model.Name) })
    @Html.ValidationMessageFor(model => model.Name)

       @Html.TextAreaFor(model => model.Comments, new { tabindex = 13, Title =     @Html.DisplayNameFor(model => model.Comments) })
    @Html.ValidationMessageFor(model => model.Comments)

    <br />
    <input type="submit" value="Submit" name="Submit" class="button" />
  </div>
}

联系表单控制器（为了健康而缩短） 

public ActionResult Contact(ContactForm c)
{
  try
  {
    MailMessage message = new MailMessage();
    message.IsBodyHtml = true;
    message.From = new MailAddress(c.Email);
    message.Body += "<b>Name:</b> " + c.FullName + "<br/><br/>";
    message.Body += "<b>Questions/Comments:</b><br> " + c.Comments;

    SmtpClient client = new SmtpClient();
    client.Send(message);
    c.Redirect = "/formsuccess";

    return Json(c);
  }
  catch
  {
    //ERROR CATCH CODE
  }
}
相关问题
最新问题