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

magento2 - Magento 2 admin grid add filter to collection -

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

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