pfModalOverlay: no way to close modal for custom validations #755

Activity

1. gnehapk commented on Aug 9, 2018

   

   gnehapk

   on Aug 9, 2018

   More actions

   Also I am not able to access form controls in order to validate and provide error messages accordingly. For eg. I am using ng-maxlength which sets the flag {formname}{fieldname}.$error.maxlength to false but I don't see a way to access it inside the pfModalOverlay component.
2. dtaylor113

   self-assigned this

   on Aug 9, 2018
3. dtaylor113 commented on Aug 9, 2018

   

   dtaylor113

   on Aug 9, 2018

   Member

   More actions

   Hi @gnehapk, I updated the ngDoc example pfModalOveral to show maxLength errors:
   
   Here is the relevant HTML in `demo-form.html':

   <input type="text" name="fieldTwo" id="textInput2" class="form-control" 
          ng-model="$ctrl.modalBodyScope.inputs.second"
          ng-maxlength="$ctrl.modalBodyScope.maxLength" />
   

   *Note: added $scope.formScope.maxLength = 6; $scope.formScope is used for $ctrl.modalBodyScope when passed into the pfModalOverlay component. I also added a name attribute to the input field.

   Here is the error validation message:

     <div ng-if="demoForm.fieldTwo.$dirty && demoForm.fieldTwo.$touched">
          <div class="has-error" ng-if="demoForm.fieldTwo.$error.maxlength">
            <span class="help-block">
              Field Two exceeds max length of {{$ctrl.modalBodyScope.maxLength}}!
            </span>
          </div>
       </div>
   

   Where demoForm is already defined as <form name='demoForm'...
4. dtaylor113 commented on Aug 10, 2018

   

   dtaylor113

   on Aug 10, 2018

   Member

   More actions

   For Tendrl (Gluster Management UI) and Ceph-dashboard
5. jeff-phillips-18

   closed this as completedin #756on Aug 14, 2018
6. dtaylor113 commented on Aug 14, 2018

   

   dtaylor113

   on Aug 14, 2018

   Member

   More actions

   The fix/enhancement for this Issue is available in angular-patternfly v4.18.5