Note that there are some explanatory texts on larger screens.

plurals
  1. POjavascript output by php for multiple items
    primarykey
    data
    text
    <p>I've created a cart for users to put items one wants to buy. Each item has its own id <code>value</code>, all prices and general info coming from MySql db. I'm outputting javascript to count quantity and final price with discounts for each model individually. Now I want to rebuild counting and it's getting hard to maintain my php code.</p> <p>My questions are: 1 - what is the best practice to create JS carts with php. 2 - is there a way to simplify my code or it's better to rewrite it from 0.</p> <pre><code> foreach ($_SESSION["gids"] as $key =&gt; $value){//for each model in session add HTML data echo "\n\t\t&lt;hr&gt;&lt;div class=\"row\"&gt;"; echo "\n\t\t\t&lt;div class=\"2u\"&gt;";//Main photo div echo "\n\t\t\t\t&lt;span class=\"image image-full cartImg\" id=\"caseShow\"&gt;"; echo "\n\t\t\t\t\t&lt;img src=\"cases/cartPics/".$value.".jpg\" id=\"caseImg\" alt=\"Чехол для iPhone 5 с орнаментом этно чехол вышиванка на iPhone\" /&gt;"; echo "\n\t\t\t\t&lt;/span&gt;"; echo "\n\t\t\t&lt;/div&gt;"; echo "\n\t\t\t&lt;div class=\"2u\"&gt;";// name and model echo linkSet('menu', 'name'); echo "\n\t\t\t\t&lt;strong&gt;"; echo catSet('cases', $value, 'name'); echo "\n\t\t\t\t&lt;br /&gt;"; echo catSet('cases', $value, 'model'); echo "\n\t\t\t&lt;/strong&gt;&lt;/div&gt;"; echo "\n\t\t\t&lt;div class=\"2u\" id=\"casePriceDiv\"&gt;";//price for one item echo linkSet('menu', 'priceName'); echo "\n\t\t\t\t&lt;br /&gt;&lt;span class=\"casePriceCart\"&gt;"; echo price('cases', $value); echo "\n\t\t\t&lt;/span&gt;&lt;/div&gt;"; echo "\n\t\t\t&lt;div class=\"2u\"&gt;";//quantity echo linkSet('menu', 'buyQty'); echo "\t\t\t\t&lt;br /&gt;&lt;br /&gt;"; echo "\n\t\t\t\t&lt;div&gt;"; echo "\n\t\t\t\t\t&lt;label for=\"qty\"&gt;&lt;abbr title=\"Quantity\"&gt;&lt;/abbr&gt;&lt;/label&gt;"; echo "\n\t\t\t\t\t&lt;button class=\"cartOpt cartOpt_".$value."\" onclick=\"modify_qty_".$value."(-1)\"&gt;&lt;strong&gt;&lt;&lt;/strong&gt;&lt;/button&gt;"; echo "\n\t\t\t\t\t&lt;input class =\"qty\" id=\"qty_".$value."\" value=\"1\" disabled=\"disabled\"/&gt;"; echo "\n\t\t\t\t\t&lt;button class=\"cartOpt cartOpt_".$value."\" onclick=\"modify_qty_".$value."(1)\"&gt;&lt;strong&gt;&gt;&lt;/strong&gt;&lt;/button&gt;"; echo "\n\t\t\t\t&lt;/div&gt;"; echo "\n\t\t\t&lt;/div&gt;"; echo "\n\t\t\t&lt;div id=\"casePriceDiv\" class=\"2u\"&gt;";//price of quantity chosen echo linkSet('menu', 'buySum'); echo "\n\t\t\t\t - "; echo linkSet('menu', 'currency'); echo "\n\t\t\t\t&lt;br /&gt;"; echo "\n\t\t\t\t&lt;strong&gt;"; echo priceDisc('cases', $value); echo "\n\t\t\t\t&lt;/strong&gt;"; echo "\n\t\t\t\t&lt;div id=\"sale2discCart\" class=\"sale2discCart_".$value."\"&gt;&lt;/div&gt;"; echo "\n\t\t\t&lt;/div&gt;"; print "&lt;script&gt; function modify_qty_".$value."(val) { var qty = document.getElementById('qty_".$value."').value; var new_qty = parseInt(qty,10) + val; if (new_qty &lt; 1) { new_qty = 1; }else if(new_qty &gt; 5){ new_qty = 5; } document.getElementById('qty_".$value."').value = new_qty; document.getElementById('qtyForm_" .$value."' ).value = new_qty; return new_qty; }; $(document).ready(function(){ var itemPrice = 0; $('#itemPrice_".$value."').each(function(){ itemPrice += parseInt($(this).text(),10); $('.cartOpt_".$value."').click(function(){ var new_qty = ($('#qty_".$value."').val()); var totalItemPrice = new_qty * itemPrice; $('#itemPrice_".$value."').html(totalItemPrice); productsInCart(); }); }); function productsInCart(){ var inCart = 0; var finalPrice; $('.qty').each(function(){ inCart += parseInt($(this).val()); }); if(inCart&lt;2){ var total = 0; $('.itemPrice').each(function(){ total += parseInt(this.innerHTML); }); $('#overallPrice').text(total); document.getElementById('priceForm_" .$value."' ).value = total; $('.itemPrice').css('text-decoration','none').addClass; $('#sale2discCart').empty(); $('.totalDisc').hide(); finalPrice = total; }else{ var totalNet = 0; var total = 0; var totalDisc =0; var sale2disc = \"-30%\"; var sale2price = $('.itemPrice'); var new2Price = 0; $('#itemPrice_".$value."').each(function(){ new2Price += parseInt(this.innerHTML)* 0.7; new2Price = Math.round(new2Price); document.getElementById('priceForm_" .$value."' ).value = new2Price; $(this).css('text-decoration','line-through').addClass; $(this).css('letter-spacing','1px').addClass; $('.sale2discCart_".$value."').html(sale2disc); $('.sale2discCart_".$value."').append('&lt;br /&gt;&lt;br /&gt;&lt;span style=\"text-decoration:line-through\"&gt;'); $('.sale2discCart_".$value."').append(new2Price); $('.sale2discCart_".$value."').append('&lt;/span&gt;&lt;br /&gt;'); }); $('.itemPrice').each(function(){ totalNet = parseInt(this.innerHTML); totalDisc += totalNet * 0.3; total += totalNet * 0.7; total = Math.round(total); totalDisc = Math.round(totalDisc); finalPrice = total; }); $('#overallPrice').text(total); $('.totalDisc').show(); $('#totalDisc').text(totalDisc).append('.00'); } var delCost = $('.delCost').val(); finalPrice = parseInt(finalPrice, 10) + parseInt(delCost, 10); document.getElementById('finalPrice' ).value = finalPrice; } productsInCart(); }) &lt;/script&gt;"; echo "\n\t\t\t&lt;div class=\"2u\"&gt;"; echo linkSet('menu', 'caseDel'); echo "\t\t\t\t\t&lt;br /&gt;&lt;br /&gt;"; echo "\n\t\t\t\t&lt;label for=\"del\"&gt;&lt;abbr title=\"Delete\"&gt;&lt;/abbr&gt;&lt;/label&gt;"; echo "\n\t\t\t\t&lt;form name =\"unsetCase\" method =\"POST\" action = \"includes/unsetCartModel.php\"&gt;"; echo "\n\t\t\t\t&lt;button class=\"cartOpt\" name=\"unsetCase\" type=\"submit\" value=".$key."&gt;&lt;strong&gt;X&lt;/strong&gt;&lt;/button&gt;"; echo "\n\t\t\t\t&lt;/form&gt;"; echo "\n\t\t\t&lt;/div&gt;"; echo "\n\t\t&lt;/div&gt;\n\n"; }; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload