make dropdown item as selected in angularjs

Question

I have make a demo of angularj dropdown menu,and its working fine,But now i want to make selected item as active,I dont have any idea how to do this,can anybuddy please help me ,I have used Angular-Dropdown.js

Mycode is as below:

html

<span class="toolbar-button--quiet navigation-bar__line-height" style="border: none; padding: 0">
                <i  class="ion-android-more-vertical" dropdown-disabled="isDropdownDisabled" style="font-size: 26px; margin: 0; padding: 0 17px 0 12px;" dropdown-menu="ddMenuOptions" dropdown-model="ddMenuSelected" dropdown-disabled="dropdownsDisabled"></i>  
            </span>

js

  $scope.ddMenuOptions = [
        {
            text: 'Featured',
            code: 'F'
        }, {
            text: 'Name (A-Z)',
            code: 'A'
        }, {
            text: 'Rating',
            code: 'M'
        }, {
            text: ' Most Popular',
            code: 'MP'
        }
    ];

    $scope.ddMenuSelected = {
    };



    $scope.$watch("ddMenuSelected", function(newValue, oldValue) {

        $scope.selectedItem = newValue;
        var result = document.getElementsByClassName("dropdown");
        var wrappedResult = angular.element(result);
        wrappedResult.removeClass('active');
        wrappedResult.addClass('activated');
        if (newValue !== oldValue) {

            console.log("=========" + $scope.ddMenuSelected.code);
            $rootScope.ddMenuOptions = false;

augustine · Accepted Answer · 2015-11-17T08:48:35.380

1

set divider to true/false

example:

$scope.ddSelectOptions[0].divider = false;

or

$scope.ddSelectOptions[1].divider = true;

https://jsfiddle.net/66mrssb7/7/

edited Nov 17 '15 at 08:48

answered Nov 17 '15 at 06:25

augustine

538
4
15

tried your code inside $watch but nothing is happening. – JIGAR Nov 17 '15 at 06:37
I made a simple example. It can exactly choice the specified option. https://jsfiddle.net/66mrssb7/ – augustine Nov 17 '15 at 06:55
Oh,Thanks frend,but its not what i need,I want to make option as **active** when i again open dropdown,just same as you have made **label* as active in your example,(active seems it should display different than other items).you get my question dear?please help me. – JIGAR Nov 17 '15 at 07:14
You can set "divider" to true/false. $scope.ddSelectOptions[1].divider = true; $scope.ddSelectOptions[0].divider = false; is that what you want? https://jsfiddle.net/66mrssb7/5/ – augustine Nov 17 '15 at 08:13
Exaclty great,but how to do this on dropdown selection,i mean where to write down this code is the problem..:( – JIGAR Nov 17 '15 at 08:22
watch it. https://jsfiddle.net/66mrssb7/7/ this directive has a change event. but it invoke before changed.
– augustine Nov 17 '15 at 08:44
Can you help in me in my one more query dear? – JIGAR Nov 17 '15 at 10:12
sure. or you can post a new question. – augustine Nov 18 '15 at 02:06
this one :http://stackoverflow.com/questions/33750805/refresh-previous-page-in-onsen-ui-on-back-button – JIGAR Nov 18 '15 at 06:34

make dropdown item as selected in angularjs

1 Answers1