CODEWITHSUNDEEP
phphtmlajaxdatabase
Rohan Kumar
Rohan Kumar

Reputation: 67

Inserting data into database using AJAX-php using onclick

I am trying ajax method to insert data into the database using php. But only the alert message is working and data is not getting inserted into database

My form:

<div class="contactForm">   
            <h3>Share your contact Details</h3>
            <form id=register>
              <div class="form-group">
                <input type="text" id="team" class="form-control" placeholder="Enter Team Name">
              </div>
              <div class="form-group">
                <input type="text" id="m1" class="form-control" placeholder="Member#1">
              </div>
              <div class="form-group">
                <input type="text" id="m2" class="form-control" placeholder="Member#2">
              </div>
              <div class="form-group">
                <input type="text" id="m3" class="form-control" placeholder="Member#3">
              </div>
              <div class="form-group">
                <input type="text" id="m4" class="form-control" placeholder="Member#4">
              </div>

              <div class="form-group">
                <input type="text" id="email" class="form-control" placeholder="Enter your Email ID">
              </div>

              <div class="form-group">
                 <input type="text" id="number" class="form-control" placeholder="Enter your Mobile No.">
              </div>
              <div class="form-groud">

                  <a type="submit" onclick=register() class="btn">Register</a></div>
            </form>
        </div>

call function:

function register() {
var team = document.getElementById("team").value;
var m1 = document.getElementById("m1").value;
var m2 = document.getElementById("m2").value;   
var m3 = document.getElementById("m3").value;
var m4 = document.getElementById("m4").value;
var email = document.getElementById("email").value;
var number = document.getElementById("number").value;
// Returns successful data submission message when the entered information is stored in database.
var dataString = 'team=' + team + '&m1=' + m1 + '&m2=' + m2 + '&m3' + m3 + '&m4' + m4 + '&email' + email + '&number' + number;
if (team == '' || m1 == '' || m2 == '' || m3 == '' || m4 == '' || email == '' || number == '') {
    alert("Please Fill All Fields");
} else {
    // AJAX code to submit form.
    $.ajax({
        type: "POST",
        url: "workreg.php",
        data: dataString,
        cache: false,
        success: function(html) {
            alert(html);
        }
    });
}
return false;

}

and here is the php:

<?php
// Fetching Values From URL
$team=$_POST['team'];
$m1=$_POST['m1'];
$m2=$_POST['m2'];
$m3=$_POST['m3'];
$m4=$_POST['m4'];
$email=$_POST['m4'];
$number=$_POST['m4'];
$connection = mysql_connect("localhost", "root", ""); // Establishing Connection with Server..
$db = mysql_select_db("event", $connection); // Selecting Database
if (isset($_POST['team'])) {
    $query = mysql_query("insert into workshop values ('$team', '$m1', '$m2','$m3','$m4','$email','$number')"); //Insert Query
    echo "Form Submitted succesfully";
}
mysql_close($connection); // Connection Closed

?>

whenever i am clicking register its is just showing alert message but i checked the database no value is getting inserted

Upvotes: 1

Views: 3693

Answers (3)

gaurav
gaurav

Reputation: 1339

Actually you are only checking for post variable test is present or not . You are not checking for your successful database query execution . in your current code check after $query 

if(!$query){ 
    echo "Form Submitted succesfully"
} else {
     die('Invalid query: ' . mysql_error()); // show  the error 
}

mysql is deprecated functions so i am using mysqli , it is also better for you to use this. Never trust user's input so i am also using prepare statement. You should always looking for updated videos & articles. 

$connection = mysqli_connect("localhost", "root", "","event"); // Establishing Connection with Server..

if (isset($_POST['team'])) {
    $query = "insert into workshop values (?, ?, ?,?,?,?,?)"; //Never trust user's input so use prepare 
    $stmt = mysqli_prepare($connection ,$query) ;
    mysqli_stmt_bind_param($stmt,'ssssssi',$team,$m1,$m2,$m3,$m4,$email,$number) ;
    mysqli_stmt_execute($stmt);
    if( mysqli_stmt_affected_rows($stmt) === 1 ) { //it will be int 1 if one row is inserted
        echo "Form Submitted succesfully" ;
    }else {
        echo mysqli_error($connection)
    }
}

mysqli_close($connection); // Connection Closed

some sources for future

How can I prevent SQL injection in PHP?

https://phpdelusions.net/pdo (it's about PDO but you will get idea.)

http://php.net/manual/en/mysqli.quickstart.prepared-statements.php

Upvotes: 1

Nasirudeen Olohundare
Nasirudeen Olohundare

Reputation: 65

    $('#register').submit(event => {
        event.preventDefault();

        let team = $('#team').val();
        let m1 = $('#m1').val();
        let m2 = $('#m2').val();
        let m3 = $('#m3').val();
        let m4 = $('#m4').val();
        let email = $('#email').val();
        let number = $('#number').val();

        $.ajax({
            url: "workreg.php",
            method: "POST",
            data: { team, m1, m2, m3, m4, email, number }
                .done(data => {
                    console.log(data)
                })
                .fail(err => console.error(err))
        })
    })

Upvotes: 0

Kata
Kata

Reputation: 142

The Content-Type is missing from your post request. I worked only with PostgreSQL but Content-Type was kinda necessary for the post requests to work properly in my case, maybe you should check that. Also check if you set to autocommit to your database at the connection or the data wont be added to the database.

Upvotes: 0

Related Questions