angularjs - How to validate parent form from inner form -
i have form following :
<form name="mypage.myform"> ... <ng-include src="'panel1.html'"></ng-include> ... <md-button ng-disabled="mypage.myform.$invalid || mypage.myform.$pristine" ng-click="mypage.save()" type=submit> enregistrer </md-button> <md-button ng-disabled="mypage.myform.$invalid || mypage.myform.$pristine" ng-click="" > annuler </md-button> </form>
and code of included html :
<div layout=row layout-sm=column > <my-link link-entity=mypage.dto.organisme constraints=mypage.constraints on-select-item-handler standalone=true search-min-length=0 flex></my-link> </div>
mylink
component:
.component('mylink', { bindings: { linkentity: '=', constraints: '=?', fieldname: '@', standalone: '@', adherence: '@', searchminlength: '<', searchhandler: '&', viewitemhandler: '&', onselectitemhandler: '&', hiddenfields: '@', formname: '@', date: '<?', constraintsjson: '@' }, require: { parent: '?^form' }, templateurl: 'my-link-component.html', controller: 'mylinkcontroller', controlleras: 'slink' });
my-link-component.html :
<ng-form name="{{slink.linkformname}}"> <fieldset class="link-fieldset"> <legend> <md-icon>link</md-icon> </legend> <div layout="row" flex ng-if="slink.isformloaded"> <md-button print-remove ng-if="!slink.constraints.readonly" ng-click="slink.querysearch(' ')" class="md-icon-button md-primary"> <md-icon aria-label="tout voir">view_headline</md-icon> <md-tooltip md-direction="right">afficher toute la liste de : {{slink.uiname | lowercase}}</md-tooltip> </md-button> <md-autocomplete flex ng-disabled="slink.constraints.readonly" md-selected-item="slink.selecteditem" md-search-text="slink.searchtext" md-selected-item-change="slink.changeitem(item)" md-items="item in slink.querysearch(slink.searchtext)" md-min-length="1" md-no-cache="slink.nocache" md-select-on-match=true md-autoselect=true md-item-text="slink.itemtotext(item)" md-input-name="{{slink.property}}" md-input-id="simple-link-component-{{slink.property}}-{{slink.autoid}}-input" md-floating-label="{{slink.floatinglabel}}" md-select-on-focus style="background: none;"> <md-item-template> <span md-highlight-text="slink.searchtext === ' ' ? slink.itemtotext(slink.selecteditemstore) : slink.searchtext" md-highlight-flags="^i"> {{item.domainobjectdescription}} </span> </md-item-template> <md-not-found> <div style="width: 100%;">{{slink.notfoundmsg}} </div> </md-not-found> <div ng-messages="slink.errormessage" ng-if="!slink.constraints.readonly"> <div ng-messages-include='messages/messages.html'></div> </div> </md-autocomplete> <md-button print-remove ng-if="slink.standalone !== 'list' && !slink.constraints.readonly" ng-disabled="!slink.selecteditem" class="md-icon-button md-primary" ng-click="slink.viewitem()"> <md-icon aria-label="voir le détail">visibility</md-icon> <md-tooltip md-direction="left">voir le détail de : {{slink.uiname | lowercase}}</md-tooltip> </md-button> </div> </fieldset> </ng-form>
so have form inside another, , included form has md-autocomplete
has change handler changeitem
, inside method want notify parent form validity of inner form, wrote code validate inner form need how reference parent form, did far, in parent's form directive, wrote method following :
vm.publishstate = function (childisdirty) { if (!vm.posteform.$dirty && !childisdirty){ vm.posteform.$setpristine(); } if (childisdirty) { vm.posteform.$setdirty(); } };
now need call method mylinkcontroller
, or if there solution call scope of parent form.
Comments
Post a Comment