PDA

View Full Version : nOOb Question

DMWFlea
08-26-2003, 12:33 PM
I have an option Box in my page that once change I would like it to load the correct page thats in the options value in to an iframe useing javascript can anybody tell me how to active this


Thanks

P.S My Code is Below



_script.js

var Hair =new Array(
new Array(1,"Ladies","hair_ladies.html"),
new Array(2,"Colouring","hair_colouring.html"),
new Array(3,"Highlights & Lowlights","hair_highlights.html"),
new Array(4,"Mens","hair_mens.html"),
new Array(5,"Treatments","hair_treatments.html"),
new Array(6,"Permanent Waving","hair_waveing.html"),
new Array(7,"Hair Straightening","hair_straight.html"),
new Array(8,"Hair Extenstions","hair_extensiotn.html")
);

function swapOptions(the_array_name)
{
var numbers_select = window.document.form.subservies;
var the_array = eval(the_array_name);
setOptionText(window.document.form.subservies,the_array);
}
function setOptionText(the_select, the_array)
{
the_select.length=the_array.length;
the_select.options[0].text = "Please Select One";
for (c=0; c < the_array.length; c++)
{
the_select.options[c].text = the_array[c][1];
alert(the_select.options[c].value = the_array[c][2]);
}
}
function loadiframe(the_value)
{
alert(the_value);
window.document.iframe.details.src = the_value;
}





price_list.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>
<script src="pricelst.js"></script>
<body>
<form name="form">
<select name="services" onChange="swapOptions(window.document.form.services.options[selectedIndex].text);">
<option selected>Select Service</option>
<option>Hair</option>
</select>
<select name="subservies" onChange="loadiframe(window.document.form.subservies.options[selectedIndex].value);">
<option selected>--------------</option>
</select>
</form>
<iframe name="details" id="details"></iframe>
</body>
</html>
gish
08-26-2003, 05:36 PM
ok, so this is you code.

Before I look at it, is there anything happening?
Any error message?...
What exactly do you need assistance on?
DMWFlea
08-27-2003, 05:08 AM
There are now error just that when i try to execute function loadiframe
nothing appears in the iframe
tobymiller
01-21-2004, 05:29 PM
See if this does the trick:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<script type="text/javascript">

// local variables
var oForm = null;
var oIframe = null;
var aHair = null;

function setOptionText(sOptionName, sOptionArray)
{
var aOptions = eval(sOptionArray);

oForm.elements[sOptionName].length = aOptions.length;
oForm.elements[sOptionName].options[0].text = 'Please Select One';
oForm.elements[sOptionName].options[0].value = '';

for (var i = 0; i < aOptions.length; i++)
{
oForm.elements[sOptionName].options[i].text = aOptions[i][0];
oForm.elements[sOptionName].options[i].value = aOptions[i][1];
}
}

function loadIframe(src)
{
oIframe.setAttribute('src', src);
}

function init()
{
// assign variables
oForm = document.forms['priceForm'];
oIframe = document.getElementById('details');
aHair = new Array
(
new Array("Ladies", "hair_ladies.html"),
new Array("Colouring", "hair_colouring.html"),
new Array("Highlights & Lowlights", "hair_highlights.html"),
new Array("Mens", "hair_mens.html"),
new Array("Treatments", "hair_treatments.html"),
new Array("Permanent Waving", "hair_waveing.html"),
new Array("Hair Straightening", "hair_straight.html"),
new Array("Hair Extenstions", "hair_extensiotn.html")
);
}

</script>
<body onload="javascript:init();">
<form name="priceForm">
<select name="services" onChange="javascript:setOptionText('subservices', this.options[selectedIndex].value);">
<option value="" selected>Select Service</option>
<option value="aHair">Hair</option>
</select>
<select name="subservices" onChange="loadIframe(this.options[selectedIndex].value);">
<option value="" selected>--------------</option>
</select>
</form>
<iframe id="details" src="blank.html"></iframe>
</body>
</html>