Выбор добавляемого элемента в таблице через jQuery - PullRequest
0 голосов
/ 07 марта 2020

Я пытаюсь выбрать элемент div, который имеет 2 дочерних элемента. Они добавляются, как вы можете видеть в коде ниже. Я пытался часами без какого-либо успеха. Как бы я go собирался выбрать div с ".input-form", и это дети ??

        <div class="row">
          <div class="col-md">
            <h1 class="m-5">Our Shoes</h1>
            <table class="shoe-table">
            </table>
          </div>
        </div>

и мой код js:

$(document).ready(function() {
  let $table = $(".shoe-table");
  let $inputForm = $(".input-form"); //This is not working....

  fetch("shoes.json")
    .then(resp => resp.json())
    .then(data => {
      let shoes = data.shoes;
      console.log(shoes)
      let rows = [1, 2, 3];
      let shoeCard = "";
      let counter = 0;
      rows.forEach(row => {
        shoeCard += "<tr>";
        for (let index = 0; index < 4; index++) {
          console.log(shoes[counter].image);

          shoeCard += "<td class='card text-center'>" + "<img class='card-img-top' src=" + shoes[counter].image + " alt='Card image cap'>" +
            "<h5 class='card-title'>" + shoes[counter].name + "</h5>" +
            "<p class='card-text'>kr " + shoes[counter].price + "</p>" +
            "<button id='orderNow' class='btn btn-outline-dark'>ORDER NOW</button>" +
            "<div class='input-form'><input type='number' placeholder='Choose quantity' min=0 max=10><br>" +
            "<button class='btn-add-to-cart' disabled='disabled'>ADD TO CART</button>"
          "</div>"
          "</td>";
          counter++;
        }
        shoeCard += "</tr>";
      });
      $table.append(shoeCard);
    })
    .catch(err => console.error(err));

  $("body").delegate("#orderNow", "click", function() {
    console.log("FUNKAR");
    $inputForm.toggle();
  });
});
...