CODEWITHSUNDEEP
javascriptasp.netangularjs
Vivek
Vivek

Reputation: 15

AngularJs: I have a dropdown with list of options and on clear it removes the default value

The Dropdown has list of options and a default "Select Series" option when no other options are selected. Now I have a clear button which will clear the user selection from dropdown so user can select other dropdowns. Problem is When i do clear it also removes my "Select Series" options.

to understand it better, Lets say i have option 1 option 2 and option 3 in the dropdown and a default "select option" when none of the options are selected. What i want is when user selects any of the option 1,2,3 and when i hit clear it should default back to "select option" and not the empty option. bellow is my code

<asp:PlaceHolder runat="server" ID="SeriesPlaceHolder">
                <a data-ng-class="{set: seriesId.length > 0}" class="reveal filter expandFilters icon smallScreenFilter" href="#" data-revealedcontentid="seriesFilters" hidden="hidden">Series</a>
                <div id="seriesFilters" class="revealedContent searchOptions fullClear" hidden="hidden">
                    <label class="mediumLabel left" for="seriesFilter">Series:</label>
                    <div class="styledSelect left">
                        <select id="seriesFilter" data-ng-model="seriesId" data-ng-options="series.Id as series.Name for series in seriesFilterOptions" data-ng-change="getEventResults()">
                            <option value="">Select series</option>

                        </select>
                    </div>
                    <a class="goToResults btn btnRounded right" href="#">Show results</a>
                </div>
            </asp:PlaceHolder>

any help would be appreciated.

Upvotes: 0

Views: 781

Answers (2)

Maxim Shoustin
Maxim Shoustin

Reputation: 77904

You just need to reset your ng-model="seriesId"

 $scope.clear = function(){
   $scope.seriesId = undefined
 }

Some Fiddle Demo

Upvotes: 1

NTP
NTP

Reputation: 4448

Most probably your clear function sets your seriesId to undefined. Since your Select Series option has the value of "" (empty) you will have to set seriesId to empty when you clear. I believe if you use the following it should solve your issue.

$scope.seriesId = "";

Upvotes: 0

Related Questions