показать отмеченный текст не работает, когда я нажимаю на новую вкладку

#php #jquery #ajax #activerecord #checkbox

#php #jquery #ajax #activerecord #флажок

Вопрос:

Я пытаюсь получить текст с проверенным значением в одном div.

введите описание изображения здесь

По умолчанию Tiffen активен, поэтому, когда я нажимаю на изображения idly и puri, текст этого изображения появляется и отображается в списке выбранных продуктов

Но когда я нажимаю на Обед в меню слева, как показано на рисунке; у них есть такая еда, как: творог и рыба, когда я проверяю их, текст не появляется, но когда я перехожу на вкладку tiffen и выполняю любую проверку, значения обеда отображаются с tiffen

Это мои коды:

Вот мой код раздела:

 <section>
<div class="products">
<div class="container">
<div class="col-md-3 rsidebar">
<div class="related-row">
    <h4 class="text-center">Food Menu</h4> 
    <ul class="nav nav-pills nav-justified">
        <li role="presentation" class="active"><a href="#tiffin" aria-controls="home" role="tab" data-toggle="tab"> Tiffin </a></li>
        <li role="presentation"><a href="#lunch" aria-controls="home" role="tab" data-toggle="tab"> <i></i> Lunch </a></li>
        <li role="presentation"><a href="#dinner" aria-controls="home" role="tab" data-toggle="tab"> Dinner </a></li>
    </ul>       
</div>
<div class="related-row" id="FoodSelected">
    <h4 class="text-center">Food Selected</h4> 
    <ul class="nav nav-pills nav-justified">
        <li class="active"><a id="selectedfood"></a></li>
    </ul>    
</div>
</div>
<form id="FoodForm">
<div class="tab-pane active" id="tiffin">
    <div class="products-row">
        <?php $tq=$conn->query("select * from os_dish where dish_status=1 and dish_type=1 order by id_dish ASC");
            while ($tiffen = $tq->fetch_assoc()) {
            ?>  
            <div class="col-md-3"> 
                <div class="foodmenuform row text-center">
                    <input type="checkbox" id="<?php echo $tiffen['dish_name'];?>" class="Foodmenu" value="<?php echo $tiffen['dish_name'];?>" name="tifeen[]" hidden>
                    <label for="<?php echo $tiffen['dish_name'];?>"><img src="img/dish/<?php echo $tiffen['dish_image']; ?>" class="img img-responsive" /></label>
                    <h3><?php echo $tiffen['dish_name'];?></h3>
                </div>
            </div>
        <?php }  ?>
    </div>
</div>    
<div class="tab-pane" id="lunch">
    <div class="products-row">
        <?php $lq=$conn->query("select * from os_dish where dish_status=1 and dish_type=2 order by id_dish ASC");
            while ($lunch = $lq->fetch_assoc()) {
            ?>  
            <div class="col-md-3"> 
                <div class="foodmenuform row text-center">
                    <input type="checkbox"  id="<?php echo $lunch['dish_name'];?>" class="FoodMenu" value="<?php  echo $lunch['dish_name'];?>" name="lunch[]" hidden>
                    <label for="<?php echo $lunch['dish_name'];?>"><img src="img/dish/<?php echo $lunch['dish_image']; ?>" class="img img-responsive" /></label>
                    <h3><?php echo $lunch['dish_name'];?></h3>
                </div>
            </div>
        <?php }  ?>
    </div>
</div>
<button id="FoodSubmit" class="btn btn-primary btn-lg btn-block">Submit Food Menu</button>
</form>
</section>
  

И вот мой код скрипта:

 <script type="text/javascript" language="JavaScript">
$(".Foodmenu").click(function(){
var checkedFood = $('input[type=checkbox]:checked').map(function(){
    console.log($('input[type=checkbox]:checked').serialize());
    return $(this).attr('value');
}).get().join("<br>");
$("#selectedfood").html(checkedFood);
});
</script>
  

Комментарии:

1. Смотрите консоль браузера, там должна отображаться ошибка..

2. @Shaggy даже в консоли только значения tiffen поступают вхолостую, а значения puri lunch не поступают, когда они выбраны.

Ответ №1:

Я получил решение, весь код записан, но ошибка в проблеме с именем класса, которую я дал небольшому FoodMenu istead Foodmenu