使用 Web API 控制器验证表单

本文关键字:验证 表单 控制器 API Web 使用 | 更新日期: 2023-09-27 17:57:25

我有一个 web api 应用程序,其中我有这个形式:

     <form id="editForm">
                    <input id="editid" type="hidden" name="id" />
                    <p><label>Numéro cnss </label><input id="cnss" name="cnss" /><label style="color:red" id="labError"> ( * )</label></p>
                    <p><label>Nom </label><input id="lastname" name="lastname" /><label style="color:red" id="labError"> ( * )</label></p>
                    <p><label>Prénom </label><input id="firstname" name="firstname" /><label style="color:red" id="labError"> ( * )</label></p>
                    <p><label>Adresse   </label> @Html.TextArea("address", new { id = "address" })<label style="color:red" id="labError"> ( * )</label></p>
                    <p><label>Lieu de naissance </label><input id="birth_place" name="birth_place" /> </p>
                    <p><label>Mutuelle </label><input id="mutuelle" name="mutuelle" /><label style="color:red" id="labError"> ( * )</label></p>
                    <p><label>Caisse d'assurance maladie </label><input id="caisse_assu_maladie" name="caisse_assu_maladie" /><label style="color:red" id="labError"> ( * )</label></p>
                    <p>
                        <label>Type de client   </label>
                        <select id="client_type" name="client_type">
                            <option value="demande de transport régulière sur une période">demande de transport régulière sur une période</option>
                            <option value="demande de transport régulière et indéfinie">demande de transport régulière et indéfinie</option>
                            <option value="Ponctuel ">Ponctuel </option>
                        </select>
                    </p>
                </form>
 <button id="btnStepTwo" type="submit" class="btn btn-primary" >Commencer la réservation</button>

在 API 控制器中,我有此操作:

 [HttpPost]
        public bool ValidateClient(ClientModel item)
        {
            return ModelState.IsValid;  
        }

我想为表单中的每个更改添加一个 javascript 方法,此方法调用 ValidateClient 服务来验证表单中的模型是否有效:如果模型有效 ==> 按钮将被启用,否则将被禁用。

  1. 如何完成此任务?
  2. 什么是最好和最简单的方法?

使用 Web API 控制器验证表单

change()事件附加到输入:

$('input').on('change', function (e) {
    var el = $(e.currentTarget);
    $.post(url, $('form').serialize(), function (data) {
        if (data) {
            // do stuff to "el"
        }
    });
});

从 REST 的角度来看,您可能希望使用正确的 HTTP 代码进行响应。如果模型无效,不确定 200 响应是否有意义。