帖子视图模型实例回几个动作方法 [英] Post view model instance back to several action methods

查看:123
本文介绍了帖子视图模型实例回几个动作方法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个视图模型其中有8个物业,其中6复杂类型。我必须在3组显示他们和所有的数据到数据库的最后保存。现在,我已经创建用于此目的的两种方法,第一个将与 HTTPGET 装饰,第二个用 HttpPost 。我已经创造了3组在一个 .cshtml 。对于第一次,只有第一组是可见的。而点击后的下一步按钮,我会在第二组可见,第一组会随着使用Javascript / jQuery的 。然后在第三组将是可见的。在这最后一部分提交按钮必须出现。点击这个之后,我将发布整个模型回操作方法。但是,在这种情况下,我有两个问题:

I have one ViewModel which has 8 properties and 6 of them are complex types. And I must display them in 3 groups and to save all data to database at last. Now, I have created two methods for this purpose, the first will be decorated with HttpGet and the second one with HttpPost. I have already created all these 3 groups in one .cshtml. For the first time, only the first group is visible. And after clicking NEXT button, I will make the second group visible and the first group will be invisible with the help of Javascript/Jquery. And then the third group will be visible. And in this last part submit button must be appeared. After clicking this, I will post whole model back to the action method. But, in this scenario I have two problems:


  • 我必须先验证与客户端验证唯一可见的领域

  • 如果不知何故客户端验证通过,服务器端是没有,那么我必须找到并显示未验证的一部分。

那么,对于解决这些问题,我已经决定了两个创建用四个操作方法,这将发布视图模型回另一个。
为了使清楚,我想这表明这样的:

So, for solving these problems, I have decided two create four action methods, which will post viewmodel back to other one. For making it clear, I want to show this like that:


  1. CreateViewModel [HTTPGET]

  2. GoToSecondPart [HttpPost]

  3. GoToThirdPart [HttpPost]

  4. SaveToDatabase [HttpPost]

  1. CreateViewModel [HttpGet]
  2. GoToSecondPart [HttpPost]
  3. GoToThirdPart [HttpPost]
  4. SaveToDatabase [HttpPost]

1将我的视图模型实例返回2,和2轮到他将其张贴到3,和3将张贴到4。

1 will return my viewmodel instance to 2, and 2 in his turn will post it to 3, and 3 will post it to 4.

这是好形式给出?如果没有,你有什么建议吗?

Is it good aproach? If not, what would you recommend me?

推荐答案

您目前的做法意味着多个岗位/重定向和某种形式的临时存储库或一些模拟的视图状态。一个更好的做法是一种形式中做everyting和使用 Validator.element(元)每节单独的验证控件

Your current approach means multiple post/redirects and some form of temporary repository or something that mimics viewstate. A better approach would be to do everyting within one form and validate individual controls in each section using Validator.element(element)

在下一步按钮。点击()事件


  1. 选择范围内相关的&LT所有的控件;节> - 例如无功控制= $(本).closest('部分')找到('输入,文本区域,选择');

  2. 在一个 $每个循环,调用 $('形式')验证()元($(本));。

  3. 测试,如果该节中的控制与 $有效(这).valid();

  4. 如果一切是有效的,隐藏当前部分并显示下一个

  1. Select all the the controls within the associated <section> - e.g. var controls = $(this).closest('section').find('input, textarea, select');
  2. In an $.each loop, call $('form').validate().element($(this));
  3. Test if the controls in the section are valid with $(this).valid();
  4. If everything is valid, hide the current section and display the next

最后一节包括Save'`按钮,做一个正常的提交

The final section includes the 'Save'` button which does a normal submit

查看

<section>
    <h2>Section 1</h2>
    @Html.LabelFor(m => m.SomeProperty)
    @Html.TextBoxFor(m => m.SomeProperty)
    @Html.ValidationMessageFor(m => m.SomeProperty)
    ....
    <div class="error"></div>
    <button type="button" class="next">Next</button>
</section>
<section>
    <h2>Section 2</h2>
    // Your inputs and validation
    <div class="error"></div>
    <button type="button" class="next">Next</button>
<section>
<section>
    <h2>Section 3</h2>
    // Your inputs and validation
    <div class="error"></div>
    <button type="submit" class="next">Submit</button> // submit button for last section
</section>

CSS(隐藏所有,但第一部分)

css (hide all but the first section)

section:not(:first-of-type) {
    display:none;
}

剧本

$('button').click(function () {
  var container = $(this).closest('section');
  var isValid = true;     
  $.each(container.find('input'), function () { // include select, textarea as required
    $('form').validate().element($(this));
    if (!$(this).valid()) {
      isValid = false;
      return false;
    }
  });
  if (isValid) {
    container.next('.section').show().find('input').first().focus();
    container.hide();
  } else {
    container.find('.error').text('please complete');
  }
});

这将解决所有客户端验证,而不需要多个职位/重定向。至于在不必返回的观点,因为模型仍是无效的极少数情况下会发生什么((S)将会产生,但错误信息可能是一个隐藏的部分,因此最初并未看到)

This will address all client side validation without the need for multiple posts/redirects. As for what happens in the rare instance of having to return the view because the model is still invalid (the error message(s) will be generated but could be in a hidden section so not initially visible)


  1. 只是让通过向导用户逐步试(可能会产生混淆
    如果错误是不可见的在第一部分)

  2. 使用jQuery来找到生成的错误(S),例如
    $('span.field验证错误)和取消隐藏关联
    父节(S)

  1. Just let the user step through the 'wizard' again (may be confusing if an error is not visible in the first section)
  2. Use jquery to find the generated error(s), for example $('span.field-validation-error) and the unhide the associated parent section(s)

这篇关于帖子视图模型实例回几个动作方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆