Click on checkbox button, will display textfield and submit button, click on submit button should disable the checkbox button
<pre><code>&lt;td&gt;
  &lt;input type="checkbox" ng-model="alert.acknowledged" ng-disabled="alert.acknowledged" ng-click="onacknowledgedClick(alert)"&gt;&lt;/td&gt;
&lt;td&gt;
&lt;span ng-if="!alert.acknowledgeInProgress"&gt;{{alert.acknowledgedComments}}&lt;/span&gt;
&lt;div ng-if="alert.acknowledgeInProgress"&gt;
    &lt;input type="text" style="height:30px; width:150px" ng-model="alert.acknowledgedComments"/&gt;
    &lt;button type="button" class="btn btn-primary"  ng-click="saveAlert(alert)"&gt; Submit &lt;/button&gt;
    &lt;button type="button" class="btn btn-primary"  ng-click="cancelAlert(alert)" data-dismiss="modal"&gt; Cancel &lt;/button&gt;
&lt;/div&gt;
</code></pre>

<p>When I click on checkbox button, the text textfield with submit button will be popped up. After entering the comments on textfield, when the user clicks on submit button, the checkbox should get disabled. Can anyone give me some inputs on this? How to disable the checkbox button, once when I click on Submit button?</p>

<pre><code>$scope.saveAlert = function(alert) {
    $scope.alert.acknowledged = true;
    /*alert.acknowledgeInProgress = true;*/
    var alertUrl = $incidentsUrl+ "/" +alert.alertForIncident.incidentID+"/alerts/"+alert.alertID;
    $http.put(alertUrl, alert).then(function(result) {
        alert.acknowledgeInProgress = false;
    });     
}
</code></pre>