Pass values from Javascript to script PHP, and generate JSON to other page

Question

I'm doing an android app in eclipse (using phonegap + json + php) and i have some troubles... I really don't know how to ...

• I have a php file ( consulta.php ) that generates the json, whichc is locate in my server ( 192.168.1.200/test/consulta.php :

   header('content-type: application/json'); mysql_connect("localhost","jhonatan","jsandoval"); mysql_select_db("tesis"); $array = array(); $query = mysql_query("SELECT * FROM GRIFO"); while($fila = mysql_fetch_object($query)){ //echo $fila['id'] . " " . $fila['grifo'] . " " . $fila['distrito'] . "<br/>"; $array[] = array('id'=>$fila->id, 'grifo'=>$fila->grifo, 'distrito'=>$fila->distrito, 'latitud'=>$fila->latitud, 'longitud'=>$fila->longitud); } echo json_encode($array); 

So, in my index.html (from android app, phonegap in eclipse) , have a form wich gets 2 selects (HTML).

<form id="combustibleForm" method="get">
        <select id="combustibleSelect" name="combustibleSelect" data-theme="a">
        <option value="gnv" >Gas Natural Vehicular</option>
        <option value="glp" >Gas Licuado de Petróleo</option>
        </select>

        <br/>

        <select id="distritoSelect" name="distritoSelect" data-theme="a">
        <option value="SJL" >San Juan de Lurigancho</option>
        <option value="Miraflores" >Miraflores</option>
        <option value="Chorrillos" >Chorrillos</option>
        <option value="Surquillo" >Surquillo</option>
        </select>

        <br/>

        <input type="submit" data-role="button" id="continuarBtn" value="Continuar.." />
</form>

I must pass the values of these selects to the php file above and generate a json from there:

// GET THE VALUE OF THE SELECTS ... I don't know if this is correct? :S
$tipo = $_GET['tipo'];
$distrito = $_GET['distrito'];
...
...
$query = mysql_query("SELECT * FROM GRIFO WHERE (tipo='$tipo' and distrito='$distrio')");
...
...
// Generate json
echo json_encode($array);

This is what i have to do: After that... i have another html page ( mapa.html , in eclipse), that get the json from the php (wtf!? ) ... HOW TO DO THIS? :S ..

Also, when i Click the submit form (in index.html ), must redirect to mapa.html , to get the json....

I really don't know and don't have any ideas to do this big problem...

Can someone please help me?...

Sorry for bad english

Answer 1

You could pass the json as an url_encoded string appended to the url or a hidden field. if you need to communicate beteween pages, have the generating page echo the json into a hidden field. You could also do ajax or curl request for the json

Something like (in index.html)

<?php $data = url_encode(json_encode($array)) ?>
    <form action="mapa.html?data=<?php echo $data?>" method="get">
    ...
    </form>

Answer 2

Your form element in the HTML has no action attribute. This is where the browser will send the request when the user clicks on submit. So, if you want to send the request to your PHP script you will need you need to set that in the action attribute of your form.

Assuming consulta.php is located in the same directory as that of your HTML page...

<form id="combustibleForm" method="get" action="consulta.php">
        <select id="combustibleSelect" name="combustibleSelect" data-theme="a">
        <option value="gnv" >Gas Natural Vehicular</option>
        <option value="glp" >Gas Licuado de Petróleo</option>
        </select>

        <br/>

        <select id="distritoSelect" name="distritoSelect" data-theme="a">
        <option value="SJL" >San Juan de Lurigancho</option>
        <option value="Miraflores" >Miraflores</option>
        <option value="Chorrillos" >Chorrillos</option>
        <option value="Surquillo" >Surquillo</option>
        </select>

        <br/>

        <input type="submit" data-role="button" id="continuarBtn" value="Continuar.." />
</form>

Now, when this form is submitted the request will be directed to your PHP script, which will generate the JSON.

As for getting the values sent by the form in your PHP you need to use the name attributes you defined for those SELECT elements.

In your case that is combustibleSelect and distritoSelect .

$_GET['combustibleSelect']; // This will be the value of the 1st SELECT box
$_GET['distritoSelect'];    // This will be the value of the 2nd SELECT box

Please do not use the old ext/mysql API to interface with your database as it has been deprecated and may be removed in future versions of PHP. Consider using the newer PDO or MySQLi APIs instead to interface with your MySQL databse in PHP.

As for getting the data into javascript, you want to use ajax to make an XHR request to your PHP script. This will allow you to populate whatever you want to populate in the DOM of your HTML with javascript, by asking javascript to go out and make a request to your PHP script in the background and then hand you back the JSON to do with as you please without the user ever having to leave the page.