Hide & Show the Page Item with Label and change the color of Active button (jQuery + CSS)

 Hide & Show the Page Item  with Label and change the color of Active button  (jQuery + CSS)


1) Execute when Page Loads


$('#P2_ADD1').hide();

$('#P2_ADD2').hide();

$('label[for="P2_ADD1"]').css('display', 'none');

$('label[for="P2_ADD2"]').css('display', 'none');


1) Create Two button  

Button 1  = Label Name "Enter Address 1",  Static ID = btn1

Button 2  = Label Name "Enter Address 2", Static ID = btn2


2) Two Page Item 

P2_ADD1 =  Label :- India Address

P2_ADD2 =  Label :- OutSide Address

3) When Click on Button 1 

Execute Java Script 

    $('#P2_ADD1').show();

    $('#P2_ADD2').hide();

    $('#btn1').css ('background','red');

    $('#btn2').css ('background','#ccc');


$('label[for="P2_ADD2"]').css('display', 'none');

$('label[for="P2_ADD1"]').css('display', 'initial');


4) When Click on Button 2

Execute Java Script 

    $('#P2_ADD2').show();

    $('#P2_ADD1').hide();

    $('#btn2').css ('background','red');

    $('#btn1').css ('background','#ccc');

$('label[for="P2_ADD1"]').css('display', 'none');

$('label[for="P2_ADD2"]').css('display', 'initial');

Other Method is  Toggle Even 

$('document').ready(function()

                   {

     $('#P14_NUM').toggle();

    $('label[for="P14_NUM"]').toggle();

});



Comments

Popular posts from this blog

Telegram Integration with Oracle

The username or password for the connection pool named |apex||, are invalid, expired, or the account is locked

Enabled SQL Developer Web (SDW) & ORDS Database API ORDS 19.4