I'm new to AngularJS and I can seem to find a solution to my problem. I have a file upload field on my site and a submit button. This page has a drop down list and a disabled submit button when the user first hits the page. The submit button is only enable once a selection is made from the drop down list. This works great but I have now been asked to add a file upload option to the list which I have done and my file upload
<select name="selectedbankaccountname" ng-options="choice for choice in bankaccountnames" ng-model="selectedbankaccountname" class="form-control" style="width:100% !important" focus-on="setfocus" required>
<!-- TODO - BUTTON NEEDS TO BE DISABLED IF BANK UPLOAD SELECTED & FILE NOT SELECTED -->
<button type="submit" class="btn btn-success" ng-disabled="startautoreconciliation.selectedbankaccountname.$invalid || disablebutton" ng-click="startrec()" title="Click to start the auto reconciliation procedure.">Start Auto Rec</button>
<div class="form-group" ng-if="bankreconciliation.reconciliationtype == 'Bank file upload'">
<p>Please ensure that you have copied the selected file to the designated folder prior to uploading the bank file.</p>
<input type="file" style="width: 100%; height: 35px; border: none !important; cursor: pointer" onchange="angular.element(this).scope().file_changed(this)" ng-model="bankfilepath" />
In your submit button,
ng-disabled="!bankfilepath || startautoreconciliation.selectedbankaccountname.$invalid || disablebutton"
bankfilepath as well.
So the button will be enabled only if the file is selected. Initially the
bankfilepath will be undefined and once the user has selected a file, it will have the file path.