Problem with button

Question

Problem with button

Navigation

#1 by (0 votes)
#2 by (0 votes)

-1

I have two buttons, one to activate category and another to disable, each with its layout. I need to switch between the two, when one active, it changes in the bank to activated and is displayed while the other does not appear and vice versa. But I'm not understanding the logic of how to do this. I know it's with ajax, for an alter.php for example.

<button class="on-default remove-row text-warning"><i=class="fa fa-thumbs-o-down"><i></button>

<button class="on-default remove-row text-success"><i=class="fa fa-thumbs-o-up"><i></button>

Can anyone give a force?

php ajax

asked by anonymous 29.10.2018 / 15:00

2 answers

Eloquent returning field and value How to load a page inside a div with angular

score 0 · Answer 1

Create a class in the css to hide the button:

.isHidden{ display: none}

Add a class to identify the buttons:

Example:

<button class="button-active on-default remove-row text-warning"><i=class=" fa fa-thumbs-o-down"><i></button>

Like Ajax, make sure the category is active, if it is not, you go to button and hide it. Example:

$(".button-active").addClass('isHidden');

If the category is active, you remove the class :

$(".button-active").removeClass('isHidden');

score 0 · Answer 2

Using Jquery you can use the .toggle() method:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonstyle="display:block;" onclick="toggle_button()" class="on-default remove-row text-warning" id="bon">ON</button>
<button style="display:none;" onclick="toggle_button()" class="on-default remove-row text-success" id="boff">OFF</button>

<script>

function toggle_button(val) {
    $('#bon').toggle();
    $('#boff').toggle();
}

</script>

function toggle_button(val) {
	$('#bon').toggle();
	$('#boff').toggle();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonstyle="display:block;" onclick="toggle_button()" class="on-default remove-row text-warning" id="bon">ON</button>
<button style="display:none;" onclick="toggle_button()" class="on-default remove-row text-success" id="boff">OFF</button>