HI to everyone,
I am fully confused.

I have a selectbox with dynamic values. No body what value will come in that select box, based on that value , I want to do hide and show.

How to do that?
 Here I included my dynamic select box,

 <select name='category' id='category'>
 <option value =''>Select category</select>
 $a = mysql_query("SELECT * FROM cat_table")or die(mysql_error());
 while($a_res = mysql_fetch_array($a))
 <option value ='<?php echo $a_res['cat_id']?>'><?php echo $a_res['cat_name']?></select>
 <?php } ?>

Here, in this select box I will get dynamic select box value,
But I can not assume what value I am getting, But based on that 
value I want to hide or show some <div>.

How to do that?
I am fully confused.

Can you give me some examples?

Edited by AntonyRayan

1 Year
Discussion Span
Last Post by mblan180131

As I understand , you can make a javascript function OR JQuery , beacuse your listbox is dynamic so as you said you don't know what values are set in option but if you make a javascript function you can know what value are selected by onchange event. I am not sure if below code is your requirement but it will helps you in some way.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
 <select name='category' id='category' onchange="show_hide(this.value);">
 <option value ='0'>Select category</option>
 <option value='1'>PHP</option>
 <option value='2'>JSP</option>
 <option value='3'>ASP</option>
 <div class="1">This is PHP</div>
 <div class="2">This is JSP</div>
 <div class="3">This is ASP</div>
function show_hide(currentValue){

Hi, Mr mangel.murti,

Thanks for your valuable reply.

I have to compare what option user selected with appropriate selected value,

Based on that i want to hide or show something


I think this should do... but not sure I haven't done it in a while.

$(document).ready(function () {
    $('#selectMe').change(function () {

This problem doesn't have to be overly complicated with JQuery. All you need to do to hide a <div> is say in javascript: document.getElementById("div1").style = "visibility: hidden;");
and to show it, document.getElementById("div1").style = "visibility: visible;");
This sets a CSS style to the element that literally hides it.

That is what I hate about web design today. People have to overly complicate stuff by using fancy crap like JQuery. This can be solved with traditional JavaScript and CSS.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.