anhängen Onclick einen Inhalt aus einer automatisch generierten Tabelle von Ajax zu einem Eingabefeld

Question

Ich habe ein Problem mit einem Gehalt von einer automatisch generierten Tabelle von Ajax zu einem Eingabefeld mit dem Namen „Teer“ in diesem Schnipsel von Code anhängt

<script> 
$(document).ready(function() { 
    $('#mela').on('show.bs.modal', function (e) { 
     $('#target').html(); 
     $.ajax({ 
      type: 'get', 
      url: '<?php echo $this->Html->url(array('action' => 'getProducts', 'ext' => 'json')); ?>', 
      beforeSend: function (xhr) { 
       xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
      }, 
      success: function (response) { 
       if (response.error) { 
        alert(response.error); 
        console.log(response.error); 
       } 
       if (response.content) { 

        var arr = response.content; 
        var out = "<table>"; 
        var i; 
        for (i = 0; i < arr.length; i++) { 
         out += "<tr>" + 
           "<td class='t1'>" + 
           arr[i].Product.image + 
           "</td>" + 
           "<td>" + 
           "<a href='#' class='quantum'>" + 
           "<img src='../../images/small/" + arr[i].Product.image + "' width='50px' height='50px'> " + 
           "</a>" + 
           "</td>" + 
           "<td>" + 
           "<a href='#' class='quantum'>" + 
           arr[i].Product.product_name + 
           "</a>" + 
           "</td>" + 
           "</tr>"; 
        } 
        out += "<table>"; 
        $('#target').html(out); 
       } 
      }, 
      error: function (e) { 
       alert("An error occurred: " + e.responseText.message); 
       console.log(e); 
      } 
     }); 
    }); 
}); 

Das Skript oben generiert diese Anzeige jedes Mal, wenn ein Bootstrap-modal angezeigt wird, nachdem eine Taste wie im Bild unten

jedoch angeklickt wird, wenn ich auf einem Link, das klicken Klasse „quantum“ hier, dass doesn bearbeite meine Eingabe id = "tar". In der Tat generiert es nicht einmal eine Warnung, die irgendeine Art von Zeichenfolge enthält.

<script> 
    $(document).ready(function() { 
     $('.quantum').on('click', function() { 
      alert('test'); 
      var t1 = $(this).closest('tr').find('.t1').text(); 
      document.getElementById('tar').value = t1; 
      $('#mela').modal('hide'); 
      return false; 
     }); 
    }); 

</script> 

Answer 1

Ich war in der Lage, das Problem mit diesem Code zu lösen:

<script> 
    $(document).on('click', '.quantum', function(){ 
      alert('test'); 
    }); 
</script> 

auch als Event-Bindung auf dynamisch erstellte Elemente anstelle dieses

$(document).ready(function() { 
    $('.quantum').on('click', function() { 
     alert('test'); 
    }); 
}); 

bekannt