Ionic app data from html to php server

Question

Ionic app data from html to php server

4.7k views Asked by san santhosh At 19 October 2024 at 17:45

I'm new to Ionic framework and am struggling to post data from HTML to PHP.

1.index.html:

<!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">

    <!-- 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>
  <script src="js/ng-cordova.min.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">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">HTML</h1>
      </ion-header-bar>

      <ion-view title="Signup">
     <ion-nav-buttons side="left">
      <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
    </ion-nav-buttons>

    <ion-content class="has-header">
      <div class="list list-inset">

       <label class="item item-input">
         <input class="form-control" type="text" ng-model="userdata.username" placeholder="Enter Username">
       </label>

       <label class="item item-input">
         <input type="text" ng-model="userdata.email" placeholder="Enter Your Email">
       </label>

       <label class="item item-input">
         <input class="form-control" type="password" ng-model="userdata.password" placeholder="Enter Your Password">
       </label>

       <button class="button button-block button-positive button-dark" ng-click="signUp(userdata)">SignUp</button><br>
       <span>{{responseMessage}}</span>
     </div>
    </ion-content>

  </ion-view>
    </ion-pane>
  </body>
</html>

app.js:

.controller('SignupCtrl', function($scope, $http) {
$scope.signup = function () {
        var request = $http({
            method: "post",
            url: "http://myurl.com/signup.php",
            crossDomain : true,
            data: {
                email: $scope.email,
                password: $scope.password,
                username: $scope.username
            },
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        });
        /* Successful HTTP post request or not */
        request.success(function(data) {
            if(data == "1"){
             $scope.responseMessage = "Successfully Created Account";
            }
            if(data == "2"){
             $scope.responseMessage = "Create Account failed";
            }
            else if(data == "0") {
             $scope.responseMessage = "Email Already Exist"
            }  
        });
}
})

3.PHP file:

<?php
        header("Content-Type: application/json; charset=UTF-8");
        header('Access-Control-Allow-Origin: *');
        header('Access-Control-Allow-Methods: GET, POST');

        $postdata = file_get_contents("php://input");
        $request = json_decode($postdata);
        $email = $postdata->email;
        $password = $postdata->password;
        $username = $postdata->username;

        $con = mysql_connect("localhost","username",'password') or die ("Could not connect: " . mysql_error());;
        mysql_select_db('dbname', $con);

        $qry_em = 'select count(*) as cnt from users where email ="' . $email . '"';
        $qry_res = mysql_query($qry_em);
        $res = mysql_fetch_assoc($qry_res);

        if($res['cnt']==0){
        $qry = 'INSERT INTO users (name,pass,email) values ("' . $username . '","' . $password . '","' . $email . '")';
        $qry_res = mysql_query($qry);
            if ($qry_res) {
                echo "1";
            } else {
                echo "2";;
            }
        }
        else
        {
            echo "0";
        }
        ?>

Original Q&A

There are 1 answers

**Nikola** · Accepted Answer · 2015-06-10 09:56:02

edit: I wrote a detailed post on how to post data from Ionic to PHP and you can view it here.

In the index.html file you have:

ng-click="signUp(userdata)

but then in the app.js file you have this:

$scope.signup = function () {

instead of something like:

$scope.signup = function (userdata) {

If you would go this route then your data should look like this:

data: {
        email: userdata.email,
        password: userdata.password,
        username: userdata.username
}

However, you don't have to do it like this! You can do it like so that you remove the userdata from ng-click="signUp(userdata) and then in the app.js file in the data part you do it like this:

data: {
        email: $scope.userdata.email,
        password: $scope.userdata.password,
        username: $scope.userdata.username
}

TechQA.

Ionic app data from html to php server

There are 1 answers

Related Questions in IONIC-FRAMEWORK

Related Questions in HTTP-POST

Popular Questions

Popular Tags

Trending Questions