Jump to content

r4nd0m

Members
  • Posts

    1
  • Joined

  • Last visited

About r4nd0m

  • Birthday 04/04/1990

Profile Information

  • Location
    Wisconsin, USA

r4nd0m's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Hi! First time posting here, so ive been struggling with some javascript and was hoping someone could fix this for me. The problem I am having is I want it to create a link that looks something along these lines "www.example.com/ChicagoNorthSide.html" If the options selected were chicago and north side, I cannot have any symbols/numbers in the link as I am using weebly as the webhost and their page creation methods only allow me to create pages with plain text and require .html at the end. This code theoretically should work, but it isn't and I am getting % signs. Anyway if someone can help that would be appreciated! <!DOCTYPE html> <html> <head> <script type="text/javascript"> var locations = {}; locations["Locations"] = null; locations["Chicago"] = ["North side", "East Side", "South Side"]; locations["New York"] = ["Bronx", "East Side", "Queens"]; function clearOptions(list) { for (var i = list.options.length - 1; i >= 0; --i) { list.remove(i); } } function loadOptions() { console.log('Loading Locations'); document.getElementById('vicinityLabel').style.visibility = 'hidden'; document.getElementById('vicinity').style.visibility = 'hidden'; document.getElementById('submitButton').style.visibility = 'hidden'; var location = document.getElementById('location'); clearOptions(location); for (var i = 0; i < Object.keys(locations).length; ++i) { var option = document.createElement('option'); option.text = Object.keys(locations)[i]; option.value = i; option.disabled = i == 0; option.selected = i == 0; option.hidden = i == 0; location.add(option, null); } } function showVicinityOptions(location) { console.log('Loading Vicinities'); document.getElementById('submitButton').style.visibility = 'hidden'; var vicinity = document.getElementById('vicinity'); var key = Object.keys(locations)[location.options[location.selectedIndex].value]; var options = locations[key].slice(); options.splice(0, 0, "Vicinities"); clearOptions(vicinity); for (var i = 0; i < options.length; ++i) { var option = document.createElement('option'); option.text = options[i]; option.value = i; option.disabled = i == 0; option.selected = i == 0; option.hidden = i == 0; vicinity.add(option, null); } document.getElementById('vicinityLabel').style.visibility = 'visible'; vicinity.style.visibility = 'visible'; } function showSubmitButton(vicinity) { document.getElementById('submitButton').style.visibility = 'visible'; } function gotoPage() { console.log('Submitted'); var location = document.getElementById('location'); var vicinity = document.getElementById('vicinity'); var page = location.options[location.selectedIndex].text + vicinity.options[vicinity.selectedIndex].text; window.location.replace(page + '.html'); return false; } </script> </head> <body onLoad="loadOptions()"> <form id='locationForm' action="#" method="GET" onSubmit="return gotoPage()"> <label id='locationLabel' for="location">Choose a location:</label> <select id="location" onChange="showVicinityOptions(this)"> </select> <br /><br /> <label id='vicinityLabel' for="vicinity">Choose a vicinity:</label> <select id="vicinity" onChange="showSubmitButton(this)"> </select> <br /><br /> <input id="submitButton" type="submit" value="Submit" /> </form> </body> </html>
×
×
  • Create New...