Save to database without a form using jQuery and PHP

Question

I'm trying to save some data to a database without the use of an html form and was wondering if anyone could help me as I'm no expert in PHP. So far I have got:

JQuery

$('.summary').on('click', '#btn_save', function () {

            var summary_weight = $('#summary_weight').text();
            var summary_bmi = $('#summary_bmi').text();
            var summary_consumed = $('#summary_consumed').text();
            var summary_burned = $('#summary_burned').text();
            var summary_total = $('#summary_total').text();
            var user_id = $('#user_id').text();

            //All values stored correctly

            $.ajax({
                type: "POST",
                url: "save.php",
                data: //Data to send,
                success: function () {
                    $('.success_message').html("success");
                }
            });
        });

There is no issue at the first stage as all my values are stored in the variables correctly. I just don't know in what format to send them across to save.php.

save.php

<?php
require_once 'dbconfig.php';
//Connects to database

if($_POST)
 {
     //Not sure what to post here

$current_date = date('Y-m-d');

  try{

   $stmt = $db_con->prepare("INSERT INTO entry(user_id, date, weight, bmi, calories_consumed, calories_burned, calorific_deficit) VALUES(:user, :date, :weight, :bmi, :consumed, :burned, :deficit)");

   $stmt->bindParam(":user", $user_id);
   $stmt->bindParam(":date", $current_date);
   $stmt->bindParam(":weight", $summary_weight);
   $stmt->bindParam(":bmi", $summary_bmi);
   $stmt->bindParam(":consumed", $summary_consumed);
   $stmt->bindParam(":burned", $summary_burned);
   $stmt->bindParam(":deficit", $summary_total);

   if($stmt->execute())
   {
    echo "Successfully Added";
   }
   else{
    echo "Query Problem";
   } 
  }

  catch(PDOException $e){
   echo $e->getMessage();
  }
 }
?>

I'm not sure how to post this data to save.php and then how to process it to be sent to the database. I've also added a variable of current_date to send the current date to a field in the database.

Can anyone help me and fill in the blanks? Or maybe I'm going about this the wrong way?

You don't have to convert the members on the server side. jQuery sends them as multiple separate parameters. — random_user_name
– random_user_name, Commented Mar 25, 2016 at 16:57

random_user_name · Accepted Answer · 2016-03-25 16:55:45Z

1

Send your data in an object, like so:

// Declare data as an empty object
var data = {};
// Assemble the properties of the data object
data.summary_weight = $('#summary_weight').text();
data.summary_bmi = $('#summary_bmi').text();
data.summary_consumed = $('#summary_consumed').text();
data.summary_burned = $('#summary_burned').text();
data.summary_total = $('#summary_total').text();
data.user_id = $('#user_id').text();

$.ajax({
    type: "POST",
    url: "save.php",
    // pass the data object in to the data property here
    data: data,
    success: function () {
        $('.success_message').html("success");
    }
});

Then, on the server side, you can access directly via $_POST superglobal:

$summary_weight = $_POST['summary_weight'];
$summary_bmi = $_POST['summary_bmi'];
// etc...

answered Mar 25, 2016 at 16:55

random_user_name

26.3k7 gold badges81 silver badges119 bronze badges

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

Comments

Aparna · Accepted Answer · 2016-03-25 16:58:42Z

You can send all this data in the data parameter as given below:

$('.summary').on('click', '#btn_save', function () {

        var summary_weight = $('#summary_weight').text();
        var summary_bmi = $('#summary_bmi').text();
        var summary_consumed = $('#summary_consumed').text();
        var summary_burned = $('#summary_burned').text();
        var summary_total = $('#summary_total').text();
        var user_id = $('#user_id').text();

        //All values stored correctly

        $.ajax({
            type: "POST",
            url: "save.php",
            data: {summary_weight: summary_weight, summary_bmi:summary_bmi, summary_consumed:summary_consumed, summary_burned: summary_burned, summary_total:summary_total, user_id:user_id },
            success: function () {
                $('.success_message').html("success");
            }
        });
    });

And the, process it in save.php like this $summary_weight = $_POST['summary_weight']; and use it in the query to save it in database.

Collectives™ on Stack Overflow

Save to database without a form using jQuery and PHP

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related