PHP和Javascript通讯

Question

<form action="../">
<select onchange="window.open(this.options[this.selectedIndex].value,'_top')">
    <option value="">Choose a zipcode </option>
    <option value="92507">92507</option>
    <option value="30078">30078</option>
    <option value="92606">92606</option>
    <option value="30004">30004</option>
    <option value="32034">32034</option>
    <option value="37160">37160</option>
</select>
</form>

I have created a drop down menu where the user could select a zip code. I want to send the zipcode that the user has selected to a php script. How to go about this?

This is what I have done/understood so far. I need to add this line of code $php_variable = $_GET['param1']; in my php file which would get the zip code as param1 which the javascript sends over the url. I can use an ajax function in my javascript and call a post to send over the data. Am I on the right track? How do I actually save the user's selection of zip code into a variable. Also shouldn't the ajax be in a script? Can I also put the drop down menu in the script portion as well?

Almost there. The current problem is that when I click on a particular zip code. This is the url I get http://localhost:8888/92606 instead of http://localhost:8888/getuv.php?param1=92606

Answer 1

<form action="page.php" method="post">
<selecton name="zip" onchange="window.open(this.options[this.selectedIndex].value,'_top')">
<option value="">Choose a zipcode </option>
<option value="92507">92507</option>
<option value="30078">30078</option>
<option value="92606">92606</option>
<option value="30004">30004</option>
<option value="32034">32034</option>
<option value="37160">37160</option>
</select>
</form>

on the page.php you should code like

<?php
$code=$_POST['code'];
echo 'the zip code is'.$code;
?>

Answer 2

You should try jquery way for frontend.

<select id="myList">
    <option value="">Choose a zipcode </option>
    <option value="92507">92507</option>
    <option value="30078">30078</option>
    <option value="92606">92606</option>
    <option value="30004">30004</option>
    <option value="32034">32034</option>
    <option value="37160">37160</option>
</select>



$("#myList").change(function () {
    var myValue = $("#myList option:selected").val();
    sendToServer(myValue);
});
var sendToServer = function(myValue){
 // Use some ajax
    jQuery.ajax(
        type: "GET",
            url: 'http://host.com/' +'param1='+ myValue,
            beforeSend: function(){ 
                // do something
            },
            success: function(data){
                // success 
            }
        });
}

Answer 3

You need to assign 'param1' to name in the select tag:

code:

 <form action="../"> <select name = 'param1' onchange="window.open(this.options[this.selectedIndex].value,'_top')"> <option value="">Choose a zipcode </option> <option value="92507">92507</option> <option value="30078">30078</option> <option value="92606">92606</option> <option value="30004">30004</option> <option value="32034">32034</option> <option value="37160">37160</option> </select> </form> 

Answer 4

You forgot the name attribute, and the onchange method you had was just opening a new window with the param1 as the url.

<form action="../">
    <select name="param1" onchange="this.form.submit()">
        <option value="">Choose a zipcode </option>
        <option value="92507">92507</option>
        <option value="30078">30078</option>
        <option value="92606">92606</option>
        <option value="30004">30004</option>
        <option value="32034">32034</option>
        <option value="37160">37160</option>
    </select>
</form>