Lia Nungaray
asked on
Getting value from a selected box
I've done this before, but I have a complete mind block at the moment (maybe because it's Monday!) :-)
Here goes: I have a form which contains a select element. This select element only has two values:
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula r</option>
</select>
Here's the getType function:
function getType(selBox)
{
var pf_type = document.forms["pageflow_r pt_new"][" pf_type"];
var selectValue = pf_type.value;
alert(pf_type);
}
When I select an option from the select box, I get in the alert window the value [object]. What am I doing wrong?
Here goes: I have a form which contains a select element. This select element only has two values:
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula
</select>
Here's the getType function:
function getType(selBox)
{
var pf_type = document.forms["pageflow_r
var selectValue = pf_type.value;
alert(pf_type);
}
When I select an option from the select box, I get in the alert window the value [object]. What am I doing wrong?
var pf_type = selBox.options[selBox.sele ctedIndex] .value;
ASKER
Thanks!
By the way in your code, horalia, you're assigning to selectValue and not using it. Perhaps you meant to do `alert(selectValue)`?
Morcalavin's solution looks good, but (I think) alert(selectValue) will also fix your problem :)
Morcalavin's solution looks good, but (I think) alert(selectValue) will also fix your problem :)
ASKER
Morcalavin, the alert box does work, but when I try to read the selected value using another function, it still gives me [object]. Let me give you a bigger picture:
pageflow_rpt.php
<form name="pageflow_rpt_new">
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula r</option>
</select>
<input type="button" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type)">
tools.js
function getType(selBox)
{
var pf_type = selBox.options[selBox.sele ctedIndex] .value;
var selectValue = pf_type.value;
alert(pf_type);
}
function doAddPFRpt(button, command, selectValue)
{
alert(pf_type);
button.form.command.value = command;
if(pf_type='F') {
button.form.action="pagefl ow_rpt_frm .php";
} else {
button.form.action="pagefl ow_rpt_frm .php";
}
button.form.submit();
}
pageflow_rpt.php
<form name="pageflow_rpt_new">
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula
</select>
<input type="button" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type)">
tools.js
function getType(selBox)
{
var pf_type = selBox.options[selBox.sele
var selectValue = pf_type.value;
alert(pf_type);
}
function doAddPFRpt(button, command, selectValue)
{
alert(pf_type);
button.form.command.value = command;
if(pf_type='F') {
button.form.action="pagefl
} else {
button.form.action="pagefl
}
button.form.submit();
}
ASKER
As you can see, I want the action of the form be dependent on the selected value. If I select Fallon, I want to open pageflow_rpt_frm.php. If Regular is selected, I want to open pageflow_rpt_frm_F.php (I didn't indicate this in the last posting). Before going on to open the correct page, I want to verify that I am passing the correct value. If I echo pf_type from the function getType, the correct value is displayed. However, if I press the "Create Report" button, the value "[object]" is displayed.
horalia,
function getType(selBox)
{
alert(selBox.value);
}
function doAddPFRpt(button, command, selectValue)
{
button.form.command.value = command;
if (selectValue == 'F') { /* note this should be == and not = */
button.form.action="pagefl ow_rpt_frm .php";
} else {
button.form.action="pagefl ow_rpt_frm .php";
}
return true;
}
And
<input type="submit" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type.value)">
function getType(selBox)
{
alert(selBox.value);
}
function doAddPFRpt(button, command, selectValue)
{
button.form.command.value = command;
if (selectValue == 'F') { /* note this should be == and not = */
button.form.action="pagefl
} else {
button.form.action="pagefl
}
return true;
}
And
<input type="submit" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type.value)">
ASKER
I placed everything exactly how I have it in one page only. Here it goes in case you would like to test:
<html>
<head>
<script type="text/javascript">
function getType(selBox)
{
var pf_type = selBox.options[selBox.sele ctedIndex] .value;
var selectValue = pf_type.value;
alert(pf_type);
}
function doAddPFRpt(button, command, pf_type) {
alert(pf_type);
/*
button.form.command.value = command;
if(pf_type='F') {
button.form.action="pagefl ow_rpt_frm _F.php";
} else {
button.form.action="pagefl ow_rpt_frm .php";
}
button.form.submit();
*/
}
</script>
</head>
<form name="pageflow_rpt_new">
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula r</option>
</select>
<input type="button" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type)">
</form>
</html>
I was thinking of using a hidden value in the form, but I don't know how to assign it using JavaScript.
<html>
<head>
<script type="text/javascript">
function getType(selBox)
{
var pf_type = selBox.options[selBox.sele
var selectValue = pf_type.value;
alert(pf_type);
}
function doAddPFRpt(button, command, pf_type) {
alert(pf_type);
/*
button.form.command.value = command;
if(pf_type='F') {
button.form.action="pagefl
} else {
button.form.action="pagefl
}
button.form.submit();
*/
}
</script>
</head>
<form name="pageflow_rpt_new">
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
<option value="F">Fallon</option>
<option value="R" selected="selected">Regula
</select>
<input type="button" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type)">
</form>
</html>
I was thinking of using a hidden value in the form, but I don't know how to assign it using JavaScript.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Oh, you made me feel like such a rookie....... :-)
Let me try to incorporate your code into what I already have.
Let me try to incorporate your code into what I already have.