HDFilmMaker2112 Posted July 15, 2011 Share Posted July 15, 2011 How would I go about populating a second drop down menu based on the value selected in the first drop down menu. I was thinking AJAX, but this seems impossible as you would have to make the second drop down menu a separate file, and thus how would it submit with the HTML Form? Quote Link to comment Share on other sites More sharing options...
trq Posted July 15, 2011 Share Posted July 15, 2011 Ajax is indeed a solution, I'm not sure what you mean by it being a second file though. Once the first selection has been selected you make an Ajax request back to the server sending it what was selected. The server should then respond with some json that contained the data required for the second selection. You may not need to use Ajax however if you already know what data your going to conditionally use to populate the second drop down with. Either way, your question has little to do with PHP. Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 15, 2011 Author Share Posted July 15, 2011 Ajax is indeed a solution, I'm not sure what you mean by it being a second file though. Once the first selection has been selected you make an Ajax request back to the server sending it what was selected. The server should then respond with some json that contained the data required for the second selection. You may not need to use Ajax however if you already know what data your going to conditionally use to populate the second drop down with. Either way, your question has little to do with PHP. The only way I know to use AJAX is to place what is being called into a second file... The second drop down menu would be placed into a separate file with the MySQL query. So therefore this code: while($row_credits=mysql_fetch_array($result_credit)){ extract($row_credits); $content.='<option value="'.ucfirst($credit).'">'.ucfirst($credit).'</option>'."\n"; } Would be in a second file along with the SQL query. And a div block would be placed in the first page where the second drop down menu would go. How would the second drop down menu submit with the form if it's done this way. Quote Link to comment Share on other sites More sharing options...
trq Posted July 15, 2011 Share Posted July 15, 2011 Ajax is used to make behind the scenes requests back to the server from JavaScript. The server then generally responds by supplying the data you requested. Ive been using Mootols of latre so I'll show you an example using that: window.addEvent('domready', function() { $('initial-dropdown').addEvent('change', function(event) { var selection = event.target.get('value'); new Request.JSON({ url: 'dropdown.php', onSuccess: function (json) { for (result in json) { var option = new Element('option', { value: json[result].value, html: json[result].html }); option.inject($('secondary-dropdown')); } } }).post({'search': selection}); }); }); This makes a request to the php script dropdown.php when the initial-dropdown select changes sending it the selection within $_POST['selection']. The php script uses this data to execute a MySql query then returns the results as a json object (easily done using json_encode. This json object is then returned back to the JavaScript and turns up within the onSuccess function as data. From there, you simply loop through the results and add new <option> elements to the secondary-dropdown <select>. That is the basic concept (and untested Mootools code). Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 15, 2011 Author Share Posted July 15, 2011 Alright this is what I went with the below. My issue is how do I pass the position name to the second page to include in the DB query. ajax <script language="javascript"> function Inint_AJAX() { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript alert("XMLHttpRequest not supported"); return null; }; function dochange(src) { var req = Inint_AJAX(); req.onreadystatechange = function () { if (req.readyState==4) { if (req.status==200) { document.getElementById(src).innerHTML=req.responseText; //retuen value } } }; req.open("GET", "second_credit.php?data="+src); //make connection req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=iso-8859-1"); // set Header req.send(null); //send value } window.onLoad=dochange('second'); // value in first dropdown </script> second_credit.php <?php //set IE read from page only not read from cache header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); header ("Cache-Control: no-cache, must-revalidate"); header ("Pragma: no-cache"); header("content-type: application/x-javascript; charset=tis-620"); require_once 'db_select.php'; $data=$_GET['data']; $position=$_GET['position']; if($data=='second') { // second dropdown $sql_second_credit="SELECT * FROM $tbl_name4 WHERE position='Seq$position' OR position='Tril$position'"; $result_second_credit=mysql_query($sql_second_credit) or die(mysql_error()); echo '<select name="new_credit">'; echo '<option value="">Select Credit</option>'; while($second_row_credits=mysql_fetch_array($result_second_credit)){ extract($second_row_credits); echo '<option value="'.ucfirst($credit).'">'.ucfirst($credit).'</option>'."\n"; } } echo "</select>\n"; ?> credit.php <?php session_start(); $myusername=$_SESSION['myusername2']; $mypassword=$_SESSION['mypassword2']; require_once 'db_select.php'; require_once 'func.php'; $sql_credit="SELECT $tbl_name2.credit,$tbl_name.donor_id,$tbl_name.position FROM $tbl_name JOIN $tbl_name2 USING (donor_id) WHERE $tbl_name.username='$myusername' AND $tbl_name.password='$mypassword'"; $result_credit=mysql_query($sql_credit) or die(mysql_error()); $content=' <div class="main"> <div class="main_header">Purchase Additional Credit</div>'; if($_GET['e']==t){ $content.='<p class="green clear"> Request Sent. You should be contact with a discounted crew credit button specifically for you, in the next two business days. </p> '; } else{ $content.=' <p> If you wish to purchase an additional credit, use the form below to select the credit you wish to buy, the name in which the original credit is listed under (as listed on the donors page), and the e-mail address in which the original purchase came from. This is a great to get your name back on the top 100 donors list. Once you submit this form, we will review the submitted material, create a new paypal purchase button specifically for you, and send you the link to that button. From there, you will be able to purchase the additional credit.'; if($_GET['e']==f){ $content.='<p class="red"> The email address you entered doesn\'t match the email in the database for this account. Please try again. <br /> If you keep having problems, please contact us at <a href="mailto:general@makethemoviehappen.com"> general@makethemoviehappen.com</a>. </p>'; } $content.=' <form action="" method="post"> <p><label>Name Credit is Listed Under:</label> <input type="text" name="name" size="30" /></p> <p><label>E-Mail of Original Purchase:</label> <input type="text" name="email" size="32" /></p>'; $content.='<p><label>Original Credit Purchased:</label> <select name="credit"> <option value="">Select Credit</option>'."\n"; while($row_credits=mysql_fetch_array($result_credit)){ extract($row_credits); $content.='<option value="'.ucfirst($credit).'">'.ucfirst($credit).'</option>'."\n"; } $content.='</select></p>'."\n"; $content.=' <p><label>Second Credit to Purchase:</label> <span id="second"><select name="new_credit"> <option value="">Select Credit</option>'."\n". '</select></span></p>'."\n".' </p> <p><input type="submit" value="Submit" name="Submit" /></p> </form> '; } $content.=" </div> <br />"; ?> Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 15, 2011 Author Share Posted July 15, 2011 Basically I need a way to send the selection made from the first menu to the processing page to query the database to pull the right credits to list in the second menu. So I need to send $credit from credit.php to second_credit.php however possible, be it $_GET, or $_POST or whatever. Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 15, 2011 Author Share Posted July 15, 2011 Here's updated code. Still can't get the second menu to update: <?php //set IE read from page only not read from cache header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); header ("Cache-Control: no-cache, must-revalidate"); header ("Pragma: no-cache"); header("content-type: application/x-javascript; charset=tis-620"); require_once 'db_select.php'; $credit=$_GET['credit']; $sql_second_credit="SELECT * FROM $tbl_name4 WHERE item_id='Seq$credit' OR item_id='Tril$credit'"; $result_second_credit=mysql_query($sql_second_credit) or die(mysql_error()); echo '<select name="new_credit">'; echo '<option value="">Select Credit</option>'; while($second_row_credits=mysql_fetch_array($result_second_credit)){ extract($second_row_credits); echo '<option value="'.ucfirst($item_id).'">'.ucfirst($position).' - Film # '.$film_number.'</option>'."\n"; } echo "</select>\n"; ?> <script language="javascript"> function Inint_AJAX() { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript alert("XMLHttpRequest not supported"); return null; }; function reload(form){ var val=form.credit.options[form.credit.options.selectedIndex].value; } function dochange(src) { var req = Inint_AJAX(); req.onreadystatechange = function () { if (req.readyState==4) { if (req.status==200) { document.getElementById(src).innerHTML=req.responseText; //retuen value } } }; req.open("GET", "second_credit.php?credit="+val); //make connection req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=iso-8859-1"); // set Header req.send(null); //send value } window.onLoad=dochange('second'); // value in first dropdown </script> <?php session_start(); $myusername=$_SESSION['myusername2']; $mypassword=$_SESSION['mypassword2']; require_once 'db_select.php'; require_once 'func.php'; $sql_credit="SELECT $tbl_name2.credit,$tbl_name.donor_id,$tbl_name2.film_number FROM $tbl_name JOIN $tbl_name2 USING (donor_id) WHERE $tbl_name.username='$myusername' AND $tbl_name.password='$mypassword'"; $result_credit=mysql_query($sql_credit) or die(mysql_error()); $content=' <div class="main"> <div class="main_header">Purchase Additional Credit</div>'; if($_GET['e']==t){ $content.='<p class="green clear"> Request Sent. You should be contact with a discounted crew credit button specifically for you, in the next two business days. </p> '; } else{ $content.=' <p> If you wish to purchase an additional credit, use the form below to select the credit you wish to buy, the name in which the original credit is listed under (as listed on the donors page), and the e-mail address in which the original purchase came from. This is a great to get your name back on the top 100 donors list. Once you submit this form, we will review the submitted material, create a new paypal purchase button specifically for you, and send you the link to that button. From there, you will be able to purchase the additional credit.'; if($_GET['e']==f){ $content.='<p class="red"> The email address you entered doesn\'t match the email in the database for this account. Please try again. <br /> If you keep having problems, please contact us at <a href="mailto:general@makethemoviehappen.com"> general@makethemoviehappen.com</a>. </p>'; } $content.=' <form action="" method="post"> <p><label>Name Credit is Listed Under:</label> <input type="text" name="name" size="30" /></p> <p><label>E-Mail of Original Purchase:</label> <input type="text" name="email" size="32" /></p>'; $content.='<p><label>Original Credit Purchased:</label> <select name="credit" onchange="reload(this.form)"> <option value="">Select Credit</option>'."\n"; while($row_credits=mysql_fetch_array($result_credit)){ extract($row_credits); $content.='<option value="'.ucfirst($credit).'-'.$film_number.'">'.ucfirst($credit).' - Film # '.$film_number.'</option>'."\n"; } $content.='</select></p>'."\n"; $content.=' <p><label>Second Credit to Purchase:</label> <span id="second"><select name="new_credit"> <option value="">Select Credit</option>'."\n". '</select></span></p>'."\n".' </p> <p><input type="submit" value="Submit" name="Submit" /></p> </form> '; } $content.=" </div> <br />"; ?> Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 16, 2011 Author Share Posted July 16, 2011 Any ideas? Updated Code: <script language="javascript"> function Inint_AJAX() { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript alert("XMLHttpRequest not supported"); return null; }; function dochange(src, val) { var req = Inint_AJAX(); req.onreadystatechange = function () { if (req.readyState==4) { if (req.status==200) { document.getElementById(src).innerHTML=req.responseText; } } }; req.open("GET", "second_credit.php?data="+src+"&val="+val); req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8"); // set Header req.send(null); } window.onLoad=dochange('new_credit', -1); function ViewCrossReference (selSelectObject) { if (selSelectObject.options[selSelectObject.selectedIndex].value != "") { location.href=selSelectObject.options[selSelectObject.selectedIndex].value } } </script> <?php session_start(); $myusername=$_SESSION['myusername2']; $mypassword=$_SESSION['mypassword2']; require_once 'db_select.php'; require_once 'func.php'; $sql_credit="SELECT $tbl_name2.credit,$tbl_name.donor_id,$tbl_name2.film_number FROM $tbl_name JOIN $tbl_name2 USING (donor_id) WHERE $tbl_name.username='$myusername' AND $tbl_name.password='$mypassword'"; $result_credit=mysql_query($sql_credit) or die(mysql_error()); $content=' <div class="main"> <div class="main_header">Purchase Additional Credit</div>'; if($_GET['e']==t){ $content.='<p class="green clear"> Request Sent. You should be contact with a discounted crew credit button specifically for you, in the next two business days. </p> '; } else{ $content.=' <p> If you wish to purchase an additional credit, use the form below to select the credit you wish to buy, the name in which the original credit is listed under (as listed on the donors page), and the e-mail address in which the original purchase came from. This is a great to get your name back on the top 100 donors list. Once you submit this form, we will review the submitted material, create a new paypal purchase button specifically for you, and send you the link to that button. From there, you will be able to purchase the additional credit.'; if($_GET['e']==f){ $content.='<p class="red"> The email address you entered doesn\'t match the email in the database for this account. Please try again. <br /> If you keep having problems, please contact us at <a href="mailto:general@makethemoviehappen.com"> general@makethemoviehappen.com</a>. </p>'; } $content.=' <form action="" method="post"> <p><label>Name Credit is Listed Under:</label> <input type="text" name="name" size="30" /></p> <p><label>E-Mail of Original Purchase:</label> <input type="text" name="email" size="32" /></p> <p><label>Original Credit Purchased:</label>'; $content.='<select name="credit" onChange="dochange(\'new_credit\', this.value)">'."\n". '<option value="">Select Credit</option>'."\n"; while($credit_row=mysql_fetch_array($result_credit)){ extract($credit_row); $content.='<option value="'.ucwords($credit).'-'.$film_number.'" >'.ucwords($credit).' - Film # '.$film_number.'</option>'."\n" ; } $content.='<p><label>Second Credit to Purchase:</label> <span id="new_credit"><select name="new_credit" onChange="ViewCrossReference(this)"> <option value="">Select Credit</option>'."\n". '</select></span></p>'."\n".' </p> <p><input type="submit" value="Submit" name="Submit" /></p> </form> '; } $content.=" </div> <br />"; ?> <?php require_once 'db_select.php'; $myusername=$_SESSION['myusername2']; $mypassword=$_SESSION['mypassword2']; $data=$_GET['data']; $credit=$_GET['val']; if ($data=='credit') { $sql_credit="SELECT $tbl_name2.credit,$tbl_name.donor_id,$tbl_name2.film_number FROM $tbl_name JOIN $tbl_name2 USING (donor_id) WHERE $tbl_name.username='$myusername' AND $tbl_name.password='$mypassword'"; $result_credit=mysql_query($sql_credit) or die(mysql_error()); echo '<select name="credit" onChange="dochange(\'new_credit\', this.value)">'."\n"; echo '<option value="">Select Credit</option>'."\n"; while($credit_row=mysql_fetch_array($result_credit)){ extract($credit_row); echo '<option value="'.$credit.'-'.$film_number.'" >'.$credit.' - Film # '.$film_number.'</option>'."\n" ; } } elseif($data=='new_credit') { echo '<select name="new_credit">'."\n"; echo '<option value="">Select Credit</option>'."\n"; $sql_second_credit="SELECT * FROM $tbl_name4 WHERE item_id='Seq$credit' OR item_id='Tril$credit'"; $result_second_credit=mysql_query($sql_second_credit) or die(mysql_error()); while($second_row_credits=mysql_fetch_array($result_second_credit)){ extract($second_row_credits); echo '<option value="'.ucfirst($item_id).'">'.ucfirst($position).' - Film # '.$film_number.'</option>'."\n"; } } echo "</select>\n"; ?> This results in this: Quote Link to comment Share on other sites More sharing options...
trq Posted July 16, 2011 Share Posted July 16, 2011 Does my example not look a whole lot simpler? Quote Link to comment Share on other sites More sharing options...
HDFilmMaker2112 Posted July 16, 2011 Author Share Posted July 16, 2011 Does my example not look a whole lot simpler? It did, but I didn't understand any of it. I prefer to use stuff that I actually understand. It's working now anyway. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.