Estimados, recién me estoy familiarizando con estos lenguajes, he logrado hacer algunas cosas pero esto me la gano.
Saque este ejemplo de una web, pude cargar los items del listado desde una base de datos, después agregue el código para que al agregar también lo agregue a la tabla, hasta aquí funciona perfecto, pero ahora necesito agregar el código para eliminar cuando el usuario hace clic en la imagen que esta al lado del texto, y no tengo idea como obtener el texto al que hace referencia.
Ejemplo:
http://www.lewebmonster.com/ejemplos...as-con-jquery/
Este es el codigo del js
Código:
$(function(){
//enfocamos el campo para digitar nombres (cuestion de usabilidad)
$('#txtNombre').focus();
//evento al hacer clic en el boton agregar
$('#btnAgregar').on('click',function(){
//obtenemos el nombre digitado por el usuario, y el limite establecido
//con la funcion parseInt() convertimos de texto a numero
var $txtNombre=$('#txtNombre'), iLimite=parseInt($('#selLimite').val());
//verificamos que el campo nombre no este vacio
if($.trim($txtNombre.val())!=''){
//variable para contener la lista html
var $ulLista;
//si la lista html no existe entonces la agregamos al dom
if(!$('#divLista').find('ul').length) $('#divLista').append('<ul/>');
//obtenemos una instancia de la lista
$ulLista=$('#divLista').find('ul');
//verificamos el limite de elementos
if($ulLista.find('li').length<iLimite || iLimite==0){
//creamos el item que va a contener el nombre y el boton eliminar
var $liNuevoNombre=$('<li/>').html('<a class="clsEliminarElemento"> </a>'+$.trim($txtNombre.val()));
//verificamos la posicion en la que debemos agregar el nuevo elemento (inicio o final de la lista)
if($('#chkAgregarAlInicio').is(':checked')){
//agregamos el elemento al inicio (con prepend)
$ulLista.prepend($liNuevoNombre);
}else{
//agregamos el elemento al final de la lista (con append)
$ulLista.append($liNuevoNombre);
}
//no se pueden agregar mas elementos, debido al limite establecido
}else{
alert('No es posible agregar el elemento. Se permiten solamente '+iLimite+'.');
}
//el campo nombre esta vacio
}else{
alert('Por favor, digite el nombre que desea agregar a la lista.')
}
//limpiamos el campo nombre y lo enfocamos
$txtNombre.val('').focus();
});
//evento al hacer clic en el boton eliminar de cada item de la lista
//se debe usar "live", ya que son elementos generados donamicamente
$('.clsEliminarElemento').live('click',function(){
//buscamos la lista
var $ulLista=$('#divLista').find('ul');
//buscamos el padre del boton (el tag li en el que se encuentra)
var $liPadre=$($(this).parents().get(0));
//eliminamos el elemento
$liPadre.remove();
//si la listaesta vacia entonces la eliminamos del dom
if($ulLista.find('li').length==0) $ulLista.remove();
});
//eliminamos los elementos impares en la lista (odd)
$('#btnEliminarPares').on('click',function(){
$('#divLista ul li:odd').remove();
});
//eliminamos los elementos pares en la lista (even)
$('#btnEliminarImpares').on('click',function(){
$('#divLista ul li:even').remove();
});
//eliminamos la lista del dom
$('#btnEliminarTodo').on('click',function(){
$('#divLista ul').remove();
});
//al presionar <ENTER> sobre el campo txtNombre llamamos al boton (usabilidad otra vez)
$('#txtNombre').on('keypress',function(eEvento){
if(eEvento.which==13) $('#btnAgregar').trigger('click');
});
});
Aqui debo agregar el codigo para eliminar el registro
Código:
//evento al hacer clic en el boton eliminar de cada item de la lista
//se debe usar "live", ya que son elementos generados donamicamente
$('.clsEliminarElemento').live('click',function(){
//Aqui agregar el codigo para eliminar el registro
// Obtener el texto donde se hizo clic en la imagen para eliminar
// Llamar a la rutina para eliminar y enviar el id y texto
//buscamos la lista
var $ulLista=$('#divLista').find('ul');
//buscamos el padre del boton (el tag li en el que se encuentra)
var $liPadre=$($(this).parents().get(0));
//eliminamos el elemento
$liPadre.remove();
//si la listaesta vacia entonces la eliminamos del dom
if($ulLista.find('li').length==0) $ulLista.remove();
});
de antemano muchas gracias