验证Asp.net MVC中的两个按钮

时间:2017-09-05 16:51:19

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

我有两个按钮,但我只能验证一个。当用户单击添加并且未填写整个表单时,他们会收到错误消息但是如果他们单击“完成”而不是给出错误消息,则会转到另一个页面,但我想在转到该页面之前给出错误。这是我到目前为止的一个:

@model student.Models.Student

<h2>Student Record</h2>


@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Issue</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })

        <div class="form-group">
            @Html.LabelFor(model => model.studentNumber, htmlAttributes: new { @class = "col-md-2" })
            @Html.EditorFor(model => model.studentNumber, new { htmlAttributes = new { @readonly = "readonly", @id = "reqnum", @class = "form-control" } })
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "col-md-2" })
            @Html.ValidationMessageFor(model => model.name, "", new { @class = "text-danger" })
        </div>

        <div class="form-group">
            @Html.Label("Processed by:", htmlAttributes: new { @class = "col-md-2" })
            @Html.DropDownListFor(model => model.processedbyDetails.employeeNum, new SelectList(ViewBag.StoresReps, "Value", "Text"), new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.processedbyDetails.employeeNum, "", new { @class = "text-danger" })

        </div>

        @* -- MANY OTHER INPUTS -- *@


        <div class="form-group">
            <div class="col-md-offset-4 col-md-12">
                <input type="submit" value="Add" name="Add" class="btn btn-default" width="89" />
                <input type="button" value="Finish" name="Issue" margin="50px" onclick="location.href='@Url.Action("ViewIssue", "Issue")' " class="btn btn-default" />
                <input type="button" value="Cancel" name="Cancel" margin="50px" onclick="location.href='@Url.Action("Cancel", "Issue")' " class="btn btn-default" />
            </div>
        </div>
    </div>
}

修改

@{
    ViewBag.Title = "Student Item";
}
<!-- JS includes -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>

<script type="text/javascript">

<script type="text/javascript">
 function onFinishClick() {
        if ($('form').valid()) {
            location.href = '@Url.Action("ViewIssue", "Issue")';
            }
            return false;
            }
</script>


<input type="button" value="Finish" name="Issue" margin="50px" onclick="onFinishClick()" class="btn btn-default" />

1 个答案:

答案 0 :(得分:0)

您正在使用MVC,因此只需注释您的ViewModel并提交包含框架为您提供的内置功能的表单。

public class Student
{
    [StringLength(100)]
    [DisplayName("Student Name")]
    [Required(ErrorMessage = "Please enter a Student Name")]
    public string Name { get; set; }

    [StringLength(100)]
    [DisplayName("Student Number")]
    [Required(ErrorMessage = "Please enter a Student Number")]
    public string StudentNumber { get; set; }

    // etc...
}

您的表单还应该包含Action您尝试POST到... {/ p>的名称

@using (Html.BeginForm("AddOrFinish", "HomeController", FormMethod.Post, new { role = "form" }))

您无法通过不属于submit类型的按钮验证MVC中viewmodel上的数据注释(好吧,也许您可​​以,但可能更多工作)。

然后,您应该将两个按钮标记为submit类型,然后询问发送后点击的按钮的名称。

    <div class="form-group">
        <div class="col-md-offset-4 col-md-12">
            <input type="submit" value="Add" name="add" class="btn btn-default" width="89" />
            <input type="submit" value="Finish" name="issue" margin="50px" class="btn btn-default" />
            <input type="button" value="Cancel" name="Cancel" margin="50px" onclick="location.href='@Url.Action("Cancel", "Issue")' " class="btn btn-default" />
        </div>
    </div>

然后在您的控制器中,使用此签名创建一个方法。由于您有两个提交按钮,按钮的值将在请求中发送,您可以查询它。它看起来像这样......

[HttpPost]
public ActionResult AddOrFinish(Student model, string add, string issue)
{
    if (!ModelState.IsValid)
    {
        return RedirectToAction("PageImOnNow", model);
    }

    if (!string.IsNullOrEmpty(add))
    {
        // do your add logic
        // redirect to some page when user clicks "Add"
        return RedirectToAction("WhateverPageYouWant");
    }
    else
    {
        // do your finish logic
        // redirect to ViewIssue page when user clicks "Finish"
        return RedirectToAction("ViewIssue");
    }
}

此处提供更多信息 -

Handling multiple submit buttons on a form in MVC

Best Practices for ViewModel validation in MVC