Creating a Jquery function to send a value to php

Question

I have created a simple select php script that return data from my db. I was was wondering how i would go about creating a Jquery function that passes a variable to the php page. Am i right in thinking this will not require the html page to be refreshed?

The function is called when the drop down menu choice changes. I wish to pass the value of the drop down menu to PopulateBoxes.php.

HTML

<head>
<link href="../UserTemplate.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Tours</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js">   </script>

<script type="text/javascript">
function popBox(str)
{
//Jquery function to pass variable to PopulateBoxes.php
}
</script>
</head>
<body>
<select name="lst_MonthDrop" style="background-color:#FF9933; color:#FFF; border:none; margin-top:10px; margin-left:10px;" onchange="popBox(this.value);">
    <option>Please Select</option>
    <?php 
    include 'populatedrodown.php';
    foreach ( $results as $option ) : ?>
        <option value="<?php echo $option->Date; ?>"><?php echo $option->Date; ?></option>
    <?php endforeach; ?>
</select>
</body>
</html>

PHP

<?php
    $passed = $_POST['passedvariable'];

    $mysql_db_hostname = "localhost"; 
    $mysql_db_user = "root"; 
    $mysql_db_password = "pwd"; 
    $mysql_db_database = "db";

    $con = mysql_connect($mysql_db_hostname, $mysql_db_user, $mysql_db_password) or         die("Could not connect database");
    mysql_select_db($mysql_db_database, $con) or die("Could not select database"); 

    $sql="SELECT * FROM Tour WHERE Date = '".$passed."'";

    $result = mysqli_query($con,$sql);


    while($row = mysqli_fetch_array($result))
    {

       $Duration = $row['Duration'] ;
       $Vessel = $row['Vessel_Name'] ;
       $Location = $row['Location'] ;
       $Available = $row['Available'];
       $Price = $row['Price'];
       echo $Price;
    }

    mysqli_close($con);
    ?>

If any could help i'd really appreciate it, I have been struggling to come to terms with jquery and especially this function for hour. Thanks in advance.

If you want to avoid the page refresh, you'll need to use AJAX. http://api.jquery.com/jQuery.ajax/ — Paul Dessert, Dec 02 '13 at 22:55
**Danger**: You are using [an **obsolete** database API](http://stackoverflow.com/q/12859942/19068) and should use a [modern replacement](http://php.net/manual/en/mysqlinfo.api.choosing.php). You are also **vulnerable to [SQL injection attacks](http://bobby-tables.com/)** that a modern API would make it easier to [defend](http://stackoverflow.com/questions/60174/best-way-to-prevent-sql-injection-in-php) yourself from. — Quentin, Dec 02 '13 at 22:58
possible duplicate of [using jquery $.ajax to call a PHP function](http://stackoverflow.com/questions/2269307/using-jquery-ajax-to-call-a-php-function) — Sean Vieira, Dec 03 '13 at 03:29

score 0 · Accepted Answer · answered Dec 02 '13 at 22:59

0

You can do this with via AJAX. jQuery offers $.ajax to do this, but also shorthands like $.post

function popBox(str) {
    $.post('PopulateBoxes.php', { passedvariable: str }, function(data) {
        // data will be what the PHP page echoes
    });
}

If you want to have a somewhat complex result (more than one value), you can use JSON. In PHP create an object or an array and when you print it, do so after calling json_encode. Now change your code to something like this

function popBox(str) {
    $.post('PopulateBoxes.php', { passedvariable: str }, function(data) {
        // data will be the JSON object
    }, "json");
}

answered Dec 02 '13 at 22:59

kero

10,647
5
41
51

Is it possible to access to php variable using either echo/print on my html page i.e. txt_Price = etc. – Seatter Dec 02 '13 at 23:06
Yes and no (depends on what exactly you mean). Once PopulateBoxes.php is called, you can only retrieve the output as whole. If you want to have multiple values, use JSON as I suggested. If you meant to use an initial value inside the function, of course that is possible. If this didn't answer, please elaborate (preferrably in your question) – kero Dec 02 '13 at 23:09
Really what im after if i wish to search the for all tour trip on the selected date and return all data to the corresponding textboxes on my html page – Seatter Dec 02 '13 at 23:10
As I said, if you have a not-so-simple output in the PHP, use JSON to ensure communication between PHP and JavaScript - there should be plenty of resources (tutorials, similar questions, etc.) out there – kero Dec 02 '13 at 23:13
Thank At least i now have a starting point. – Seatter Dec 02 '13 at 23:15

Creating a Jquery function to send a value to php

1 Answers1