Saturday 2 April 2016

NG-Form Validation in controlle and service call


html-view:
==========

<form name="formname" ng-sbumit="ctrl.ctrlmethod(ctrl.model[formmodel], formname)" novalidate>
<label>Name</label>
<input type="text" name="name" ng-model="ctrl.model[formmodel].name" ng-pattern="/^[a-z ,.'-]+$/i" required />
<span ng-show="ctrl.crtlflagForm && formname.name.$error.required" class="ngMessagesClass"> Field should not be empty </span>
<div ng-messages="formname.name.$error" class="ngMessagesClass">
<div ng-message="name"> Invalid name/email format </div>
</div>
</form>


**[formmodel]- here taking all form values
For characters only ===> ng-pattern="/^[a-z ,.'-]+$/i" 
For staring with 789+9digits number ng-pattern="/^[789]\d{9}$/"
For ng-minlength, ng-maxlength


form.controller.js:
===================

 self.ctrlmethod = function(formdata, requiredvalidateForm) {

      self.formdataDetails = formdata;
      console.log(self.formdataDetails);
      self.requiredvalidateForm = true;
      var datalength = _.keys(self.formdataDetails).length;

      if (datalength === 1) {

        formService.serviceCall(self.formdataDetails).then(function(response) {

          if (response.statusCode === 200) {
            ngDialog.open({
              scope: $scope,
              template: 'success-popup.html'
            });
          }
          self.model = {};
          self.requiredvalidateForm = false;
          console.log("inCtrl " + response);
        }, function() {
          console.log("Some error occurred. Please check again");
        });

      }
    }


form.service.js
================

 self.serviceCall = function(userFormDetails) {
        var requestData = userFormDetails;
        console.log(requestData);
        var deferred = $q.defer();
        $http.post(config.Url.API, requestData).then(function(response) {
          if (response) {
            deferred.resolve(response.data);
          }
        });
        return deferred.promise;
      };


index.html/footer.html:      IN one of HTML/view Add template code
======================

<script type="text/ng-template" id="success-popup.html">
    <div class="success-popup">Nice to discuss with you!</div>
</script>

No comments:

Post a Comment