CODEWITHSUNDEEP
javascriptphpjquery
Chaos
Chaos

Reputation: 67

Cannot pass data from my JavaScript to my PHP file

When I click on "subcribeButton" I want it to save the value and pass that value to my PHP file. I want that PHP file to then make a post to the SQL database.

This is my js:

$(".subscribeButton").on( "click", function() {

    var email = $(".subscribeInput").val();
    var isValid = isEmailValid(email);

    if(isValid){
        $(".errorMsg").css( "display", "none" );
        modal.style.display = "block";

        $.post( "save.php", { email: email });

        $(".subscribeInput").val("");

    } else {
        $(".errorMsg").css( "display", "initial" );
    };

});

$(".subscribeInput").on( "click", function() {

    $(".subscribeInput").val("");

});

This is my php code, I would like my php code to accept data from my js file and then post the data to my sql database:

<?php
$servername = "localhost";
$username = "user";
$password = "pw";
$dbname = "db_name";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$text = $_POST['email'];

echo $text

$sql = "INSERT INTO MyGuests (email)
 VALUES ($text)";



if ($conn->query($sql) === TRUE) {
    echo "New record created successfully";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();
?>

The result is I'm getting the following error:

POST http://flockto.it/home/save.php 500 (Internal Server Error)
send    @   jquery.js:4
ajax    @   jquery.js:4
m.(anonymous function)  @   jquery.js:4
(anonymous function)    @   email.js:13
dispatch    @   jquery.js:3
r.handle    @   jquery.js:3

Upvotes: 0

Views: 69

Answers (3)

Chaos
Chaos

Reputation: 67

The solution:

In the js file url was wrong and quotation marks around email were missing

$(".subscribeButton").on( "click", function() {

    var email = $(".subscribeInput").val();
    var isValid = isEmailValid(email);

    if(isValid){
        $(".errorMsg").css( "display", "none" );
        modal.style.display = "block";

        $.post( "data/save.php", { "email": email });

        $(".subscribeInput").val("");

    } else {
        $(".errorMsg").css( "display", "initial" );
    };

});

$(".subscribeInput").on( "click", function() {

    $(".subscribeInput").val("");

});

In the php file used the wrong variable

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$text = $_POST['email'];

if (isset($_POST['email'])){
   $text = $_POST['email'];
   echo $text;
}

$sql = "INSERT INTO MyGuests (email)
 VALUES ('$text')";



if ($conn->query($sql) === TRUE) {
    echo "New record created successfully";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();
?>

A million thanks to everyone who replied to this thread and helped me solve the issue.

Upvotes: 0

Slavik Meltser
Slavik Meltser

Reputation: 10371

You have a syntax error.
Your code is missing the ; at the end of this line:

echo $text

It should be:

echo $text;

Upvotes: 1

PacMan
PacMan

Reputation: 1358

so why not adding a callback in your ajax request so you can debug it in console or with an alert see this it may help you 

$.post( "save.php", { "email" : email } , function(result){
   console.log(result);//here the result will display what you will echo after getting the post in your php file
});

so in your php file you can add this 

if (isset($_POST['email'])){
   $text = $_POST['email'];
   echo $text;
}
//so if you check the console you will get the email
//value from your php file so then you can insert it at the DB as you want

Upvotes: 1

Related Questions