javascript - Multiple Weight based Pricing for a product in codeigniter using ajax

360

I have made a shopping cart website using ajax and Codeigniter. The products is added to cart without the page load when the button add to cart is clicked. I was displaying single net weight for the product, but now i have changed it to multiple netweight for the same product. but add to cart is not working for the product which has multiple netweight. because i am not getting the logic to send the data of a selected dropdown list.

<section >
<?php 
foreach($todays_offers as $offer)
{  
  if(!empty($offer))
  {
    $product_id=$offer->id;
    $product_name=$offer->product_name;
    $image=$offer->image;
    $price=$offer->mrp;
    $our_price=$offer->retail_price; 
    $brand=$offer->brand;
    $pro_quantity=$offer->stock;
    $gst=$offer->gst;
    $stock=$offer->stock;
  }
?>
  <div >
    <div >
      <div >
        <a href="#">
          <img src='<?php echo base_url("images/$image")?> ' alt="<?php echo $product_name?>" >
        </a>
      </div>
    </div>
    <div >
      <div >
        <?php echo ucfirst($brand); ?>
      </div>
      <div >
        <a href="#"><?php echo $product_name ?></a>
      </div>                           

<?php
  $sql ="SELECT * FROM materials where product_name='".$product_name."' ORDER BY retail_price ASC";
  $query1 = $this->db->query($sql);
  $rowCount="SELECT * FROM materials where product_name='$product_name'";
  $query2 = $this->db->query($rowCount);
  if (!empty($query1)) 
  {
    if ($query2->num_rows() > 1) 
    {
      echo "<select name='netweight' id='netweight' onchange='ItemSelected(this)'>"; 
      foreach ($query1->result() as $row) 
      {
        $net = $row->packing; 
        $retail_price = $row->retail_price; 
?>
      <option id="<?php echo $row->id;?>" value="<?php echo $net;?>" ><?php echo $net .' - Rs. '. $retail_price?> </option>
  <?php 
      }
      echo "</select>";    

    }
    else
    {
      $net_weight=$offer->packing;
      echo "<span>$net_weight</span>";
    }

  }
  ?>
      <div >
        <span > <i aria-hidden="true"></i> <?php echo  $our_price ?></span>
        <?php 
        if($our_price<$price)
        { 
        ?>
        <span >MRP <i aria-hidden="true"></i><?php echo $price ?></span>
        <?php 
        } 
        ?>

      </div>
      <div > <input type="number" value="1" min="1" max="10" name="quantity"  id="<?php echo $product_id ?>" /></div>
      <div >
        <div >


        <?php 
        if($pro_quantity>0)
        {
        ?>    
          <a type="button" title="Add to Cart" name="add_cart" data-netweight="<?php echo $net_weight ?>" data-image="<?php echo $image ?>" data-productname= "<?php echo $product_name ?>" data-price="<?php echo $price?>" data-productid="<?php echo $product_id ?>" data-brand="<?php echo $brand ?>"data-gst="<?php echo $gst ?>" data-stock="<?php echo $stock ?>" >add<span ></span></a>
        <?php 
        }
        else
        {                                        
         echo "<span class='label label-danger'>Out of stock</span>";
        }  

        ?>
        </div>
      </div>
    </div>
  </div>
<?php 
}
?>
</section>

ajax code

$('.add_cart').click(function() {    
    var product_id = $(this).data("productid");    
    var product_name = $(this).data("productname");
    var product_price = $(this).data("price");
    var net = $(this).closest(".netweight").val();
    alert(net);
    var image=$(this).data("image");
    var brand=$(this).data("brand");
    var gst=$(this).data("gst");
    var stock=$(this).data("stock");
    var quantity = $('#' + product_id).val();  
    if(quantity != '' && quantity > 0)
    {
        $.ajax({
            url:"<?php echo base_url(); ?>shopping_cart/add",
            method:"POST",
            data:{product_id:product_id, product_name:product_name, product_price:product_price, quantity:quantity,net:net,image:image,brand:brand,gst:gst,stock:stock },
            success:function(data)
            {
                 $.alert(product_name, {
                        title: 'Success product is added to cart',
                        closeTime: 6 * 1000,
                        autoClose: true,

                    });
             $('#cart_details').html(data);

             $('#' + product_id).val(1);
            }
        });
    }
    else
    {
        alert("Please Enter quantity");
    }
});

I just want send the selected data with id to the cart this is how it displays

737

Answer

Solution:

Your problem is, you dont pick up the value from your selected option and you dont set a value at all.

You should post your entire list item partial here - because i need the ancestor of the select elementnetweight

a possible solution could be :

add a value field to your option element like (be aware - i don't know your desired value, so i took$row->net instead)

<option id="<?php echo $row->id; ?>" value="<?=$row->net; ?>">
    <?php echo $net .' - Rs. '. $retail_price?>               
</option>

and of course in your js function you have to change yournet Variable accordingly$(this).closest(".netweight").val() might not work - because i need the correct ancestor - so pls post your entire view here.

$('.add_cart').click(function () 
{
    var product_id = $(this).data("productid");
    var product_name = $(this).data("productname");

    var product_price = $(this).data("price");
    var net = $(this).closest(".product-right").find(".netweight").val();
    var image = $(this).data("image");
    var brand = $(this).data("brand");
    var gst = $(this).data("gst");
    var stock = $(this).data("stock");
    var quantity = $('#' + product_id).val();


    if (quantity != '' && quantity > 0)
    {
        $.ajax({
            url: "<?php echo base_url(); ?>shopping_cart/add",
            method: "POST",
            data: {product_id: product_id, product_name: product_name, product_price: product_price, quantity: quantity, net: net, image: image, brand: brand, gst: gst, stock: stock},
            success: function (data)
            {
                $.alert(product_name, {
                    title: 'Success product is added to cart',
                    closeTime: 6 * 1000,
                    autoClose: true,

                });
                $('#cart_details').html(data);

                $('#' + product_id).val(1);
            }
        });
    } 
    else
    {
        alert("Please Enter quantity");
    }
});

People are also looking for solutions to the problem: php - Laravel count childs of a relation

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.