Показване на повече входове въз основа на избор в PHP Foreach Loop

Имам PHP Foreach цикъл, който съдържа вход "Количество". Потребителите могат да изберат количество и след това това избрано количество трябва да покаже избрания брой нови входове. Ако избера количество „3“, тогава трябва да се появят 3 нови входа за този артикул. Не забравяйте, че имам forreach цикъл, така че имам множество елементи.

Към момента моят код работи само за показване на новия брой входове само за ПЪРВИЯ елемент. Имам нужда да работи за всеки елемент в цикъла forreach. Вижте моя код по-долу:

foreach($rows as $row) {
                 $appareltype = $row['appareltype'];
                    $apparel = explode(",", $appareltype);
                    foreach($apparel as $datapparel) {
                        ?>
                            <b><? echo $datapparel ?></b><br>
                            Quantity: <select name="quantity[]" class="form-control quantity">
                            <option value="0" selected="selected">0</option>
                            <option value="1">1</option>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                            <option value="6">6</option>
                            <option value="7">7</option>
                            <option value="8">8</option>
                            <option value="9">9</option>
                            <option value="10">10</option>
                            <option value="11">11</option>
                            <option value="12">12</option>
                            <option value="13">13</option>
                            <option value="14">14</option>
                            <option value="15">15</option>
                            <option value="16">16</option>
                            <option value="17">17</option>
                            <option value="18">18</option>
                            <option value="19">19</option>
                            <option value="20">20</option>

                            <div id="text">

                            </div>

                        <?
                    }

            }
                     ?>

jQuery:

<script type="text/javascript">
$("select.quantity").change(function () {
  var str = "";
  var count = Number($("select option:selected").val())
  for (var i = 0; i < count; i++) {
      str += '<div class="oneinput"> <label>' + i
              + "</label> <input name='" + i + "' class='form-control'>"
              + "</div>";
  }

  $("#text").html(str);
});
</script>

javascript php foreach jquery
person Alex    schedule 01.05.2014    source източник

Отговори (2)


arrow_upward
1
arrow_downward

Тук има множество проблеми. Първо, във вашия jQuery използвайте

$(this).find("option:selected").val()

вместо

$("select option:selected").val()

Второ, вие създавате множество div елементи с един и същ идентификатор („текст“). Можете да имате ID само веднъж в DOM. Отървете се от ID на този елемент. Може да го замените с някакъв разпознаваем клас, ако искате.

И така, как да инжектираме новото съдържание в divs сега? Използвайте $(this).next().html(str);

Накрая затворете елемента select преди div.

…
    <option value="20">20</option>
</select>
<div class="something"></div>
person Patrick Q    schedule 01.05.2014
comment
Перфектно! Благодаря ви много за вашата помощ. Работи страхотно :) - person Alex; 02.05.2014

arrow_upward
1
arrow_downward

Първо трябва да затворите </select>. Тогава не използвайте ID селектор за текста, тъй като той трябва да бъде препратен само веднъж. Накрая използвайте $(this), за да направите своя jQuery относителен.

<?php
$rows = array(array('appareltype'=>'hat,gloves,earmuffs,socks,jumper'));
foreach($rows as $row) {
                 $appareltype = $row['appareltype'];
             echo $appareltype;
                   $apparel = explode(",", $appareltype);
                print_r($apparel);
                foreach($apparel as $datapparel) {
                    ?>
                        <b><? echo $datapparel ?></b><br>
                        Quantity: <select name="quantity[]" class="form-control quantity">
                        <option value="0" selected="selected">0</option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                        <option value="16">16</option>
                        <option value="17">17</option>
                        <option value="18">18</option>
                        <option value="19">19</option>
                        <option value="20">20</option>
</select>
  <div class="text">

</div>

                    <?
                }

        }
                 ?>
                     <script src="http://code.jquery.com/jquery-1.11.0.js"></script>
                     <script type="text/javascript">
$("select.quantity").change(function () {
  var str = "";
  //var count = Number($(this).("select option:selected").val())
  var count = Number($(this).val());
  for (var i = 1; i <= count; i++) {
      str += '<div class="oneinput"> <label>' + i
              + "</label> <input name='" + i + "' class='form-control'>"
              + "</div>";
  }

  $(this).next(".text").html(str);
});
</script>
person mustbebuilt    schedule 01.05.2014
comment
Благодаря ти за помощта! - person Alex; 02.05.2014
comment
@mustbebuilt Как това не е точно това, което казах? - person Patrick Q; 02.05.2014
comment
@PatrickQ - да, много подобно, но използвах малко по-различен jQuery. - person mustbebuilt; 02.05.2014