When we are using UI-Select we need to reset the selected Item.
We can achieve this by using
<ui-select id="organization" ng-model="data.SelectedOrganization" class="form-control-static" on-select="onSelectedOrg()" > <ui-select-match placeholder=" select a organization..."> {{$select.selected.Text}} </ui-select-match> <ui-select-choices repeat="org in data.Organizations | propsFilter: {Text: $select.search}" refresh="refreshOrgs($select.search)" refresh-delay="0"> <div ng-bind-html="org.Text | highlight: $select.search"></div> </ui-select-choices> </ui-select>
<input id="clear" type="Button" value="Clear" ng-click="clear()" />
Javascript
$scope.clear = function () { $scope.data.SelectedOrganization = undefined; };
Awesome blog with lots of information. It is really helpful for all.
ReplyDeleteAngularJS Training in Chennai
AngularJS course in Chennai
Angular 6 Training in Chennai
ReactJS Training in Chennai
PHP Training in Chennai
Web Designing course in Chennai
Tally course in Chennai
AngularJS Training in Velachery
AngularJS Training in T Nagar
AngularJS Training in OMR
This example provides a clear and practical way to reset a selected value in Angular UI-Select by assigning undefined to the model when the Clear button is clicked. The separation between the UI control, ng-model, and the $scope.clear() function makes the implementation easy to follow and demonstrates how Angular can manage interactive form elements effectively. Developers working with similar components can benefit from Angular Training to understand these concepts in a broader application-development context.
ReplyDeleteAnother useful aspect is the use of ng-click to trigger the reset operation without requiring complicated UI logic. Once the selected organization is cleared, the bound UI-Select model is updated accordingly, showing how Angular's data binding can simplify state management in web interfaces. These fundamentals also connect naturally with broader JavaScript development, making a Javascript Online Course a relevant complement for developers building interactive applications.
ReplyDelete