• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 419
  • Last Modified:

Pass selected dropdown menu option to CGI program


I have the following dropdown menu and numerous other input fields (regular and hidden). I am trying to figure out how to pass all the values in this form to the page that is selected from this dropdown (see code below). Currently, when an option is selected, the link to the selected page works, however, no parms get passed.

The receiving program is a CGI program. I have done this elsewhere on the page with a simple text link by calling a Javascript program and passing the value from a table row to a function call in the header.

But how do you pass the value from a dropdown such as this one?

<FORM name="SPSFS02" ACTION="./SPSFS02" METHOD="POST">

<TABLE BORDER=0 CELLPADDING=2 CELLSPACING=0 VSPACE="0" HSPACE="0" WIDTH="100%">
<tr>
 <td width="40%"><b><font size=3>Shipping Fulfillment Schedule</font></b></td>
 <td width="40%"><b><font size=3>Gypsum Board - United States<font size=3></b></td>
 <td width="20%" border=1>
    <select name="DDmenu" onChange="location=this.options[this.selectedIndex].value;">
    <option selected>Site Navigation</option>
    <option value="./SPSFS02">Region
    <option value="./SPSFS01">Plant
    <option value="./SPSFS03">SalesRep
    </select>
 </td>
</tr>
</table>
0
BPBEE
Asked:
BPBEE
  • 3
  • 2
1 Solution
 
BPBEEAuthor Commented:
Here are examples of my existing Javascript function calls:

<script language="JavaScript">
function callapgm() {
document.SPSFS02.action = '/BPBCON/SPSFS02';
document.SPSFS02.method = "POST";
document.SPSFS02.submit();
return false;
}
function callbpgm(region,plant,fdate,tdate) {
document.SPSFS02.DXREGION.value  = region;
document.SPSFS02.DXPLANT.value  = plant;
document.SPSFS02.DXFDATE.value  = fdate;
document.SPSFS02.DXTDATE.value  = tdate;
document.SPSFS02.action = '/BPBCON/SPSFS07';
document.SPSFS02.method = "POST";
document.SPSFS02.submit();
return false;
}
function gotoURL(URL) {
document.SPSFS02.action = URL;
document.SPSFS02.method = "POST";
document.SPSFS02.submit();
return false;
}
</script>
.....
.....

<tr>
<td><a href="/BPBCON/SPSFS07" onClick="return callbpgm('P00','CG','2004-09-07-00.00.00.000000','2004-09-07-00.00.00.000000')">Northeast</td>
<td width="12%" border=1>CODY PLANT                              </td>
<td width="11%" border=1>Truckloads</td>
<td width="11%" border=1>Prepaid</td>
<td width="11%" border=1>09/07/2004</td>
<td width="11%" border=1>.00</td>
<td width="11%" border=1>0</td>
<td width="11%" border=1>0</td>
<td width="11%" border=1></td>
</tr>
.....
.....

<input type="hidden" name="DXREGION" value= " "></INPUT>
<input type="hidden" name="DXPLANT" value= " "></INPUT>
<input type="hidden" name="DXFDATE" value= " "></INPUT>
<input type="hidden" name="DXTDATE" value= " "></INPUT>
<input type="hidden" name="BPBUSER" value= "james"></input>
0
 
ziffgoneCommented:
Might have to pass through URL:

<TABLE BORDER=0 CELLPADDING=2 CELLSPACING=0 VSPACE="0" HSPACE="0" WIDTH="100%">
<tr>
 <td width="40%"><b><font size=3>Shipping Fulfillment Schedule</font></b></td>
 <td width="40%"><b><font size=3>Gypsum Board - United States<font size=3></b></td>
 <td width="20%" border=1>
    <select name="DDmenu" onChange="chgLoc(this.options[this.selectedIndex].value);">
    <option selected>Site Navigation</option>
    <option value="./SPSFS02">Region
    <option value="./SPSFS01">Plant
    <option value="./SPSFS03">SalesRep
    </select>
 </td>
</tr>
</table>
 

Then assign a bunch of variables with the values you wish to pass:

JAVASCRIPT CODE:

function chgLoc(page){
        var val1 = document.form_name.field1.value;
        var val2 = document.form_name.field2.value;
        var val3 = document.form_name.field3.value;
        // etc for each value you want to pass to the next page

        // now time to go to the page:

       window.location = page+"?val1="+val1+"&val2="+val2+"&val3="+val3;
}

Then, in the receiving page (CGI I'm assuming):

CGI/PERL CODE:
use strict;
use CGI;

my($val1,$val2,$val3,$val4);
$val1 = "";
$val
if(param('val1')){
     $val1 = param('val1');
}
if(param('val2')){
     $val2 = param('val2');
}
if(param('val3')){
     $val3 = param('val3');
}
etc...

then:
HTML CODE:
print '<input type="text" name="val1" value="'.$val1.'">';

or

print <<ENDHTML;

<select>
       <option value="$val">$val</option>
</select>
ENDHTML
etc.

You'll have to edit things to suit your needs.

Hope that helps.

Regards...
0
 
ziffgoneCommented:
Sorry, error in code:

This,
my($val1,$val2,$val3,$val4);
$val1 = "";
$val
if(param('val1')){
~

Should've been this:
my($val1,$val2,$val3,$val4);
$val1 = "";
$val2 = "";
$val3 = "";
etc.

if(param('val1')){
~

Regards...
0
Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
mishagaleCommented:
try replacing your onChange code with "document.SPSFS02.action=this.options[this.selectedIndex].value;"

0
 
mishagaleCommented:
sorry, amend that to:
"document.SPSFS02.action=this.options[this.selectedIndex].value; document.SPSFS02.submit();"
0
 
mishagaleCommented:
LearnedOne: I think that ziff's was probably the better solution, taking into account the existing code from the questioner. I suggest awarding the points to ziffgone.
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now