JavaScript Tisch machen nicht in Tabelle

Question

Ich habe dieses JavaScript

function pickdet(Id) { 
     //alert(Id); 
     var dd = Id; 

     $.ajax({ 
      cache: false, 
      url: "/PVSigns1/GetDetails", 
      data: { 'Id' : Id }, 
      type: "GET", 
      dataType: "json", 
      success: function (data) { 
       //alert('i dey here') 
       var row = ""; 
       var baseurl = '@Url.Action("Edit","PVSigns1")' + '?Id='; 
       $.each(data, function (index, item) { 
        var clickUrl = baseurl + item.PVSignId; 

        //row += "<tr><td>" + item.VitalSigns.Sign + "</td><td>" + item.SignValue + "</td><td> <input type= 'button' onclick= location.href = + '<Url.Action("Create", "PVSigns1", new { Id = item.PVSignId }) ' />" + "</td></tr>"; 
        row += "<tr><td>" + item.VitalSigns.Sign + "</td><td>" + item.SignValue + 
         "</td><td> <button class='editbtn btn btn-xs btn-success' data-url = '" + clickUrl + "'> <i class='fa fa-edit fa-lg'></i> Edit</button></td></tr>"; 
       }); 
       $("#pvv").html(row); 
      }, 
      error: function (result) { 
       $("#pvv").html('Nothing to show <br /> <p />' + result); 
      } 
     }); 
    } 

    $(function() { 

     $("button.editbtn").click(function (e) { 
      alert("url"); 
      e.preventDefault(); 
      //e.defaultPrevented(); 
      window.location.href = $(this).attr("url"); 
     }); 

    }); 

Wenn ich es laufen, ist es perfekt auf dem Browser angezeigt, aber der Link erstellt funktionieren nicht, und wenn ich sehen Sie die Seite Quelle , der Körperteil, den der obige Code injizieren soll, wird nicht gerendert.

Dies ist, was ich bekomme, klicken Sie auf eine der grünen Tasten in der oberen Tabelle, es lädt die zweite Tabelle. Das Problem ist mit der zweiten Tabelle.

Hinweis: Ich verwende JQuery Datatables.

Dies ist die gerenderte Ausgabe ab Seite Quelle

<div> 
<h3> Details</h3> 
<table id="Pv" class="table table-condensed"> 
    <thead> 
     <tr> 
      <th>Sign</th> 
      <th> Value </th> 
      <th></th> 
     </tr> 
    </thead> 
    <tbody id="pvv"> 

    </tbody> 
</table> 

Hinweis <tbody id="pvv"> leer ist, gibt es nicht Tabellenelemente. Was ist das Problem?

Answer 1

Sie müssen die Delegierung des dom-Elements für das click-Ereignis verwenden. Welches Element wird nach dem Bindungsereignis nach dem vorhandenen dom generiert

$("#Pv").on('click','button.editbtn', function (e) { 
      alert("url"); 
      e.preventDefault(); 
      //e.defaultPrevented(); 
      window.location.href = $(this).attr("url"); 
});