ASP.NET MVC 5最佳实践表单提交

时间:2017-06-02 07:04:27

标签: javascript jquery asp.net asp.net-mvc forms

说明 我有一个用户友好输入的表单: this is the form

但是我不能以这种方式提交表单,因为我的模型对于此表单操作看起来像:

    public string Title { get; set; }  // First input
    public string Description { get; set; }  // Second input
    public string SportsmanId { get; set; }  // Not used
    public List<WorkoutExerciseParam> WorkoutExerciseParams { get; set; }  // Items, combined from list items (show on form screenshot)
    public SelectList AvailableSportsmans { get; set; }  // Dropdown list

所以,如果我无法提交,我编写JS代码来构建和发布一致的模型:

$(document)
        .ready(function() {
            $("#submit").click(function() {
                var exerciseList = [];
                /* Assemble exerciseList from OL and UL items */
                var title = $("input#Title").val();
                var description = $("input#Description").val();
                var sportsmanId = $("select#SportsmanId").val();
                $.post('@Url.Action("Create", "Workout")',
                {
                    Title: title,
                    Description: description,
                    SportsmanId: sportsmanId,
                    WorkoutExerciseParams: exerciseList
                });
            });
        });

此代码运行正常,但我无法在操作完成后重定向(例如,当我提交表单时):code sample

然后,我重写了JS代码,它构造了一个隐藏输入的新​​隐藏表单并提交它。但我不知道如何创建输入列表(来自第一个代码示例的列表)。

问题:

向ASP.NET控制器提交数据的最佳做法是什么?我可以使用RedirectToAction()和View()方法抛出JS? 我是否需要构造表单(如何执行对象列表)或如何处理JS中的RedirectToAction()和View()方法?

1 个答案:

答案 0 :(得分:2)

如果你想重定向(或者如果ModelState无效则能够返回视图并显示验证错误,你应该正常提交而不是ajax。使用ajax没有意义,因为ajax调用了不重定向。

您尚未展示如何动态生成与WorkoutExerciseParam集合关联的输入,但只需使用索引器正确命名它们,以便它们受DefaultModelBinder的约束。格式必须是

<input name="WorkoutExerciseParams[0].SomeProperty" .... />
<input name="WorkoutExerciseParams[0].AnotherProperty" .... />
<input name="WorkoutExerciseParams[1].SomeProperty" .... />
<input name="WorkoutExerciseParams[1].AnotherProperty" .... />
....

你可以使用javascript生成这个,但是一个更好的解决方案,它为你提供字符串类型绑定,动态添加项目的客户端验证以及删除项目的能力是使用BeginCollectionItem()方法,如

的答案