How to send data to PHP in real time?

Question

Talk personal, all right? I’m trying to make a system that calculates budgets depending on the product and its characteristics.

I am using the following code to rescue the data from the database products, in radio Buttons (Pro user have the chance to choose only one at a time)

<p>Selecionar Produto</p> <input type="search" name="" id="">
            <div class="results" id="results">

            <?php

                while ($row = $result->fetch_assoc()){
                echo("<input type='radio' id='radio' name='radio' value=".$row['price'].">");
                echo ("<label for='radio'>". $row['nome']. "</label> <br>");
            }
            ?>

I was trying to use the $Row['price'] no value with the intention of using this value in Javascript to make the calculations, as follows:

function Calc(){
    var price= document.getElementById("radio").getAttribute("value");
    price = price * 2 + 0.2;

    console.log(price);
}

I was not very successful because Javascript did not only use the Value of the selected item but the first Radio. However precise the calculation, as the above feat is done in the back end in PHP and is returned, I know there is how to do with AJAX, but I have no idea how.

Besides, there is another selectbox that should show the colors of the product, according to the product that was selected in the previous Radio Buttons. How to show only the colors of the selected item (I already have a table with a column containing the colors).

Answer 1

There are several problems in the presented code and in the question itself. Several questions are asked, which makes it difficult to know exactly what you expect to receive as an answer. The title does not seem to me anything related to the text of the question. And so on...

As for the HTML

• Don’t forget to close your HTML tags
• Do not repeat widget Ids

To address Javascript não usava o Value apenas do item selecionado e sim do primeiro Radio, need to use $("input[name='radio']:checked").val() to take the value of the selected item given the name of the inputs.

How to make a request ajax should be searched on the site, because there are several questions like that one and that one.

And then create a new question to clarify what you want with

Besides, there is another selectbox that should show the colors of the product, according to the product that was selected in the previous Radio Buttons. How to show only the colors of the selected item (I already have a table with a column containing the colors).

Answer 2

Good morning,

Come on, first to use the ajax you need to do:

$.ajax({
    method: "POST",
    url: "php/calcula-nome-do-arquivo-php-que-vai-executar-sua-tarefa.php",
    data: { token: currentToken }
}) 
.done(function(data) {
    console.log(data);
});

On the line:

data: { token: currentToken }

Note that I passed information to the PHP page Just pick up with the

$_POST['token']

Already in this I caught the output of PHP file

You can use it

exit("resposta-do-php");

In the JS

console.log(data);