how to return php variable to Jquery function to be used to multiply values

Question

Trying to have several checkboxes multiply and add where there are multiple products. would it be possible to use a for statement in jquery against the number of rows in a database or have it run without it?

I've reduced the code i had to a compact version to add up checkboxes and multiply against a multiplier that is a POST from a previous page. now this script won't run for any of the products and wandering what could be used to bridge the problem between client side and server side script. I'm confused about the method needed to use a php variable in a jquery function. I thought of use an onclick to call function for a checkbox clicked but im trying to run this on DOM ready. If anyone can perhaps tell me in the simplest terms how this may be possible I will happily do more research.

<?php
//CONNECTION, QUERY AND MISC ///

$count = mysqli_num_rows($result);
$i = 1;

while ($row = mysqli_fetch_assoc($result)) 
{
    $kilo1 = $row['kilo1'];
    $kilo2 = $row['kilo2'];

    $price1 = $row['price1'];
    $price2 = $row['price2'];
    $price3 = $row['price3'];
    $price4 = $row['price4'];

    $multiplier = 2;
    $qri = "qr"."$i";
    $userdaily = "userdaily"."$i";
    $usertotal = "usertotal"."$i";
    $pricef1 = "price1"."$i";
    $pricef2 = "price2"."$i";

    echo "<form enctype='multipart/form-data' name='contactform' method='POST' action='something.php'>";
    echo "<input type='hidden' name='multiplier' id='multiplier' value='$multiplier'>";
    echo "<input type='checkbox' name='checkbox1' id='$qri' value='$price1'>";
    echo "<input type='checkbox' name='checkbox2' id='$qri' value='$price2'>";
    echo "<input type='checkbox' name='checkbox3' id='$qri' value='$price3' 
                 class='insure'>";
    echo "<input type='checkbox' name='checkbox4' id='$qri' value='$price4' 
                 class='insure'>";
    echo "<input type='checkbox' name='checkbox5' id='$qri' value='$kilo1' 
                 class='kilo'>";
    echo "<input type='checkbox' name='checkbox6' id='$qri' value='$kilo2' 
                 class='kilo'>";

    /////TOTALS VISIBLE AND HIDDEN/////
    echo "<span id='$userdaily'></span>";
    echo "<span id='$usertotal'></span>";
    echo "<input type='hidden' name='pricef1' id='$pricef1' value=''>";
    echo "<input type='hidden' name='pricef2' id='$pricef2' value=''>";
    echo "<input type='submit'>";

    if($i%4==0 || $i == $count) echo '<br>';

    $i++;    
}
?>

<script>
$(function() 
{
  $("input.kilo").change(function() 
  {
    $("input.kilo").not(this).prop("checked", false);
  });

  $("input.insure").change(function() 
  {
    $("input.insure").not(this).prop("checked", false);
  });

  $(document).ready(function() 
  {
    //get the values of the selected options
    var counter = parseInt("<?php echo $count;?>");
    for (i = 1; i <= counter; i++)
    {
      let v = $.map($("input[id^='qr+i+']:checked"), function(t) 
      {
        return parseFloat($(t).val());
      }); 

      let s = v.reduce((a, b) => a + b); 
      //sum them up to a daily total
      console.log(v);

      $("#<?php echo $userdaily;?>").text('R' + s + '/day');    
      $("#<?php echo $usertotal;?>").text('R' + s * 
      parseFloat($("#multiplier").val()) + '/day');
      $("#<?php echo $pricef1;?>").val(s);
      $("#<?php echo $pricef2;?>").val(s * parseFloat($("#multiplier").val()));
    }
  });
});     
</script>

I have a list of product each with a daily total and a total of the number of days, each product has completely different prices. I tried to create this in a fiddle and it works find without the use of variables, I realise that Jquery and php are different in their uses and I'm not sure how to work around this.

mxing PHP and JS is a bad idea - they're executed differently and thus, can result in unexpected behaviour. Better to use hidden DOM element and pass data-tags to the JS — treyBake, Jun 24 '19 at 21:33
would it be possible to use the number of rows from the database in Jquery to make a loop that changes the value of i to a specific number? i.e the number of rows? — Websimpleton, Jun 24 '19 at 21:39
It is sort of what i was trying to do but I had no idea how except perhaps `var counter = parseInt()` then `for (i = 1; i <= counter; i++)` then perhaps `let v = $.map($("input[id^='qr+i+']:checked"), function(t)` — Websimpleton, Jun 24 '19 at 21:47

score 0 · Accepted Answer · answered Jun 25 '19 at 00:59

0

As treyBake mentionned, if you need to pass information from PHP to jQuery back to PHP and so forth, use hidden DOM elements and make Ajax requests.

This will also allow you to update your data in real time.

Okay so for instance you can hide your number count in a hidden input

<input type="hidden" value="<?php echo $count;?> " name="countrows" id="countrows">

Now you can retrieve in your jQuery :

var counter = $("#countrows").val();

Get value of checked checkbox with is.checked :

var x = $("#checkbox").is(":checked");

answered Jun 25 '19 at 00:59

I hadn't thought of using it like that, thank you I will remember this for the next instance i need to do something like this. – Websimpleton Jun 26 '19 at 11:31
why did you mention `var x = $("#checkbox").is(":checked");` as i currently use `$("input.kilo").change(function() { $("input.kilo").not(this).prop("checked", false); }); ` in order to select specific checkboxes because not all option can be selected, I guess i could use a radio button but unfortunately, I have no choice but to use a checkbox. – Websimpleton Jun 26 '19 at 13:09
Each checkbox also has different values on top of that – Websimpleton Jun 26 '19 at 13:18
@Websimpleton : There are several ways to get the value of a checkbox that is checked. Does your method work? – Jun 26 '19 at 15:40
Currently no because I'm using the id, however for each row the id changes in increment i,e qr1, qr2 qr3 etc so to select them i was attempting something like `$(`#qr` + i +)` where i is used in `for (i = 1, i <=counter, i++)` – Websimpleton Jun 26 '19 at 19:26
@Websimpleton : Sorry for late reply. I got caught up in time. I reviewed your codes and you're not handling the `type='checkbox'` well. You need to give all your checkboxes the same name and let PHP know its an array `name="checkbox_list[]"` – Jun 28 '19 at 18:19
Have a look here. A similar question was asked in the past : https://stackoverflow.com/questions/4997252/get-post-from-multiple-checkboxes – Jun 28 '19 at 18:25

how to return php variable to Jquery function to be used to multiply values

1 Answers1