Jump to content

Make new form element appear based on action of another form element


pakenney38

Recommended Posts

I know this is probably some AJAX based thing I want to do, but I want to make a second form element appear on a page based on the action of a first form element. The second element may or may not contain dynamic content.

 

For example: I click on a radio button and a drop-down list appears filled with names that have been populated from a MySQL table.

Does anyone have any good documentation or examples they could point me towards on how to do this?

Link to comment
Share on other sites

what about this (im not doing the whole thing for you but this will help alot)

<html>
<input type="radio" name="yes" onchange="
if(this.value=='yes'){
document.getElementById('dropDown').style.display='';
}else{
document.getElementById('dropDown').style.display=none'';
}">

<div id="dropDown" style='display:none;'>
What ever you want to show up here...
</div>
</html>

Link to comment
Share on other sites

It is simple javascript, like ccrevcypsys suggested, if the second element is not dynamic. All you have to do is make it visible. Here is a simple drop down box that will show a new dropdown box once a user has selected something.

<select name="s1" onChange="s2.style.visibility='visible'">
<option name="NULL">Select a value</option>
<option name="1">1</option>
</select>
<br>
<select name="s2" STYLE="visibility:hidden">
<option name="NULL">Select a value</option>
<option name="1">1</option>
</select>

 

However, if you want the second box to have content that is dynamically generated, you will need a separate php file. To do this without changing the location of the page, you can use an iframe that is exactly the size of the form element in it. It will look like it is on the current page, but it is actually a different one. Then, using the same kind of javascript, instead of making it visible, you change the location of the page to a php file that takes the input of the first element and generates the content from it.

Good luck!

Link to comment
Share on other sites

Looking now at what this does, it's cool, but not useful. It needs to be able to produce a different menu depending on the option chosen of the first menu. It also needs to make the second menu go away if the first menu option has no corresponding selections to make in a second menu.

Link to comment
Share on other sites

This is an example of a text box that drops down autocompletion suggestions based on typed text....  You could probably mod it if you're decent with HTML/JS to use radio buttons and then make a select box or something.

 

http://members.aol.com/barryaandrew/xmlhttp/article.html

(from Barand's sig)

 

Also, you can probably just google around, learn some about AJAX, find or write some JS to edit the HTML stuff, and then go for it.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.