Member Avatar for AntonyRayan 
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>
 <?php
 $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 } ?>
 </select>

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
  • 4 Contributors
  • 4 Replies
  • 353 Views
  • 4 Months Discussion Span
  • Latest Post Latest Post by mblan180131
Member Avatar for mangel.murti

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.

<html>
<head><title>TEST</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
 <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>
 </select>
 <div class="1">This is PHP</div>
 <div class="2">This is JSP</div>
 <div class="3">This is ASP</div>
</body>
<script>
function show_hide(currentValue){
     $("div."+currentValue).toggle(currentValue);
}
</script>
</html>
Member Avatar for AntonyRayan

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

Member Avatar for Carsten_1

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

$(document).ready(function () {
    $('.group').hide();
    $('#multiple').show();
    $('#selectMe').change(function () {
        $('.group').hide();
        $('#'+$(this).val()).show();
    })
});
Member Avatar for mblan180131

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.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.