Posting data from Ionic framework using PHP

Question

I am trying to send the data I've received using javascript to the localhost but the PHP file doesn't run when I build it as an android application.I've tried running it normally in XAMP before building it and it seems like the PHP connects even tho the data doesn't get sent, however after building it as an ionic android application it doesn't even connect. What is going wrong here?

Index.HTML

     <?php
        include "main.php";

    ?>
    <!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
<!-- START OF GEOLOCATION -->


<center><div class="round-button"><div class="round-button-circle"><a onclick= "getLocation()" class="round-button">HELP</a></div></div></center>

<p id="demo"></p>
<script src="js/jquery.js"></script>




<script>

var glob_latitude = '';
var glob_longitude = '';

var x = document.getElementById("demo");

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.watchPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";}
    }


///send to ip
function showPosition(position) {
    x.innerHTML="Latitude: " + position.coords.latitude +
    "<br>Longitude: " + position.coords.longitude;

    glob_longitude = position.coords.longitude;
    glob_latitude = position.coords.latitude;




   $.post( "main.php", { latitude: glob_latitude, longitude: glob_longitude } );

}



</script>
<!-- END OF GEOLOCATION -->
    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->


    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter" background="css/style.css">


  </body>
</html>

Main.php

  <?php
echo "ok";

//$dbConnection = mysqli_connect("160.153.162.9", "Musab_Rashid" , "zaq123wsx" ,"Musab_Rme");
$dbConnection = mysqli_connect("localhost", "root" , "" ,"info");
echo "connected";
if($dbConnection)
    {
        echo "connected";
        if(isset($_POST['latitude']) and isset($_POST['longitude'])){
            $latitude = $_POST['latitude'];
            $longitude = $_POST['longitude'];

            if($latitude != '' and $longitude != '')
                $query = mysqli_query("INSERT INTO info VALUES (NULL, '{$latitude}', '$longitude')");

        }

    }
else
    die();

mysqli_close($dbConnection);
?>

Ionic is a mobile framework, so I assume you will be running the app on a mobile device. This means you need to separate the app from the server side (which you will need to run on some public web host). — JimL
– JimL, Commented Jan 13, 2016 at 11:39
Like KimL sayd, another thing you have to do after submitting your ajax request, you would have to pick up the returned value within your app.js — Frank W.
– Frank W., Commented Jan 13, 2016 at 11:44
but it doesn't give me an error when not connected to the localhost which is an obvious result while running this code on the mobile result. which means that the application wasn't able to run the PHP code, or am I wrong ? — Musab Yass Alaqeede
– Musab Yass Alaqeede, Commented Jan 13, 2016 at 11:45

Frank W. · Accepted Answer · 2016-01-13 12:14:49Z

1

Allright, couple of things:

It is not possible to make an ionic app with php logic when u execute the php on your localhost. The php must be executed on a external server. The simple reason is, when you export your app and try it on your phone, the application can't access your localhost. To be more specific:
```
 <?php
include "main.php";
?>
```

In combination with the ajax request:

 $.post( "main.php", { latitude: glob_latitude, longitude: glob_longitude } );

What i tried to say to you in my comment, is that your dataflow you look like this:

App sends data by ajax request -> PHP executes incoming data -> php echo's json object or string -> retrieve string or json object -> show data to user

Have a look at this source, helped me to get me started. http://www.nikola-breznjak.com/

Goodluck!

answered Jan 13, 2016 at 12:14

Frank W.

7833 gold badges15 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Frank W. Over a year ago

Did my answer work for you or do you have any more specific questions?

Musab Yass Alaqeede Over a year ago

The latitude and longitude is not being posted to the main.php even when setting it to an external server

Frank W. Over a year ago

Can you edit your question post to the setup you have now?

Frank W. Over a year ago

You should try to setup the example i gave you. Check out the link and see if you can get that to work and move forward from that point. It takes some effort, but it will be rewarding once you can get it to work!

Collectives™ on Stack Overflow

Posting data from Ionic framework using PHP

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related