CODEWITHSUNDEEP
phpmysqlionic-frameworkionic2
TanguyH
TanguyH

Reputation: 171

Ionic : unable to send form data to php on MAMP server

I recently started developing app's using Ionic. As I am more familiar with MySQL for backend solutions, what I want to do is this : extract credentials from a form and send them to a php file on a MAMP server. This file would check wether the account exists and respond.

Here's the form:

<form name="loginForm" novalidate> <!-- ng-submit="LogIn(loginForm)" -->
        <div class="section-big">
            <div id="logo_container">
                <img src="img/Logo.png" id="logo">
            </div>

            <div id="login_container">
                <input class="login_item" name="email" type="email" ng-model="userdata.email" placeholder="email" ng-minlength="5" required>
                <input class="login_item" name="password" type="password" ng-model="userdata.password" placeholder="password" ng-minlength="5" required>
            </div>
        </div>

        <span> {{responseMessage}} </span>

        <div class="section-small">
            <button type="button" class="button button-full button-outline button-light login-inactive" ng-show="loginForm.$invalid">LOGIN</button>

        </div>
    </form>

The function in the Ionic controller :

$scope.logIn = function(userdata) {
    $scope.responseMessage = "in treatement";

    console.log($scope.userdata.email)

    var request = $http({
        method: 'post',
        url: 'http://localhost:8888/login.php',
        crossDomain: true,
        headers: {'Content-Type' : 'application/x-www-form-urlencoded'},
        data: {
            email: $scope.userdata.email,
            password: $scope.userdata.password
        },
    });
    console.log("passed");

    request.success(function(data) {
        if(data == "1"){
            $scope.responseMessage = "Login Successful";
        }
        else {
            $scope.responseMessage = "Wrong credentialsemai";
        }
    });
    console.log("end reached");
}

The login.php file (based on my findings on StackSkills):

<?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 = $request->email;
$password = $request->password;

include_once 'dbconnect.php';

$request = "SELECT * FROM User WHERE email ='$email' AND password = '$password'";
$result = $conn->query($request);

if($result){
    echo "1";
}
else {
    echo "0";
}
?>

The State of things : Currently, the logIn function is triggered. As{{ responseMessage }} doesn't change, I assume the information isn't sent / doesn't make it back from `login.php.

Does anyone have an idea to either fix this or an alternative still using Ionic to php for MySQL ?

EDIT:
The data is being retrieved, but I am still unable to send it due to the following error: SyntaxError: Unexpected token N

Thanks !

Upvotes: 0

Views: 182

Answers (1)

Divyesh Savaliya
Divyesh Savaliya

Reputation: 2740

This error is because in php your first line is header("Content-Type: application/json; charset=UTF-8");

that means it try to encode response in json but you are returning string only 1 or 0

Try following in php.

if($result){
    echo json_encode(array("status"=>1));
}
else {
    echo json_encode(array("status"=>0));
}

Upvotes: 1

Related Questions