javascript - Disable toggle button click function, if button in active class -
i created mvc 4 application. here view of table of project.
i want disable clickable function active button
for example:
disable click function of first row active button , enable click function inactive button
and
disable click function of 2nd row inactive button , enable click function active button
likewise rest of it.
here current cshtml code table view button function
<div class="btn-group btn-toggle" id="btn-toggle"> @if (item.status == true) { <button class="btn btn-xs active btn-primary" data-hei_id = "@item.hei_id" data-status = "true" >active</button> <button class="btn btn-xs inactivecolor btn-default" data-hei_id = "@item.hei_id" data-status = "false" >inactive</button> } else { <button class="btn btn-xs btn-default" data-hei_id = "@item.hei_id" data-status = "true" >active</button> <button class="btn btn-xs inactivecolor btn-primary active" data-hei_id = "@item.hei_id" data-status = "false" >inactive</button> } </div>
this javascript code snippet handle buttons
$('.btn-toggle').click(function () { $(this).find('.btn').toggleclass('active'); //if ($(this).find('btn-primary').toggleclass('active')) { //$(this).prop('disabled', true); //} if ($(this).find('.btn-primary').size() > 0) { $(this).find('.btn').toggleclass('btn-primary'); } if ($(this).find('.btn-danger').size() > 0) { $(this).find('.btn').toggleclass('btn-danger'); } if ($(this).find('.btn-success').size() > 0) { $(this).find('.btn').toggleclass('btn-success'); } if ($(this).find('.btn-info').size() > 0) { $(this).find('.btn').toggleclass('btn-info'); } $(this).find('.btn').toggleclass('btn-default'); });
you can use :not()
:
$('.btn-toggle').find('button:not(.active)').click(function () {
the above 1 binding click event on buttons not have .active
css class in parent div .btn-toggle
where assuming* have .active
css class in css turns button in green background color.
*:you can replace active class.
Comments
Post a Comment