如何跨两种形式共享输入值

时间:2014-05-13 20:28:27

标签: c# asp.net asp.net-mvc asp.net-mvc-5

我正在开发一个用于提交和预览博客条目的视图。我的观点的相关部分如下所示:

@using (Html.BeginForm("Add"))
{
    @Html.LabelFor(m => m.Header);
    @Html.TextBoxFor(m => m.Header);

    @Html.LabelFor(m => m.HeaderSlug);
    @Html.TextBoxFor(m => m.HeaderSlug);

    @Html.LabelFor(m => m.Content);
    @Html.HiddenFor(m => m.Content)
    <pre id="code-editor"></pre>

    <button type="submit" class="flat-button">Post</button>
}

@using(Html.BeginForm("Preview"))
{

    // This form has no input fields meaning that 
    // validation will always fail because the 
    // input appears to be empty. 

    // I want this form to use the input values 
    // from the "Add" form. 

    <button type="submit" class="flat-button">Preview</button>
}

如何与预览表单共享添加表单中包含的输入字段,以便将它们提交给  不同的控制器?

1 个答案:

答案 0 :(得分:1)

 @using (Html.BeginForm("Create", "Add", FormMethod.Post, new { id = "add-form" }))
 {
     @Html.LabelFor(m => m.Header);
     @Html.TextBoxFor(m => m.Header, new {@id = "header"});
     @Html.LabelFor(m => m.HeaderSlug);
     @Html.TextBoxFor(m => m.HeaderSlug, new {@id = "header-slug"});
     @Html.LabelFor(m => m.Content);
     @Html.HiddenFor(m => m.Content, new {@id = "content"})
     <pre id="code-editor"></pre>
    <button type="submit" class="flat-button">Post</button>
 }
 @using (Html.BeginForm("Create", "Add", FormMethod.Post, new { id = "add-form" }))
 {
       @Html.HiddenFor(m => m.Header, new {@id = "hidden-header"});
       @Html.HiddenFor(m => m.HeaderSlug, new {@id = "hidden-slug"});
       @Html.HiddenFor(m => m.Content, new {@id = "hidden-content"});
 }


<script>
 $(function() {
      $("#add-form").submit(function () {
           $("#hidden-header").val($("#hidden-header").val());
           $("#hidden-slug").val($("#header-slug").val());
           $("#hidden-Content").val($("#hidden-content").val());
           return true;
       });
 })

</script>