javascript - angular UI-Bootstrap modal not binding with controller -


i create ng-template , bind controller , template pass through ui-bootstrap modal. code :-

vm.uploadfile = function () {         var uploadmodal = $uibmodal.open({             animation: true,             templateurl: 'upload.html',             bindtocontroller: true,             controller: 'modalctrl',             controlleras: 'modalvm',             resolve: {                 items: function () {                  }             }         });          uploadmodal.result.then(function (data) {                  data.uploadedby = 'admin';                 data.filename = data.name;                 vulgridservice.datastackforfile.unshift(data);                 vulgridservice.gridapi.core.refresh();             }, function () {                 console.log('modal dismissed at: ' + new date());             }         );     }  } 

my template below:-

<script type="text/ng-template" id="upload.html"> <div class="">     <form name="component" ng-submit="modalvm.upload()" novalidate>          <h4 class="margin-null modal-padding bg-primary">upload file</h4>          <div class="modal-body">             <div class="form-group">                 <label>file type</label><br>                 <div class="select-drop-down-icon">                     <select ng-model="modalvm.file.filetype"                             name="filetype"                             class=" cover-block input-field-styling"                             ng-change="modalvm.checkfile()" required>                         <option value="">select file extension</option>                         <option value="qualys">qualys(.xml)</option>                         <option value="nessus">nessus(.nessus)</option>                         <option value="zip">.zip</option>                     </select>                 </div>             </div>             <div class="form-group bottom-spacing">                 <label>file upload</label><br>                 <div class="cover-block form-control padding-null">                     <input class="border-null text-field-padding" ng-model="modalvm.file.name">                     <!--<file-field ng-change="modalvm.checkfile(uploadfile.name)"-->                                 <!--class="btn btn-primary inline-view pull-right "-->                                 <!--ng-model="uploadfile">-->                         <!--<i class="fa fa-upload" aria-hidden="true"></i>-->                         <!--chose file-->                     <!--</file-field>-->                     <div class="btn btn-primary inline-view pull-right upload-field">                         <i class="fa fa-upload" aria-hidden="true"></i> chose file                         <input grab-file-name get-file-name="modalvm.getfilename" type="file" class="upload">                     </div>                      <div class="top-space">                         <span class="error-text" ng-show="modalvm.extension">                             please select proper extension file                         </span>                     </div>                 </div>             </div>              <div class="text-center">                 <button ng-disabled="modalvm.extension" type="submit"                         class="btn btn-success sharp mar-right" aria-label="close">save                 </button>                 <button type="reset" ng-click="modalvm.cancel()" data-dismiss="modal"                         class="btn btn-danger sharp mar-right" aria-label="close">cancel                 </button>             </div>         </div>     </form> </div> 

modalctrl

function modalctrl($uibmodalinstance, toastr, datefactory, $scope) {      var modalvm = this;      modalvm.extension = false;      console.log($scope);       modalvm.cancel = function () {         $uibmodalinstance.dismiss('cancel');     };      modalvm.upload = function (data) {         // data.uploadedon = datefactory.getdate();         // $uibmodalinstance.close(data);         // toastr.success('file uploaded', 'success', {closebutton: true});     };      modalvm.checkfile = function (file, filetype) {         console.log(file, filetype);         if (file) {             switch (filetype) {                 case 'nessus':                     var matchnessus = /[(a-z)(a-z)(0-9^)]+.(nessus)/g;                     if (matchnessus.test(file)) {                         console.log('nessus', file);                         modalvm.extension = false;                     } else {                         modalvm.extension = true;                     }                     break;                 case 'qualys':                     var matchqualys = /[(a-z)(a-z)(0-9^)]+.(xml)/g;                     if (matchqualys.test(file)) {                         console.log('qualys', file);                         modalvm.extension = false;                     } else {                         modalvm.extension = true;                     }                     break;                 case 'zip':                     var matchzip = /[(a-z)(a-z)(0-9^)]+.(zip)/g;                     if (matchzip.test(file)) {                         console.log('zip', file);                         modalvm.extension = false;                     } else {                         modalvm.extension = true;                     }                     break;                 default:                     modalvm.extension = true;                     break;             }         }       };      modalvm.getfilename = function (gotfilename) {         console.log($scope.filetype);         modalvm.filename = gotfilename;     };  } 

in input field not binding controller function invoking, please give hint or solution on it.


Comments

Popular posts from this blog

Combining PHP Registration and Login into one class with multiple functions in one PHP file -

magento2 - Magento 2 admin grid add filter to collection -

Android volley - avoid multiple requests of the same kind to the server? -