亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

[Angularjs]表單驗證

標簽:
AngularJS

写在前面

在开发中提交表单,并对表单的值进行验证是非常常见的操作,angularjs对表单验证提供了非常好的支持。

demo

表单

<form name="myform" novalidate action="../api/order/lists/add" method="post">
   <p>
       <input type="text" name="name" ng-model="order.name" value="" required />
       <span style="color:red" ng-show="myform.name.$dirty && myform.name.$invalid">
           <span ng-show="myform.name.$error.required">订单名称是必须的。</span>
       </span>
   </p>
   <p>
       <input type="text" name="price" ng-model="order.price" value="" required />
       <span style="color:red" ng-show="myform.price.$dirty && myform.price.$invalid">
           <span ng-show="myform.price.$error.required">单价是必须的。</span>
       </span>
   </p>

   <input type="submit" name="name" ng-disabled="myform.name.$dirty && myform.name.$invalid ||
 myform.price.$dirty && myform.price.$invalid" /></form>


服务端

        [HttpPost]
       [Route("api/order/lists/add")]        public async Task<HttpResponseMessage> Post([FromBody] Order order)
       {            return await Task.Factory.StartNew(() =>
           {
               HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.Accepted);
               order.Id = Guid.NewGuid();
               lstOrders.Add(order);
               response = new HttpResponseMessage(HttpStatusCode.Accepted)
               {
                   Content = new StringContent(JsonConvert.SerializeObject(new { _code = 200, _data = lstOrders }))
               };                return response;
           });
       }


测试

提交后数据

总结

$dirty:表单有填写记录

$valid:字段内容合法的

$invalid:字段内容是非法的

$pristine:表单没有填写记录

點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消