PHP: how can I share one drop-down menu with two separate form inputs (one textarea, one file upload)

Question

I currently have two html forms. They both POST to process.php: one posts text entered into a textarea, the other posts an uploaded file. The value of a hidden input called 'act' is either 'paste' or 'upload' respectively, and this is used by process.php to distinguish the two forms. The current code (below) works fine.

<!--Box to paste list of queries-->
<form enctype="multipart/form-data" action="process.php" method="POST" onSubmit="return showPleaseWait()">
    <?php //This hidden input value 'paste' is used by process.php to distinguish the two forms ?>
    <input type="hidden" name="act" value="paste"/>
    <b><font color="#1F88A7">Paste in a list (one query per line):<br/></b><br/>
    <textarea id="text" cols="15" rows="6" name="ID_list" style='background-color:#ffffff; border:solid 1px #1F88A7'></textarea>
    <input id="butt" name="sub" type="submit" value="Submit" /><br />
</form>

<br />

<!--Box to upload a file -->
<form enctype="multipart/form-data" action="process.php" method="POST" onSubmit="return showPleaseWait()">
    <?php //This hidden input value 'upload' is used by process.php to distinguish the two forms ?>
    <input type="hidden" name="act" value="upload"/>
    <b><font color="#1F88A7">Or upload (plain text, one query per line):</font> </b><br />
    <input id="butt" name="uploadedfile" type="file" style='background-color:#ffffff; border:solid 1px #1F88A7'/><input type="submit" value="Upload File" />
</form>

In process.php I have this:

if (isset($_POST['act'])){    
    if ($_POST['act'] == 'upload'){
        // ...process one way
        echo "file uploaded";
    }else if($_POST['act'] == 'paste'){
        // ...process another way
        echo "text uploaded";
    }
}

What I would like to do now is to add a single dropdown menu that will post with whichever of these two forms are submitted. I can paste the code below into both of the two forms, but then I have this dropdown menu displayed twice (once for each form). I would like to display this dropdown menu only once at the top of the page, and its value to be posted with whichever of the two forms ('paste' or 'upload') is submitted.

<form action="process.php" method="post">
    <b><font color="#1F88A7">Select your query type:</font> </b><br />
    <select name="ID_type">
    <option value=""></option>
    <option value="type1">type1</option>
    <option value="type2">type2</option>
    <option value="type3">type3</option>
    </option>
    </select>
</form>

The goal is to process different types of query differently by including if statements into process.php, such as:

if ($_POST['ID_type'] == 'type1'){}

The problem seems simple, and maybe I can't solve it because of my lack of familiarity with html (apologies if there is anything horrible in the html above), but I have not been able to find a solution. Many many thanks for any help.

Answer 1

If you don't want to get into any javascript workarounds with your existing two form structure, then you should have everything surrounded by just one form. Maybe both "act" and "query type" should be dropdowns at the top of the form. Then, depending on if act is set to paste or upload, you look at either the textarea or file input - as they will both be included if it is just one form.

There are ways to improve UX with this idea through javascript, for example to validate if the textarea contains data if act=paste or if there is a file in the file upload if act=upload before allowing the post, but you could also do this all server side if you don't want to get into JS.

Answer 2

You are making it more complex than it should be, unless you really have a reason for this I would just them in the same form if I were you. Then put logic in the PHP since they are both call the same process.php script.

<form enctype="multipart/form-data"
   action="process.php" method="POST" onSubmit="return showPleaseWait()">  
<b><font color="#1F88A7">Select your query type:</font> </b><br />
<select name="ID_type">
<option value=""></option>
<option value="type1">type1</option>
<option value="type2">type2</option>
<option value="type3">type3</option>
</option>
</select>
<!-- Paste -->
<b><font color="#1F88A7">Paste in a list (one query per line):</b><br/>
<textarea id="text" cols="15" rows="6" name="ID_list" 
      style='background-color:#ffffff; border:solid 1px #1F88A7'></textarea>
<!-- upload -->
<b><font color="#1F88A7">Or upload (plain text, one query per line):</font></b>

<input name="uploadedfile" type="file" 
       style='background-color:#ffffff; border:solid 1px #1F88A7'/>   
<input id="butt" name="sub" type="submit" value="Submit" /><br />
</form>

I wouldnt even use hiddenfield and stuff:

if (isset($_POST)){    
    if (is_uploaded_file($_FILES['yourfile']['uploadedfile'])){
        // ...process one way
        echo "file uploaded";
    }else if(isset($_POST['ID_list'])){
        // ...process another way
        echo "text uploaded";
    }

    if ($_POST['ID_type'] == 'type1'){
        //do whatever
    }
}

Now if you don't want the user to process both , then I will focus on redesigning my Interface to just allow one type of process( maybe using a radio button or something like that)