display other text field when user selects other option in selection field

[HTML]<html>
///

here what shoud be java script for:
->when script run then not display all input text field only display selection field.
->when user select other value for institute only this field display not display degree text field
->when user select other value in the selection field for degree then text field display and wise versa
////
<bodly>
<table>
<tr>
<td>select Institute:</td>
<td>
<select name='inst' id='inst'>
<option value='select'>select</option>
<option value='a'>a</option>
<option value='b'>b</option>
<option value='other'>other</option>
</select>
<input type='text' name='odeg' id='odeg'>
</td>
</tr>
<tr>
<td>select Degree:</td>
<td>
<select name='deg' id='deg'>
<option value='select'>select</option>
<option value='x'>x</option>
<option value='y'>y</option>
<option value='other'>other</option>
</select>
<input type='text' name='odeg' id='odeg'>
</td>
</tr>
</table>
</body>
</html>[/HTML]

////////////////
pls care fully seee my problem and solve. i will be higly oblige to all of u forum users.

Thanks and Regards
dkyadav80

Jul 14 '08 #1

Subscribe Post Reply

7346

hsriat

1,654

Expert 1GB

There's not a one-line solution to your need. I would say you actually need to have a look at few tutorials first. Then you can come back again if you find any difficulty.

Here are the links which may help you.
HTML Dom Style Object
CSS

Check out the display property in both the links.
And there's nothing to do with AJAX in your case, unless you have to fetch the list of the drop downs from the server after clicking on the first select element.

Jul 14 '08 #2

dkyadav80

Hi,
this is my javascript code:
//////////////////

Expand|Select|Wrap|Line Numbers

 function display(obj,id1)

{

    txt = obj.options[obj.selectedIndex].value;

    document.getElementById(id1).style.display = 'none';

    if ( txt.match(id1) ) 

    {

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

    }
 
}

/////////////////////
And This is my original code of html:
//////////////////////////////////////////////////////////
{$script}
[HTML]<script>setTimeout("document.getElementById('statu s_message').innerHTML=' '",2000)</script>

<div align="center">
<fieldset class="formborder"><legend style=" color:#777;">Add Education Details</legend>
<div class="status_message" id="status_message"> {$smarty.session.status_ message}</div>

<table border="0">
<form id="add_education_details" name="add_education_details" method="post" action="index.php?page=Education&action=Create">
<tr>
<td colspan="2" align="left"><div class="heading">Education Details</div><br>
</td>
</tr>
<tr>
<td align="right">
<label for="cons_indi_edu_deg">Degree/Diploma
<span class="req">*</span></label>
</td>
<td align="left">
<select name="cons_indi_edu_deg" id="cons_indi_edu_deg" style="width:180px" class="text medium" onChange="return displayt(this,'other')">
<option value="select">select</option>
<option value="Not Pursuing Graduation" >Not Pursuing Graduation</option>
<option value="B.A" >B.A</option>
<option value="B.Arch" >B.Arch</option>
<option value="BCA" >BCA</option>
<option value="B.B.A" >B.B.A</option>
<option value="B.Com">B.Com</option>
<option value="B.Ed" >B.Ed</option>
<option value="BDS" >BDS</option>
<option value="BHM" >BHM</option>
<option value="B.Pharma" >B.Pharma</option>
<option value="B.Sc" >B.Sc</option>
<option value="B.Tech" >B.Tech/B.E.</option>
<option value="LLB" >LLB</option>
<option value="MBBS" >MBBS</option>
<option value="Diploma" >Diploma</option>
<option value="BVSC" >BVSC</option>
<option value="CA" >CA</option>
<option value="CS" >CS</option>
<option value="ICWA" >ICWA</option>
<option value="Integrated PG" >Integrated PG</option>
<option value="LLM" >LLM</option>
<option value="M.A" >M.A</option>
<option value="M.Arch" >M.Arch</option>
<option value="M.Com" >M.Com</option>
<option value="M.Ed" >M.Ed</option>
<option value="M.Pharma" >M.Pharma</option>
<option value="M.Sc" >M.Sc</option>
<option value="M.Tech" >M.Tech</option>
<option value="MBA/PGDM" >MBA/PGDM</option>
<option value="MCA" >MCA</option>
<option value="MS" >MS</option>
<option value="PG Diploma" >PG Diploma</option>
<option value="MVSC" >MVSC</option>
<option value="MCM" >MCM</option>
<option value="other" >other</option>
</select><span>
<label>
<input name="cons_indi_edu_odeg" id="other" type="text" style="display: none;width:180px" maxlength="25" class="text medium" />
</label></span>
</td>
</tr>
<br /><br />
<tr>
<td align="right">
<label for="cons_indi_edu_inst">Name of Institute
<span class="req">*</span></label>
</td>
<td align="left">
<select name="cons_indi_edu_inst" id="cons_indi_edu_inst" style="width:180px" class="text medium" onChange="return display(this,'other')">
<option value="select" >select</option>
<option value="inst1" >intst1</option>
<option value="inst2" >inst2</option>
<option value="inst3" >inst3</option>
<option value="inst4" >inst4</option>
<option value="inst5" >inst5</option>
<option value="other" >other</option>
</select><span>
<label>
<input name="cons_indi_edu_oinst" id="other" type="text" style="display: none;width:180px" maxlength="50" class="text medium"/>
</label></span>
</td>
</tr>
<tr>
<td align="right">
<label for="cons_indi_edu_exprtise">Specialisation
<span class="req">*</span></label>
</td>
<td align="left">
<input name="cons_indi_edu_exprtise" id="cons_indi_edu_exprtise" type="text" class="text medium" maxlength="100" style="width:170px" validation="urt_m" />
</td>
</tr>
<tr>
<td align="right">
<label for="month">Year of Graduation
<span class="req">*</span></label>
</td>
<td align="left">
<select name="month" id="month" style="width:75px;">
<option value="Month">Month</option>
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="Mar">Mar</option>
<option value="Apr">Apr</option>
<option value="May">May</option>
<option value="Jun">Jun</option>
<option value="Jul">Jul</option>
<option value="Aug">Aug</option>
<option value="Sep">Sep</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
</select>
<select name="year" id="year" style="width:100px">
<option value="Year">Year</option>
{html_options values=$years output=$years}
</select>
</td>
</tr>

<tr>
<td colspan="2">  </td>
</tr>
<tr align="center">
<td>  </td>
<td align="center">
<div class="buttons">
<button type="button" id="saveAndAdd" name="saveAndAdd" class="positive" onClick="if(validateForm(this.form)) submitForm(this.form, 'index.php?page=Education&action=CreateMore')">
<img src="images/icons/tick.png" alt="icon" /> Save & Add More </button>

<button type="button" id="saveAndClose" name="saveAndClose" class="positive" onClick="if(validateForm(this.form)) this.form.submit();">
<img src="images/icons/tick.png" alt="icon" /> Save & Close </button>

<a href="javascript: void(0);" onclick="javascript: return parent.hs.close();" class="negative">
<img src="images/icons/cross.png" alt="icon" /> Close</a>
</div>
</td>
</tr>
</form>
</table>
</fieldset>
</div>
[/HTML]///////////////////////////////////////

if have any solution pls help me.

Thanks and regards
dkyadav80

Jul 14 '08 #3

dkyadav80

Hi,

pls help me;

i wanna when forst time script run then all other text field should not be display and when select other then other text field display. i have written code this code when i
select first select other from first selection field this is displaying all other field but this is wrong. when i select one then one other field display and when slect ohter text field then display other text field. and when select other value rest of 'other' then other text field should be hide. below is my code:

Hi,
this is my javascript code:
//////////////////

Expand|Select|Wrap|Line Numbers

 function display(obj,id1)

{

    txt = obj.options[obj.selectedIndex].value;

    document.getElementById(id1).style.display = 'none';

    if ( txt.match(id1) ) 

    {

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

    }
 
}

Jul 14 '08 #4

acoder

16,027

Expert Mod 8TB

I've merged your threads. Please do not double/triple post your questions. Keep all posts relating to the same question to one thread.

Also, use code tags when posting code. See How to Ask a Question.

Jul 14 '08 #5

dkyadav80

hi sir,
I'm begener.Please help me.

[code] code goes here [code]

[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Show/Hide</title>
<script type="text/javascript">
/*
function display(obj,id1)
{
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
if ( txt.match(id1) )
{
document.getElementById(id1).style.display = 'block';
}

}*/

function showhide(id)
{
if (document.getElementById)
{
obj = document.getElementById(id);
if (obj.style.display == "none")
{
obj.style.display = "block";
}
else
{
obj.style.display = "none";
}
}
}

</script>
</head>

<body>
<table border="0" bordercolor="">
<tr>
<td>
<select name="type" id="select2" onChange="return showhide('d');">
<option>P:</option>
<option value1="others1">others1</option>
<option value2="others2">others2</option>
<option value3="other">other</option>
</select></td><span>
<td>
<input type="text" id="d" style="display: none; width:150px" name="color" size="12" maxlength="7" /></td>
</span>
</tr>
<tr>
<td>
<select name="type" id="select2" onchange="return showhide('p');">
<option>P:</option>
<option value1="others1">others1</option>
<option value2="others2">others2</option>
<option value3="other">other</option>
</select></td>
<td><input type="text" id="p" style="display: none; width:150px" name="color" size="12" maxlength="7" /></td>
</tr>
<tr>
<td>
<select name="type" id="select3" onchange="return showhide('k');">
<option>P:</option>
<option value1="others1">others1</option>
<option value2="others2">others2</option>
<option value3="other">other</option>
</select></td>
<td>
<input type="text" id="k" style="display: none; width:150px" name="color" size="12" maxlength="7" /></td>
</tr>
</table>

</body>
</html>[/HTML]

////////
problem here:

I wanna select the other value from selection field then display other text box field otherwise hide this text box. please help my problem . i'm thrusty about this problem.

Jul 15 '08 #6

acoder

16,027

Expert Mod 8TB

I've merged your thread yet again. Please do NOT double post. This will be the last time before you receive an official warning.

The code tags should be wrapped around your code with a closing tag. Replace "...code goes here..." with the actual code.

Moderator.

Jul 15 '08 #7

acoder

16,027

Expert Mod 8TB

I wanna select the other value from selection field then display other text box field otherwise hide this text box. please help my problem .

You need to change the showhide function to check the value selected. If it equals "Other", then show, otherwise hide.

Expand|Select|Wrap|Line Numbers

 function showhide(val,id)

{

  if (document.getElementById)

  {

    obj = document.getElementById(id);

    if (val == "Other")

    {

      obj.style.display = "block";

    }

    else

    {

      obj.style.display = "none";

    }

  }

}

You'll need to pass the value to the function.
Also, change the option value1,2,3 to just value for each option.

Jul 15 '08 #8

dkyadav80

Hi sir,
I have two field in the html page.
first Degree(selection field) and second is Institute(selection field).
I wanna when user select value "other" from degree or Institute selection field
then other text field should be display otherwise hide.
Please solve my problem.

Thank you.

Jul 19 '08 #9

dmjpro

2,476

2GB

Hi sir,
I have two field in the html page.
first Degree(selection field) and second is Institute(selection field).
I wanna when user select value "other" from degree or Institute selection field
then other text field should be display otherwise hide.
Please solve my problem.

Thank you.

Did you try something?

Jul 19 '08 #10

acoder

16,027

Expert Mod 8TB

Try something? Yes, and posted multiple threads on the same question/problem despite requests not to. I've now merged the threads (yet again I might add). If you (dkyadav80) continue to flout the guidelines, then you could face a ban. By becoming a member and posting here, you agree to follow the guidelines. Read the guidelines properly and follow them if you want avoid a temporary ban.

Moderator.

Jul 19 '08 #11

by: John Davis | last post by:

I want to display credit card fields when the user selects the option paid membership. If user selects the option free membership, then the credit card text field will disappear. Here's the code I...

ASP / Active Server Pages

global var doesn't capture text on mouseup

by: lkrubner | last post by:

I've got a function, you can see it below, that is being called onmouseup in the textarea on my main form. The idea is to find a selection if possible and store that text in a global variable. I...

Javascript

Equivalent to display:none for <option> in IE?

by: Iain Hallam | last post by:

Hi. I've been using display:none on the style property of some <option> elements in my forms, which works fine with Mozilla - as expected it removes the option from my dropdown (although it...

Javascript

Using combo-box as a user filter - trying to use format to display text "all" for null values

by: google | last post by:

This is something I've done plenty of times in '97, but I can't seem to get it to work correctly in Access 2003. Say, for example, I have a form with an unbound combobox, the data source is a...

Microsoft Access / VBA

Sorting Delimited Text in a Text Box

by: Tim Marshall | last post by:

Access 2003. The situation is this: I have a "criteria selection form" in which there are a many different criteria, mostly displayed as combo and text boxes in which a user can enter stuff,...

Microsoft Access / VBA

Storing dynamic form values in Arrays for display & insert

by: assgar | last post by:

Hi Developemnt on win2003 server. Final server will be linux Apache,Mysql and PHP is being used. I use 2 scripts(form and process). The form displays multiple dynamic rows with chechboxs,...

PHP

How to display text files from a database

by: WebNewbie | last post by:

Hi, please help I've been wrestling with this for a very long time and its not working. I'm trying to display text files from a database when someone selects one or more list items of my listbox. The...

.NET Framework

corresponding db value in the text input box for the value in selection menu

by: omerbutt | last post by:

hi there i have a tbl in db which has following fields table name:stock id_no(primary key...autono) part_name(text) price(currency) now i have an asp and htmlbased form in which i have made a...

ASP / Active Server Pages

Display description in dropdown list but store another value in variable

by: rmurgia | last post by:

Is there a way to set up a dropdown list and have the description field be displayed as a selection for the user and also be displayed in the input field after the user selects it, but have the value...

ASP / Active Server Pages

Cloud Servers without Credit Card and Email Registration: A Simpler Way to Get on the Cloud

by: CloudSolutions | last post by:

Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...

General

One-click Importing Excel Data into a*Database

by: ryjfgjl | last post by:

In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...

Microsoft Excel

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

display other text field when user selects other option in selection field

Similar topics