0

I'm working on big form for one of my project.

This is how I'm designing my form

@Html.EditorFor(model => model.EmployeeMaster.EMP_FirstName, new { htmlAttributes = new { @class = "form-control", required = "required", @ng_model = "EmployeeMaster.EMP_FirstName", @ng_change = "setFullName()", ng_minlength="3" } })

<span ng-show="EmployeeMaster.EMP_FirstName.$touched && EmployeeMaster.EMP_FirstName.$invalid">The name is required.</span>
<p ng-show="employeeForm.EmployeeMaster.EMP_FirstName.$error.minlength">Username is too short.</p>    
<ng-show="employeeForm.EMP_FirstName.$error.minlength">1. Username is too short.</p>

I've tried to get them validated with above options, but none of them are working, may I know what could be the reason?

Update

This how html generated.

<input class="form-control text-box single-line ng-dirty ng-valid-parse ng-not-empty ng-valid-required ng-valid ng-valid-minlength ng-touched" id="EmployeeMaster_EMP_FirstName" name="EmployeeMaster.EMP_FirstName" ng-change="setFullName()" ng-minlength="3" ng-model="EmployeeMaster.EMP_FirstName" required="required" type="text" value="">

<span ng-show="EmployeeMaster.EMP_FirstName.$touched &amp;&amp; EmployeeMaster.EMP_FirstName.$invalid" class="ng-hide">The name is required.</span>
<p ng-show="employeeForm.EmployeeMaster.EMP_FirstName.$error.minlength" class="ng-hide">Username is too short.</p>
<p ng-show="employeeForm.EMP_FirstName.$error.minlength" class="ng-hide">1. Username is too short.</p>
Mox Shah
  • 2,967
  • 2
  • 26
  • 42
  • If you inspect your HTML, can you verify MVC is creating the Angular attributes correctly in the resulting element? – jcc Feb 17 '17 at 17:47
  • @jcc I've updated my post, with generated html. – Mox Shah Feb 17 '17 at 17:51
  • Is it because of my model is nested ? like `EmployeeMaster.FirstName` ? – Mox Shah Feb 17 '17 at 17:52
  • Right, your span should work as it is correctly referencing `EmployeeMaster.EMP_FirstName` which should be registered to the $scope of your controller – jcc Feb 17 '17 at 18:06
  • @jcc I didn't get it – Mox Shah Feb 17 '17 at 18:11
  • Does the validation on your `span` work? Does it show when it is touched and invalid? Try it with just `$touched` to start with, and add onto it from there. – jcc Feb 17 '17 at 21:48
  • @jcc Nope, it doesn't show anything for $touched – Mox Shah Feb 18 '17 at 04:43
  • @MoxShah make sure you have validations in proper format `formName.elementName.$error.typeOfError` for example `employeeForm.EMP_FirstName.$error.minlength`. I thought the problem with your name attribute is nested `name="EmployeeMaster.EMP_FirstName"` what is `EmployeeMaster` here? – nivas Feb 18 '17 at 05:32
  • @nivas `EmployeeMaster` is an entity, in my form there're 9-10 entities which I'm binding to control, and its working fine for add/update, just this properties are not working `$invalid` and `$error` and so... – Mox Shah Feb 18 '17 at 14:43
  • you are missing `ng-show="formNameHere.EmployeeMaster.EMP_FirstName.$touched` it must be enclosed in a form and that form must have a name attribute, you just have started your `ng-show` with your entity name – nivas Feb 18 '17 at 14:49

0 Answers0