Currently, I am utilizing MVC Razor View in combination with AngularJS.
Within the controller, I am initializing the UserMaster object and passing it along to the view.
Function AddNewUser() As ActionResult
Dim objUser As New UserMaster()
Return View("UserMaster", objUserMaster)
End Function
Within the View, HTML helper classes are used to generate text boxes and validation controls.
@<div ng-app ng-controller="UserController">
@Html.EditorFor(Function(model) model.UserName)
@Html.ValidationMessageFor(Function(model) model.UserName)
On the client side, the following code is used to create an AngularJS model:
<script type="text/javascript">
function UserController($scope, $http) {
$scope.UserData = @Html.Raw(Json.Encode(Model));
}
</script>
While server-side validations (defined within the UserMaster Class) work well on the client side as well, thanks to the razor engine generating client-side validation scripts automatically.
Upon submission, I effortlessly retrieve a populated model on the server side.
However, there's a challenge with accessing or manipulating model data on the client side using AngularJS. Specifically, I'm struggling to access the UserName value within the text box when a user makes changes using AngularJS. Any suggestions?