Entry

How to download a user specified file based on multiple select boxes with multiple options in each, and a submit button?

Dec 21st, 2002 23:33
Jean-Bernard Valentaten, Auzi Guy,

I'm really surprised no one has answered this one before.
Ok, it's a little tricky, but here's the idea:
Let's suppose we have three select boxes, one for the target directory, 
one for the target file and one for the target file suffix.
In the onClick-handler of the substitute submit-button we concatenate 
the selected options of the select boxes (and maybe default if one or 
more boxes have no selected options). The string we receive is 
concatenated with the servername (which should be written in the action-
attribute of the form) and then send a GET request towards the target 
(did I mention that the method-attribute of the form needs to be set to 
method="GET").
Alltogether this might look like this:
<form name="myForm" action="http://www.myServer.tld" method="GET">
  <select name="mySelect1">...</select><br>
  <select name="mySelect2">...</select><br>
  <select name="mySelect3">...</select><br>
  <input type="button" value="Submit" onClick="buildRequest();">
</form>
<script language="JavaScript">
<!--
  function buildRequest()
  {
    //the vars we need
    var sel1, sel2, sel3;
    var target = "/";
    with (document.myForm)
    {
      //defaulting first
      if (mySelect1.selectedIndex == -1)
        mySelect1.selectedIndex = 0;
      if (mySelect2.selectedIndex == -1)
        mySelect2.selectedIndex = 0;
      if (mySelect3.selectedIndex == -1)
        mySelect3.selectedIndex = 0;
      //then we get the selected indexes
      sel1 = mySelect1.selectedIndex;
      sel2 = mySelect2.selectedIndex;
      sel3 = mySelect3.selectedIndex;
      //now we concatenate
      target += mySelect1.options[sel1].value;
      target += mySelect2.options[sel2].value;
      target += mySelect3.options[sel3].value;
      //generate the target (action)
      action += target;
      //and off we go getting that file
      submit();
    }
  }
//-->
</script>
This will work in a lot of cases, but it has it's restrictions. If the 
file requested is one that can be displayed by the browser on the 
client system (usually images, text-files and pdf-files) it will be 
displayed rather than saved to a specified directory. The usaer will 
then have to save it manually using the browsers or the plugins "Save" 
functinality (e.g. "File/Save As..."). To my knowledge ther is no way 
to make the browser save the file upon download.
HTH,
Jean