Conditional Form Help Needed

Dev Shed Forums Sponsor:

February 15th, 2013, 06:12 AM

woLkhan

Registered User

Join Date: Feb 2013

Posts: 6

Time spent in forums: 3 h 32 m 34 sec
Reputation Power: 0

New Member - Conditional Form Help Needed

Hi

I need a conditional form like this-->

<!DOCTYPE html>
<html>
<head>
<title>Store Locator</title>
<style>
body {
margin: 20px;
font: 12pt Constantia, Garamond, serif;
}

select {
min-width: 200px;
}

#address {
font-size: 16pt;
}

#map object {
width: 600px;
height: 400px;
border: 1px solid #000;
}
</style>
<script>
var stores = {
DC: [
"District of Columbia",
["The White House", "1600 Pennsylvania Avenue NW, Washington, DC 20500"]
],
OK: [
"Oklahoma"
],
NY: [
"New York",
["Original Soup Man", "259 West 55th Street, New York, NY 10019"],
["Tom's Restaurant", "2880 Broadway, New York, NY 10025"]
]
};

window.onload = function() {
var el_state = document.getElementById("state");
var el_store = document.getElementById("store");
var el_address = document.getElementById("address");
var el_map = document.getElementById("map");

for (var i in stores) {
el_state.options[el_state.options.length] = new Option(stores[i][0], i);
}

el_state.onchange = function() {
el_store.options.length = 0;
var len = stores[this.value].length;
for (var i = 1; i < len; i++) {
el_store.options[el_store.options.length] = new Option(stores[this.value][i][0], stores[this.value][i][1]);
}
}

el_store.onchange = function() {
el_address.innerHTML = "<b>" + this.options[this.selectedIndex].text + "</b><br />" + this.value;
while (el_map.hasChildNodes()) {
el_map.removeChild(el_map.firstChild);
}
var obj = document.createElement("object");

}
}
</script>
</head>

<body>
<h3>Choose a store:</h3>
<select id="state" size="10"></select>
<select id="store" size="10"></select>
<p id="address"></p>
<div id="map"></div>
</body>
</html>

But i need more options. For example;

-Continent
-Country
-State
-Store ... etc.

Can anyone help me?

February 18th, 2013, 01:06 AM

woLkhan

Registered User

Join Date: Feb 2013

Posts: 6

Time spent in forums: 3 h 32 m 34 sec
Reputation Power: 0

Can anyone help?

February 18th, 2013, 09:21 AM

Triple_Nothing

Contributing User

Join Date: Jun 2009

Posts: 297

Time spent in forums: 3 Days 8 h 45 m 39 sec
Reputation Power: 5

What do you mean by "conditional" form?

February 18th, 2013, 10:06 AM

woLkhan

Registered User

Join Date: Feb 2013

Posts: 6

Time spent in forums: 3 h 32 m 34 sec
Reputation Power: 0

Quote:

Originally Posted by Triple_Nothing

What do you mean by "conditional" form?

There must be new and different options. For example if you click asia new options must be China, Japan, Mongolia etc...

If you click Europe, new options must be England, Spain, France, Germany etc... And if you click Spain, new options must be Madrid, Barcelona, Sevilla etc.

When you click the last option there must be a write like "You choosed Europe, Spain, Sevilla City."

I need something like this

February 18th, 2013, 10:31 AM

aeternus

For POny!

Join Date: Apr 2012

Location: Amsterdam

Posts: 416

Time spent in forums: 5 Days 4 h 56 m 43 sec
Reputation Power: 114

This is not a html question this is either a javascript or php question.

have a look here its just a sample of a conditional form with the use of jquery

__________________
PHP Tutorial

February 18th, 2013, 02:10 PM

Kravvitz

CSS & JS/DOM Adept

Dev Shed God 30th Plane (19500 - 19999 posts)

Join Date: Jul 2004

Location: USA

Posts: 19,835

Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192

Welcome to DevShed Forums, woLkhan.

You need JavaScript to do that. I recommend you check these out:
http://www.bobbyvandersluis.com/art...dynamic_select/
Chain select (javascript)
accessible dependent dropdowns
Dynamic Dropdown Boxes

P.S. When posting code, please place it between [code][/code] tags.
If you want to use the button to add the tags, paste the code in the textarea and then select it before clicking the button (so you don't get the problematic JavaScript prompt dialog).

*** Thread Moved ***

__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).

February 19th, 2013, 04:09 AM

woLkhan

Registered User

Join Date: Feb 2013

Posts: 6

Time spent in forums: 3 h 32 m 34 sec
Reputation Power: 0

Thanks for recommends but i have never worked with JavaScript.
Thats why i tried to work with html. I thought i can do it with html

Thanks for help

February 19th, 2013, 12:31 PM

Kravvitz

CSS & JS/DOM Adept

Join Date: Jul 2004

Location: USA

Posts: 19,835

Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192

HTML is static. All it can do is display information and provide links (and forms) to allow users to get to more pages. If you want to add features that do more to respond to user input you need (client-side) JavaScript and/or a server-side language (like PHP).

Out of curiosity, if you don't want to use JavaScript (JS) why did you post an example of a JS script?

New Member - Conditional Form Help Needed

Developer Shed Advertisers and Affiliates