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">Regular</option>
</select>

Here's the getType function:
function getType(selBox)
{
        var pf_type = document.forms["pageflow_rpt_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?
horaliaAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
aescntConnect With a Mentor Commented:
omg what are you doing thats so not right :)
Here you go. Remove the /* comment marks */ if you want to.
Mine shows an alert box of "F" or "R" on both onChange and onSubmit. (I also took the liberty of changing onClick to onSubmit, so it works when the user presses enter instead of clicking..)

<html>
<head>

<script type="text/javascript">
function getType(selBox)
{
    alert(selBox.value);
}
function doAddPFRpt(form, cmd, selectValue)
{
     document.getElementById('command').value = cmd;
     alert(selectValue);

    /* The following is commented just as yours was */
    /* if (selectValue == 'F') {
         form.action="pageflow_rpt_frm.php";
    } else {
            form.action="pageflow_rpt_frm.php";
    }
    return true; */
}</script>
</head>
<body>
<form name="pageflow_rpt_new" onsubmit="doAddPFRpt(this, 'add_rpt', pf_type.value)">
Command: <input type="text" id="command" name="command"><br>
<select size="1" name="pf_type" id="pf_type" onChange="getType(this)">
     <option value="F">Fallon</option>
     <option value="R" selected="selected">Regular</option>
</select>
<input type="submit" value="Create Report">
</form>
</body>
</html>
0
 
MorcalavinCommented:
var pf_type = selBox.options[selBox.selectedIndex].value;
0
 
horaliaAuthor Commented:
Thanks!
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
aescntCommented:
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 :)
0
 
horaliaAuthor Commented:
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">Regular</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.selectedIndex].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="pageflow_rpt_frm.php";
      } else {
              button.form.action="pageflow_rpt_frm.php";
      }
      button.form.submit();
}
0
 
horaliaAuthor Commented:
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.
0
 
aescntCommented:
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="pageflow_rpt_frm.php";
    } else {
            button.form.action="pageflow_rpt_frm.php";
    }
    return true;
}

And
<input type="submit" value="Create Report" onclick="doAddPFRpt(this, 'add_rpt', pf_type.value)">
0
 
horaliaAuthor Commented:
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.selectedIndex].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="pageflow_rpt_frm_F.php";
      } else {
              button.form.action="pageflow_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">Regular</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.
0
 
horaliaAuthor Commented:
Oh, you made me feel like such a rookie....... :-)
Let me try to incorporate your code into what I already have.
0
All Courses

From novice to tech pro — start learning today.