I am getting the same value when I click on add to cart in my code. It's an ajax response in php

Question

This is the script. When I click on add to cart, it picks only single value from the below code in php file. But when I checked my response it show both values and on my page I am getting all values from database but when I click on add to cart, I am getting same value every time:

<script>
$(document).ready(function() {
    alert("Page loaded");
    jQuery.ajax({
        url: "<?php echo $BASE_URL; ?>daily_menu_dishes.php",
        dataType : "html",
        data:'store_id='+$("#store_id").val()+'&store_name='+$("#store_name").val(),
        type: "POST",
        success:function(data){ 
            //alert(data);
            $("#dily-meal-product-container").html(data);
            //$("#calender_day").html(data);
            //$("#loaderIcon1").hide();
        },
        error:function (){}
    });
});
</script>  

And this is in php:

while($row=mysql_fetch_assoc($result)){
    $html=' <div class="col-xs-6 col-sm-6 col-md-4  first_col" style="width:23.333%">                   
    <div class="thumbnail">
        <img class="img-responsive" src="http://teq-staging.com/maswad-phase2/storeadmin/uploads/dish_images'.'/'.$row['image'].' "  width="250px;min-height:0px ! important;">
        <div class="caption">
            <div class="user">
                <a style="cursor:pointer"> <img class="img-responsive" src="http://app.msdev.in/uploads/cooks/70X70/default-70X70.jpg" alt="Beenu"></a>
            </div>
            <div class="body-content" style="width:175px;">
                <h2> <a>'.$row["dish"].'</a></h2>
                <div class="add-items" style="width:100px;float:right">
                    <span id="add-item-mini-5" class="add-to-cart active" onclick="addToCart();">ADD to Cart</span>
                </div>
                <div style="font-size:20px;width:100px;float:left;mrgin-top:-55px;">
                    <i class="fa fa-inr"></i> '.$row["sell_price"].'
                    <input type="hidden" name="sell_price" id="sell_price" value="'.$row["sell_price"].'">
                    <input type="hidden" name="dish_name" id="dish_name" value="'.$row["dish"].'">
                    <input type="hidden" name="dish_id" id="dish_id" value="'.$row["id"].'">
                </div>
            </div>
            <div class="veg-symbol"><i class="veg-circle"></i></div>
                <!-- <ul class="last-tab">
                    <li id="favourite-5" onclick="addToFavorite(5, this)">
                        <i class="fa fa-heart"></i>Add to Favourite</li>
                    <li onclick="productDetailModal(5)"><i class="open-eye"></i>Know More</li>
                </ul>  -->
            </div>
        </div>
    </div>
</div>';
    echo $html;
}

Answer 1

Your requests are cached. Set cache: false since it is true by default .

jQuery.ajax({
    url: "<?php echo $BASE_URL; ?>daily_menu_dishes.php",
    cache: false,
    dataType : "html",
    data:'store_id='+$("#store_id").val() + '&store_name=' + $("#store_name").val(),
    type: "POST",
    success:function(data){ 
        //alert(data);
        $("#dily-meal-product-container").html(data);
        //$("#calender_day").html(data);
        //$("#loaderIcon1").hide();
    },
    error:function (){}
});