To nie jest zbyt trudne. Prostym sposobem byłoby dodanie przez .append:
$( '#table > tbody:last').append('<tr id="id"><td>stuff</td></tr>');
Dodawanie elementów w czasie rzeczywistym nie jest całkowicie możliwe. Musisz uruchomić zapytanie Ajax, które aktualizuje się w pętli, aby „złapać” zmianę. Więc nie do końca w czasie rzeczywistym, ale bardzo, bardzo blisko tego. Twój użytkownik naprawdę nie zauważyłby różnicy, chociaż może to spowodować obciążenie serwera.
Ale jeśli chcesz się bardziej zaangażować, sugeruję zapoznanie się z DataTables . Daje ci sporo nowych funkcji, w tym sortowanie, stronicowanie, filtrowanie, ograniczanie, wyszukiwanie i ładowanie ajax. Stamtąd możesz albo dodać element przez ajax i odświeżyć widok tabeli, albo po prostu dołączyć za pomocą jego API. Używam DataTables w mojej aplikacji od jakiegoś czasu i są one konsekwentnie wymieniane jako funkcja numer 1, która umożliwia wykorzystanie ogromnej ilości danych.
--Edytuj --
Ponieważ nie jest to oczywiste, aby zaktualizować DataTable, które wywołujesz, ustaw swoje wywołanie Datatables na zmienną:
var oTable = $('#selector').dataTable();
Następnie uruchom to, aby przeprowadzić aktualizację:
oTable.fnDraw(false);
AKTUALIZACJA — 5 lat później, w lutym 2016 r.:Dzisiaj jest to znacznie bardziej możliwe niż w 2011 r. Nowe frameworki JavaScript, takie jak Backbone.js, mogą łączyć się bezpośrednio z bazą danych i wyzwalać zmiany w elementach interfejsu użytkownika, w tym w tabelach dotyczących zmian, aktualizacji lub usuwanie danych....to jedna z głównych korzyści tych frameworków. Dodatkowo interfejsy użytkownika mogą być zasilane aktualizacjami w czasie rzeczywistym za pośrednictwem połączeń gniazdowych do usługi sieciowej, która może być następnie przechwycona i wykorzystana. Chociaż opisana tutaj technika nadal działa, istnieje dziś znacznie więcej „na żywo” sposobów robienia rzeczy.