Dynamic data retrieval with the power of JavaScript and AJAX

Question

Dynamic data retrieval with the power of JavaScript and AJAX

When attempting to send data using AJAX in PHP, I encountered an issue with my jQuery click function on a button that sends data only when the quantity is greater than 1. The error arises because PHP does not recognize the variables 'name' and 'nb'.

Below is my JQUERY/AJAX code:

$('.btn-circle').on('click', function(){
    var name = $('.quantite').attr('name');
    var nb = $('.quantite').text();
});

$('#form_top_ten').submit(function() {
    if(nb>=1){
        $.ajax({
            type: "POST",
            url: "handle_form/commande.php",
            data: {nb:nb,name:name}
        });
    }
    return false;
});

And here is the corresponding PHP code:

<?php
    session_start();
    require_once '../includes/config.inc.php';

    $id_user = $_SESSION['id_user'];
    $quantite = $_POST['nb'];
    $article = $_POST['name'];

    if(isset($quantite)){
        $req = $connection->prepare('INSERT INTO commande_articles(id_user,quantite,article) VALUES(:id_user,:quantite,:article)');
        $req->execute(array(
            'quantite' => $quantite,
            'article' => $article,
            'id_user' => $id_user
            ));
    }   
    else {
        echo('erreur');
    }
?>

javascript php jquery ajax

Answer 1

Answer №1

To establish the variables at a broader scope, consider this approach:

let username, quantity;
$('.btn-circle').on('click', function()
{
     username = $('.quantite').attr('name');
     quantity = $('.quantite').text();
});

Answer 2

To establish the variables at a broader scope, consider this approach:

let username, quantity;
$('.btn-circle').on('click', function()
{
     username = $('.quantite').attr('name');
     quantity = $('.quantite').text();
});

Answer 3

Answer №2

When working with javascript, it's important to remember that variables have function scope. This means that your variable names are contained within an anonymous function and are not accessible outside of it. To make these variables global, simply remove the "var" keyword from their declarations. This will broaden the scope of the variables and allow your code to function properly.

Another, more organized approach would be to declare the variables outside of the anonymous function and then reference them within it. By doing this, you can have better control over the scope of the variables (as mentioned in Siamak's answer above).

Answer 4

When working with javascript, it's important to remember that variables have function scope. This means that your variable names are contained within an anonymous function and are not accessible outside of it. To make these variables global, simply remove the "var" keyword from their declarations. This will broaden the scope of the variables and allow your code to function properly.

Another, more organized approach would be to declare the variables outside of the anonymous function and then reference them within it. By doing this, you can have better control over the scope of the variables (as mentioned in Siamak's answer above).

Dynamic data retrieval with the power of JavaScript and AJAX

Answer №1

Answer №2

Similar questions

Creating an empty input field with a predetermined default output in ReactJS

Does the built-in waiting mechanism in Protractor automatically handle promises?

Are you experiencing problems with JSON formatting?

Closing the JQuery login popup form by clicking on the submit button

Save a newly uploaded image to Github utilizing NodeJS and the Github API

Pressing the non-responsive button automatically chooses the following item

Sending response from controller to AJAX jQuery

Tips for avoiding Netlify's error treatment of warnings due to process.env.CI being set to true

I have received a JSON multi-line string after entering information in a textarea

What is the process for retrieving data from a mysql database and presenting it to the user using PHP?

I am looking to save the session value into the search box of the appTables application by utilizing jQuery

Ensure that any requests to www.domain.com are consistently redirected to domain.com

The start "NaN" is not valid for the timeline in vis.js

The function .css() in jQuery is malfunctioning

Using the Upload feature in ReactJS

Error in PHP email header causing sending issue

When using v-for to render components and <selection>, is there a way to customize it for just one specific instance of the component?

Differences between JavaScript's window.onload and body.onload functionsWhen

Extract distinct values along with their respective counts from an array containing objects

Update user login status in database following a forced browser closure or expiration of session