jQuery - zeigt die hinzugefügte Zeile

Question

Ich habe eine Webseite, die neue DB-Datensätze einfügen und sie dem Benutzer anzeigen soll.

Was ich will ist, dass, wenn ich eine Person hinzufügen, s (er) muss die hinzugefügte Zeile sehen. Ich habe den Code unten:

function AddData(par){ 

    var artistName = $("input[name='"+par+"']").attr('id') + '-'+$("input[name='"+par+"']").val(); 

    $.post('/json/management/AddDataAjax2', 
    { 
     "artistName": artistName 
    }, 
    function(response){ 
     console.log(response); 
     if(response =='ok'){ 
      alert("Başarıyla eklendi"); 
     } 
     else{ 
      alert("Sanatçı bulunamadı, yönlendiriliyorsunuz"); 
      window.location.replace("http://www.sinemalar.com/management/artistAddEditRemove/"); 
     } 
}); 
} 

Die Tabs sind alle divs. Ich gab jedem Tab eine ID und fügte nach dem Einfügen des Datensatzes eine Div-Aktualisierung hinzu. Allerdings wird die Originalseite, die ich geladen habe, gerendert. Was ist die Lösung, irgendein Vorschlag?

Answer 1

Erstellen Sie einfach ein div, wo Sie die Daten wollen gezeigt, um so etwas sein: Sie dieses Beispiel nützlich sein könnten

<div id="added"></div> 

Und dann jQuery diese bearbeiten:

function(response){ 
    console.log(response); 
    if(response =='ok'){ 
     $("#added").append(artistName . "<br>"); 
     alert("Başarıyla eklendi"); 
    } 

Answer 2

Wenn Sie die Seite aktualisieren, können Sie stattdessen append() verwenden, um das neue Element an Ihre Liste anzuhängen?

bearbeitet:

test.html >>

<script src="jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript">                          

$(document).ready(function() { 
    $("input[type='button']").click(function() { 
     value = $("input[type='text']").val(); 
     $('ui').append("<li>"+value+"</li>"); 
    }); 
    }); 

</script> 
<ui id='list'> 
    <li>item1</li> 
    <li>item2</li> 

</ui> 

<input type='text'/><input type='button' value='Add'/>