locked
How To Maintain visibility of <fieldset> on the change of selection RRS feed

  • Question

  • User-1746098369 posted

    Hi Frens 

    there is a one more scenario , I have a different Different <Fieldset> on html page 

    on one of the selection change i need to maintain the visibility of one of the fieldset , e.g. if value is o then <Feildset if="Supp1"> is need to visible true else visible = false 

    please help me in it 

    thanks in advance 

    Wednesday, October 10, 2018 9:26 AM

Answers

  • User2103319870 posted

    but not working for me

    Your sample code is working fine as expected. You can find a sample demo here.

    Make sure you have the Jquery references added to your page properly. Also Use developer tools(F12) in your browser and see if you are getting any errror.

    Sample Code Used

    <!DOCTYPE html>
    <html>
    
      <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width">
        <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
        <script>
          $(function() {
            $("#TT").change(function() {
              if ($("#TT").val() === "1") {
                $("#Supp1").show();
              } else {
                $("#Supp1").hide();
              }
            });
          })
        </script>
      </head>
    
      <body>
        <fieldset>
          <select name="" id="TT">
        <option value="Select">Select</option>
         <option value="1">One</option>
         <option value="0">Two</option>
      </select>
        </fieldset>
        <br/>
        <fieldset id="Supp1">
          Fieldset to hide and display
        </fieldset>
      </body>
    
    </html>
    

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 10, 2018 11:29 PM

All replies

  • User1724605321 posted

    Hi Rjk_P,

    You can refer to below code sample :

                <input id='textbox' />
    <fieldset id="fieldset1"> <legend>Personalia:</legend> </fieldset>

    Jquery :

                $("#textbox").change(function () {
                    if ($('#textbox').val()=="o") {
                        $("#fieldset1").hide();
                    }
                    else {
                        $("#fieldset1").show();
                    }
                });
    
    
            })

    Best Regards,

    Nan Yu

    Wednesday, October 10, 2018 9:44 AM
  • User-1746098369 posted

    hi Nan Yu 

    thank you for your reply , bwlo is the code i am using 

    <script>
                                            $(function () {


                                                $("#TT").change(function () {
                                                    if ($("#TT").val() === "1") {
                                                          $("#Supp1").show();
                                                          }
                                                          else 
                                                          {
                                                          $("#Supp1").hide();
                                                    }
                                                });


                                            })
                                        </script>  

    here TT is the name of Selection which is placed in some other Feildset , and this script i placed in the fieldset which need to be show and hide 

    but not working for me , please help 

    <script> $(function () { $("#TT").change(function () { if ($("#TT").val() === "1") { $("#Supp1").show(); } else { $("#Supp1").hide(); } }); }) </script>

    Wednesday, October 10, 2018 10:13 AM
  • User2103319870 posted

    but not working for me

    Your sample code is working fine as expected. You can find a sample demo here.

    Make sure you have the Jquery references added to your page properly. Also Use developer tools(F12) in your browser and see if you are getting any errror.

    Sample Code Used

    <!DOCTYPE html>
    <html>
    
      <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width">
        <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
        <script>
          $(function() {
            $("#TT").change(function() {
              if ($("#TT").val() === "1") {
                $("#Supp1").show();
              } else {
                $("#Supp1").hide();
              }
            });
          })
        </script>
      </head>
    
      <body>
        <fieldset>
          <select name="" id="TT">
        <option value="Select">Select</option>
         <option value="1">One</option>
         <option value="0">Two</option>
      </select>
        </fieldset>
        <br/>
        <fieldset id="Supp1">
          Fieldset to hide and display
        </fieldset>
      </body>
    
    </html>
    

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 10, 2018 11:29 PM
  • User-1746098369 posted

    Thank you A2H for such a nice explanation 

    Thursday, October 11, 2018 9:07 AM