1

認めざるを得ないのは、Web フォームから MVC への移行は、文字通り私の心を吹き飛ばすことです。Web フォームと比較して、MVC がどのように機能するかについて頭を悩ませているようには思えません。一見単純なタスクを実行しようとすると、障害が発生し続けます。これに javascript/jquery の初歩的な知識を組み合わせると、ほとんど毎日頭を悩ませることになります。

私の会社が構築したカスタム CMS を Web フォームから MVC に移行する作業を行っています。この CMS により、ページの作成とサイト ナビゲーションの操作が可能になり、関連するビューとコントローラーと共にページ モデルが作成されました。

クライアントはサイトの 99% を編集できますが、一部の要素は静的で、特定のページでオンデマンドで読み込まれます。たとえば、連絡先ページは CMS 内に存在しますが、サイトはオンデマンドで実際の連絡先フォームを挿入します。

Web フォームで構築した場合、この連絡先フォームは、ポストバックを処理するための独自のロジックを備えた単なるユーザー コントロールでした。ここでの論理的な移行は部分ビューの作成になると思いましたが、このタスクを達成するのに途方もない量の困難に遭遇しました. この連絡先フォームのモデル、ビュー、およびコントローラーを作成できましたが、正しく機能させることができないようです。

アドバイスを求めて文字通り 3 日間 Stack Overflow を精査した後、私はこの作業を行うためにほぼすべてを完了しました。しかし、私の命を救うために、部分ビューから一見単純なリダイレクトを実行する方法がわかりません。Doug.Instanceで説明されているものを含め、多数のアプローチを試しましたが、うまくいきませんでした。送信時に、コントローラーが「return PartialView」を使用していても、部分ビューが全体ビューとして返されます。もう一度投稿すると、最初に表示されていた部分ビューとして返されます。さらに、Redirect成功時に変数が更新されず、OnSuccessJavaScript が起動しません。

以下は私のコードです。髪が足りないので助けてください...

ページビュー（簡潔にするために省略）

...
@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();
      }
    }
4

3 に答える 3

0

あなたが抱えている問題はajaxに共通しています。注意する必要があるのは、ajaxが応答をレンダリングするときに、返されたjavascriptについて認識しないことです。

JavaScriptをトリガーするには、JavaScriptを登録する方法が必要です。

今これを行う方法は？私は私のために働く方法の1つを作成しました：

リロードされたページにjavascript関数があります。

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

あなたのajax呼び出し、私はajaxアクションリンクを持っていますが、開始フォームはほとんど同じです

興味のある部分はAjaxOptionsです。そしてイベントOnSuccess。これは、呼び出しが成功したときにトリガーされます。

リンクの例：

@ Ajax.ActionLink（ "Comments"、 "AddComment"、 "Task"、new {id = Model.Task.TaskId、TaskStatus =（int）State.Closed}、 new AjaxOptions {HttpMethod = "Get"、UpdateTargetId = "showResults "、OnSuccess =" RedirectToLocation "}、null）

そしてここであなたはajaxオプションについてもっと読むことができます

アクション結果のコード例で問題を指摘するだけです

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
      }
于 2012-12-14T22:40:59.107 に答える
0

PARTIAL VIEWにアクション名を追加して試してください

@using (Ajax.BeginForm( "アクション名" ,new AjaxOptions { UpdateTargetId = "contactForm", OnSuccess = "FormComplete" })) {

于 2012-12-15T10:32:27.227 に答える
0

実際に達成しようとしていることについて再考し始めたとき、私はこれを機能させることができました. 戻る代わりにPartialView("contactForm", c);、結局戻ってきJson(c);ました。次に、返された Json を解析し、そこからリダイレクトしました。最終的な作業コードは次のとおりです。

ページビュー（簡潔にするために省略）

...
@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
  }
}
于 2012-12-18T19:03:10.290 に答える