user3124641
user3124641

Reputation: 1

clicking on the select option how to show hidden field using javascript?

I am working on php how to show hidden field?

I have bp_scholarship_enq table in my database and this database i have occupation field i want to add new occupation in my database how i do it?

 <script>
    function showss(ids)
        {

            var  idss=ids;

            if(idss=="other")

            document.getElementById(idss).style.display='block';

        }   


</script>

<?php
echo "<select name='occupation' id='link_block' value='Source' style='width:196%'>
                      <option>select occupation </otpion>";
$sql = "SELECT * FROM bp_scholarship_enq";
$info = mysql_query($sql);

while ($row = mysql_fetch_array($info)) 
    echo "<option > '" . @$row["occupation"] . "'</option>";


echo '<option onClick="showss('.input_field.')">other</option>';
echo "</select>";
echo '<input type="hidden" name="other" id="input_field" />';
?>

Upvotes: 0

Views: 682

Answers (2)

Nouphal.M
Nouphal.M

Reputation: 6344

Hidden fields are not meant to be visible. You could use a textbox and set its visiblity to false in css and make visible it on changing the select option.

<input type="text" name="other" id="input_field" style="display:none"/>

    <select name='occupation' id='link_block' value='Source' style='width:196%' onChange="showText(this.selectedIndex);">
    ...............
    ...............
<option value="other">other</option>
    </select>

<script>
  function showtext(ind){
         var selectBox = document.getElementById('link_block');
         if(selectBox.options[ind].value=="other"){
                   document.getElementById('input_field').style.display = "block";
         }else{
                    document.getElementById('input_field').style.display = "none";
         }
  }
</script>

Upvotes: 1

ZombieBunnies
ZombieBunnies

Reputation: 268

Instead of

<input type="hidden" name="other" id="input_field" />

Make it:

<input id="otherOccupation" class="hide" name="other" id="input_field" />

With hide being a class that sets visibility:hidden;

Then have some jquery to remove that class when the user selects "other"

$("#otherOccupation").removeClass("hide")

Upvotes: 0

Related Questions