Если ячейка таблицы равна 100, то

Question

У меня есть следующая таблица, которая использует javascript для вычисления суммы ячеек. Когда входы вводятся в javascript, суммирует общее количество и отображает его в TD id = "totalSum".

В конечном счете, мне нужно иметь его где, когда totalSum равно 100, а затем выполнить php-код.

Как получить php для чтения данных в totalSum, а затем выполнить php, когда он равен 100?

Спасибо за любую помощь.

HTML-

<table id="mytable" width="394"> 
    <colgroup> 
     <col style="width: 50px;"> 
     <col> 
     <col style="width: 60px;"> 
     <col style="width: 110px;"> 
    </colgroup> 
    <tbody> 
     <tr> 
      <th width="130" height="43"></th> 
      <th width="52">Weight Select</th> 
      <th width="181">New P</th> 
     </tr> 
     <tr> 
      <td align="center" width="130">&nbsp;</td> 
      <td align="center"> 
       <input type="text" size="2" value="1" id="qty_item_1" name="sum" > 
      </td> 
      <td align="center" id="total_item_1"></td> 
     </tr> 
     <tr> 
      <td align="center" width="130"></td> 
      <td align="center" > 
       <input type="text" size="2" value="1" id="qty_item_2" name="sum" > 
      </td> 
      <td align="center" id="total_item_2"></td> 
     </tr> 
     <tr class="tr"> 
      <td align="left" colspan="1"><strong>Grand Total:</strong></td> 
      <td width="11" align="left" id="totalSum"></td> 
     </tr> 
    </tbody> 
</table> 

Javascript-

<script type="text/javascript"> 
    var bIsFirebugReady = (!!window.console && !!window.console.log); 
    $(document).ready(function(){ 
     // update the plug-in version 
     $("#idPluginVersion").text($.Calculation.version); 

           /* 
           $.Calculation.setDefaults({ 
           onParseError: function(){ 
           this.css("backgroundColor", "#cc0000") 
           } 
           , onParseClear: function(){ 
           this.css("backgroundColor", ""); 
           } 
           }); 
           */ 
     // bind the recalc function to the quantity fields 
     $("input[id^=qty_item_]").bind("keyup", recalc); 

     // run the calculation function now 
     recalc(); 

     // automatically update the "#totalSum" field every time 
     // the values are changes via the keyup event 
     $("input[name^=sum]").sum("keyup", "#totalSum"); 

     // automatically update the "#totalAvg" field every time 
     // the values are changes via the keyup event 
     $("input[name^=avg]").avg({ 
      bind:"keyup" 
      , selector: "#totalAvg" 
       // if an invalid character is found, change the background color 
      , onParseError: function(){ 
       this.css("backgroundColor", "#cc0000") 
      } 
      // if the error has been cleared, reset the bgcolor 
      , onParseClear: function(){ 
       this.css("backgroundColor", ""); 
      } 
     }); 

     // automatically update the "#minNumber" field every time 
     // the values are changes via the keyup event 
     $("input[name^=min]").min("keyup", "#numberMin"); 

     // automatically update the "#minNumber" field every time 
     // the values are changes via the keyup event 
     $("input[name^=max]").max("keyup", { 
      selector: "#numberMax" 
      , oncalc: function (value, options){ 
       // you can use this to format the value 
       $(options.selector).val(value); 
      } 
     }); 

     // this calculates the sum for some text nodes 
     $("#idTotalTextSum").click(function() { 
      // get the sum of the elements 
      var sum = $(".textSum").sum(); 

      // update the total 
      $("#totalTextSum").text("$" + sum.toString()); 
     }); 

     // this calculates the average for some text nodes 
     $("#idTotalTextAvg").click(function() { 
      // get the average of the elements 
      var avg = $(".textAvg").avg(); 

      // update the total 
      $("#totalTextAvg").text(avg.toString()); 
     }); 

    }); 

    function recalc(){ 
     $("[id^=total_item]").calc(
      // the equation to use for the calculation 
      "qty * price/100", 
      // define the variables used in the equation, these can be a jQuery object 
     { 
      qty: $("input[id^=qty_item_]"), 
      price: $("[id^=price_item_]") 
     }, 

     // define the formatting callback, the results of the calculation are passed to this function 
     function (s){ 
      // return the number as a dollar amount 
      return "" + s.toFixed(2); 
     }, 
      // define the finish callback, this runs after the calculation has been complete 
      function ($this){ 
       // sum the total of the $("[id^=total_item]") selector 
       var sum = $this.sum(); 
       $("#grandTotal").text(
        // round the results to 2 digits 
        "" + sum.toFixed(2) 
       ); 
      } 
     ); 
    } 
</script> 

Answer 1

Ваш вопрос не показывает, как вы вызываете суммированием значений, или проверить значение ячейки id="totalSum", так что в моем решении я добавил кнопку id="mybutt", чтобы сделать это.

Working jsFiddle here

Все, что вам нужно знать, в приведенном выше jsFiddle, и ниже в разделе обсуждения some_php_file.php. Ниже следует описание того, как работает код, если вам это нужно.

---

1. Во-первых, мы получаем совокупность всех ячеек таблицы, где id начинается с qty_item:

   $('[id^=qty_item_]')

2. Далее мы перебирать эту коллекцию с помощью метода .each:

   var ttl = 0;
$('[id^=qty_item_]').each(function() {
        str = $(this).val();
        ttl += Number(str);
});

3. Затем вводят в общей сложности в клетку с id="totalSum"

   $('#totalSum').text(ttl).trigger('change');

Обратите внимание, что мы запускаем событие change на том же элементе (ячейке таблицы). Это сразу же запускает этот код:

$('#totalSum').change(function() { 
    var sum = $(this).text(); 
    alert('Value: ' + sum); 
    if (Number(sum) > 99) { 
     alert('Value > 100. AJAX will begin, but cannot finish because jsFiddle cannot do ajax. Just look at syntax.'). 
     $.ajax({ 
      type: "POST", 
      url: "some_php_file.php", 
      data: 'myTotalSum='+sum, 
      success:function(somedata){ 
       alert(somedata); 
      } 
     }); 
    } 
}); 

---

В блоке кода AJAX, обратите внимание на URL-адрес, который указан. В этом примере на сервере должен существовать файл PHP с тем же именем (в той же папке, что и ваш код HTML). Он получит информацию, отправленную через AJAX в переменной POST под названием myTotalSum.

Как только у вас есть этот номер, ваш PHP-файл может вставить его в базу данных. Если вы хотите, вы даже можете отправить файл PHP обратно на веб-страницу (он поступает в функцию кодового блока AJAX). Обратите внимание, что javascript на веб-странице продолжает обработку без ожидания для завершения страницы PHP. Если вам нужно javascript, чтобы подождать, тогда вы должны вставить async: false, где-то рядом с этим блоком кода.

Чтобы увидеть это на самом деле работает, создайте текстовый файл с этим именем и это содержание:

some_php_file.php

<?php 
    $theSum = $_POST['myTotalSum']; 
    $r = '<h2>Mr. PHP received this number:</h2><h1>' .$theSum. '</h1>'; 
    echo $r; 

В echo в файле PHP отправляет содержимое переменной $r назад в кодовый блок AJAX, где он принимается в функции success. Важно: эти данные должны быть рассмотрены здесь, а не где-то еще. Он не будет существовать вне функции успеха.

Для доступа полученных данных за пределами функции успеха, придерживаться принятых данных в элемент, такой как скрытый input элемент, например:

success:function(mydata){ 
    $('#a_hidden_input_element').val(mydata); 
} 

---

Here is an SO post с некоторыми дополнительными примерами AJAX кода.