Añadir valores a una tabla cargada con un arraylist, dinamicamente?

[guti2k]

Buenas tardes,

tengo una tabla cargada con los valores por ejemplo 1,2,3 que llegan de un arraylist desde bbdd y la pinto por pantalla.
Luego tengo un botón añadir y un campo de texto para ir insertar en la tabla lo que le vaya indicando en el input.
OJO! Solo tengo que añadirlo a la lista no a la bbdd.
Esto lo tengo que hacer por ajax? Con js?

Si es texto ya está en el array no tengo que introducirlo.
Gracias!

[AngelKrak]

puedes hacerlo con jquery mediante append() si quieres ya que solo necesitas agregarlo sin que se guarde

[Alexis88]

Crea un pequeño formulario con el campo de texto:

Código HTML:

<form id="ejemplo">
    <label for="palabra">Escriba la palabra:</label>
    <input type="text" id="palabra" />
    <input type="submit" value="Añadir a la tabla" />
</form>
 
<table id="lista">
    <thead>
        <tr>
            <th>Palabras añadidas</th>
        </tr>
    </thead>
    <tbody></tbody>
</table>
 

Y añade la palabra escrita a la tabla cuando proceses el formulario:

Código Javascript:

document.querySelector("#ejemplo").addEventListener("submit", function(event){
    event.preventDefault(); //Cancelamos el envío de los datos para evitar que recargue la ventana
    
    var tbody = document.querySelector("#lista tbody"),
        input = document.querySelector("#palabra");
        
    tbody.insertAdjacentHTML("beforeend", "<tr><td>" + input.value + "</td><tr>");    
    input.value = "";
    input.focus();
}, false);
 

DEMO