Click here to Skip to main content
15,868,141 members

How to use serverside validation using angular js

Member 12999575 asked:

Open original thread
// In my home controller
[HttpGet]
public JsonResult IsUserNameExist(string Name)
{
using (CobraDBEntities db = new CobraDBEntities())
{
var check = !db.Person.Any(x => x.Name == Name);// if we use Person per then per.Name, and so on but we use string Name so that

return Json(check, JsonRequestBehavior.AllowGet);
}
}

// Annotation Required Field Validator Class
public  class PersonMD
      {
          public int Id { get; set; }
          [Required]
        // using json look in home controller
          [Remote("IsUserNameExist", "Home",ErrorMessage ="  Username Already Exist Use Another one")]
          public string Name { get; set; }
          [Required]
          public string Address1 { get; set; }
          [Required]
          public string Address2 { get; set; }
          [Required]
          public string Town_City { get; set; }
      }


Without using Angularjs this is working fine
If i use angularjs then
IsUserNameExist
doesn't work

What I have tried:

// in index.cshtml
<div class="modal-body">
                        <form name="form1">
                            <table class="table">
                                <tr>
                                    <td>Name</td>
                                    <td>
                                        <input type="text" ng-model="Name" name="name" ng-minlength="3" ng-maxlength="20" required />
                                        @*<span color="alert-danger" class="help-block" ng-show="form1.name.$invalid">Required </span>*@
                                        <span color="red" class="label label-info" ng-show="form1.name.$error.minlength">Too short </span>
                                        <span color="alert-danger" class="label label-info" ng-show="form1.name.$error.maxlength">Too long </span>
                                    </td>
                                <tr>
                                    <td>Address1</td>
                                    <td>
                                        <input type="text" ng-model="Address1" name="Add1" ng-minlength="3" ng-maxlength="100" required />
                                      
                                        <span color="alert-danger" class="label label-info" ng-show="form1.Add1.$error.minlength">Too short </span>
                                        <span color="alert-danger" class="label label-info" ng-show="form1.Add1.$error.maxlength">Too long </span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Address2</td>
                                    <td>
                                        <input type="text" ng-model="Address2" name="Add2" ng-minlength="3" ng-maxlength="100" required />
                                       
                                        <span color="alert-danger" class="label label-info" ng-show="form1.Add2.$error.minlength">Too short </span>
                                        <span color="alert-danger" class="label label-info" ng-show="form1.Add2.$error.maxlength">Too long </span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>[Town/City]</td>
                                    <td>
                                        <input type="text" ng-model="Town_City" name="town" ng-minlength="3" ng-maxlength="20" required />
                                       
                                        <span color="alert-danger" class="label label-info" ng-show="form1.town.$error.minlength">Too short </span>
                                        <span color="alert-danger" class="label label-info" ng-show="form1.town.$error.maxlength">Too long </span>
                                        
                                    </td>
                                </tr>
                                <tr>

                                    <td>
                                        <input type="button" class="btn btn-default" value="Save" ng-disabled="form1.$invalid" data-dismiss="modal" ng-click="AddUpdatePerson()" />
                                        <input type="button" class="btn btn-danger" value="Cancel" data-dismiss="modal" ng-click="Cancel()" />
                                    </td>
                                </tr>
                            </table>
                        </form>

                    </div>
Tags: C#, MVC, AngularJs, Validation, Client side, Server-side

Plain Text
ASM
ASP
ASP.NET
BASIC
BAT
C#
C++
COBOL
CoffeeScript
CSS
Dart
dbase
F#
FORTRAN
HTML
Java
Javascript
Kotlin
Lua
MIDL
MSIL
ObjectiveC
Pascal
PERL
PHP
PowerShell
Python
Razor
Ruby
Scala
Shell
SLN
SQL
Swift
T4
Terminal
TypeScript
VB
VBScript
XML
YAML

Preview



When answering a question please:
  1. Read the question carefully.
  2. Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
  3. If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
  4. Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.
Let's work to help developers, not make them feel stupid.
Please note that all posts will be submitted under the http://www.codeproject.com/info/cpol10.aspx.



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900