cara set data jadi kosong lgi gimana stlh appendchild data

cara pertama saya menggunakan DOM createElement dan berhasil tp setiap di klik jd double data, cara kedua saya menggunakan variable content += biasa buat ngerender ke html biasa tapi anehnya data nya keluar cuma data yang terahkir, saya lagi bikin sistem search pk firebase saya ga nemu validasinya temen" bisa bantu mungkin..


// cara pertama
function renderProducts(doc) {

      var div = document.createElement('div')
      var h3  = document.createElement('h3')
      var p   = document.createElement('p')
      var a   = document.createElement('a')

      div.setAttribute('class', 'column is-one-third')
      h3.setAttribute('class', 'title')
      p.setAttribute('class', 'subtitle price')
      a.setAttribute('class', 'link')
      a.setAttribute('href', doc.data().url)
      a.setAttribute('target', '_blank')

      h3.textContent = doc.data().title
      p.textContent  = doc.data().price
      a.textContent  = doc.data().url)

      div.appendChild(h3)
      div.appendChild(p)
      div.appendChild(a)

      var products = productsList.appendChild(div)

     }

// cara kedua
function renderProducts(doc) {

        var el = document.getElementsByClassName('columns')[0]
        var _content = ''

  _content +=
      "<div class='column is-one-third'>" +
      "<h3 class='title'>"+ doc.data().title + "</h3>" +
      "<img class='image' src=" + doc.data().img + ">" +
      "<p class='subtitle price'>"+ doc.data().price + "<img id='dollar-tag'
       src='assets/images/dollar-tag.png'>" + "</p>" +
      "<a class='link' href="+ doc.data().url + "target='_blank'>" + 'There is link' + "</a>" +
      "</div>"

       el.innerHTML = _content

     }

avatar reihanagamsk
@reihanagamsk

125 Kontribusi 41 Poin

Diperbarui 6 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

udah solved gan :D, ternyata begini caranya, saya nemu dua cara, yg pertama : saya cek bagian parent nya, kalo productsList.appendChild(div) ga null alias ada saya removeChild, ini berhasil tapi dpt error di console.log walaupun jln tpi sy kurang puas, Nah, yang kedua ini yg ga tricky lah istilah nya, saya kasih class bagian parent kedua di div nya terus milih pk document.querySelectorAll() di forloop terus di remove()

 function renderProducts(doc)
 {

  // cara kedua
  var productListings = document.querySelectorAll('.productListing');
  for (var i = 0; i <productListings.length; i++) {
    productListings[i].remove();
  }

  var div = document.createElement('div')
  var h3  = document.createElement('h3')
  var img = document.createElement('img')
  var p   = document.createElement('p')
  var tagPrice  = document.createElement('img')
  var a         = document.createElement('a')

  h3.setAttribute('class', 'title')
  p.setAttribute('class', 'subtitle price')

  img.setAttribute('class', 'image')
  img.setAttribute('src', doc.data().img)

  tagPrice.setAttribute('id', 'dollar-tag')
  tagPrice.setAttribute('src', 'assets/images/dollar-tag.png')

  a.setAttribute('class', 'link')
  a.setAttribute('href', doc.data().url)
  a.setAttribute('target', '_blank')

  h3.textContent = doc.data().title
  p.textContent  = doc.data().price
  a.textContent  = doc.data().url

  var wrap = document.createElement('div')
  wrap.innerHTML =
  "<p class='subtitle price'>" + doc.data().price + "<img id='dollar-tag' src='assets/images/dollar-tag.png'>" + "</p>"

  div.appendChild(h3)
  div.appendChild(img)
  div.appendChild(wrap)
  div.appendChild(a)

   // cara kedua
  div.className = 'column is-one-third productListing'
  productsList.appendChild(div)

   // cara pertama
    if (productsList.appendChild(div) !== null) {
     maleBtn.addEventListener('click', function() {
        productsList.removeChild(div)
      })
    }

 }

avatar reihanagamsk
@reihanagamsk

125 Kontribusi 41 Poin

Dipost 6 tahun yang lalu

Login untuk ikut Jawaban