CODEWITHSUNDEEP
jquerydrop-down-menu
Supertwister
Supertwister

Reputation: 115

Disable dropdown list option based on parameter value

I have the following code. I want that the second option will be automatically disabled if value==0. I know i can disable the option by adding the class disabled inside the <li> tag, but how can add this class according to the parameter value?

function analysisActions(key, value){

  var str= '<div class="dropdown">' +
      '<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Actions '+
      '<span class="caret" style="border-top:4px solid white"></span></button>'+
      '<ul class="dropdown-menu">'+
        '<li><a href="#" data-target="#A_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key +'" id="a_' + key + '">A</a></li>'+
        '<li><a href="#" data-target="#B_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key +'" data-id="' + key + '" id="b_' + key + '">B</a></li>'+
      '</ul>'+
    '</div>';

return str;
}

Upvotes: 0

Views: 154

Answers (2)

irfan
irfan

Reputation: 618

 function analysisActions(key, value) {

    var disabledStr = value == 0 ? ' class="disabled" ' : '';
    var disable = value == 0 ? ' disabled' : '';

    var str = '<div class="dropdown">' +
        '<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Actions ' +
        '<span class="caret" style="border-top:4px solid white"></span></button>' +
        '<ul class="dropdown-menu">' +
        '<li><a href="#" data-target="#A_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key + '" id="a_' + key + '">A</a></li>' +
        '<li' + disabledStr + '><a ' +  disable  + ' href="#" data-target="#B_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key + '" data-id="' + key + '" id="b_' + key + '">B</a></li>' +
        '</ul>' +
        '</div>';

    return str;
}

Upvotes: 2

shu
shu

Reputation: 1956

it's simple use if value == 0 before adding li to the string.If value == 0 add the class class="disabled"

  var str = '<div class="dropdown">' +
  '<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Actions ' +
  '<span class="caret" style="border-top:4px solid white"></span></button>' +
  '<ul class="dropdown-menu">' +
    '<li><a href="#" data-target="#A_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key + '" id="a_' + key + '">A</a></li>';
        if (value == 0) {
            str += '<li class="disabled"><a href="#" class="open-AddBookDialog" data-id="' + key + '" data-id="' + key + '" id="b_' + key + '">B</a></li>';
        }
        else {
            str += '<li><a href="#" data-target="#B_form" data-toggle="modal" class="open-AddBookDialog" data-id="' + key + '" data-id="' + key + '" id="b_' + key + '">B</a></li>';
        }
        str += '</ul>' +
'</div>';

Upvotes: 2

Related Questions