jquery get value from dynamically created inputs with name

Question

I'm having a form that is created dynamically depending on the value selected, it makes various text inputs and depending if its a new reg the values are empty if not the values are populated with data from a mysql database, when i want to submit the form and make a new insert i try to get all the values from the inputs but no values are returned

$('input#send.clientenom').live('click', function (){
    var id_cliente = $('select#clienteslist.list').val();
    var contacto = $('.clientenom input[name="contacto"]').val();
    var cliente = $('.clientenom input[name="cliente"]').val();
    var direccion = $('.clientenom input[name="direccion"]').val();
    var colonia = $('.clientenom input[name="colonia"]').val();
    var estado = $('.clientenom input[name="estado"]').val();
    var cp = $('.clientenom input[name="cp"]').val();
    var telefono = $('.clientenom input[name="telefono"]').val();
    var email = $('.clientenom input[name="email"]').val();
    var acumulado = $('.clientenom input[name="acumulado"]').val();
    var tipocliente = $('.clientenom input[name="tipocliente"]').val();
    var prospecto = $('.clientenom input[name="prospecto"]').val();
    var nivel = $('.clientenom input[name="nivel"]').val();
    var proynom = $('.regname input[name="regproyname"]').val();
    alert(id_cliente, contacto, cliente, direccion, colonia, estado, cp, telefono, email, acumulado, tipocliente, prospecto, nivel, proynom);
            data = JSON.parse(data);     

    if(id_cliente == 0){

    var jqxhr = $.post("php/registrop.php",{"id_tipo":tipocliente, "id_prospecto":prospecto, "id_nivel":nivel, "contacto":contacto,"cliente":cliente, "direccion":direccion, "colonia":colonia, "estado":estado, "cp":cp, "telefono":telefono, "email":email, "acumulado":acumulado, "proyecto":proynom},function(data){
    if (typeof (data) == 'object' && JSON.parse ){

var html = '';
var len = data.length;
for (var i = 0; i< len; i++) {      
    var d = data[i];
    if(!d.error){
    if(d.Success == true){
html += d.Message;}
}else{
            alert(d.error);
    }}
    alert(d.Message);
    }else{

    alert("error no se puede parsear");
    }




        } )}else{
            var jqxhr = $.post("php/registrop.php",{"id_cliente":id_cliente, "proyecto":proynom},function(data){
                        data = JSON.parse(data);     
    if (typeof (data) == 'object' && JSON.parse ){

var html = '';
var len = data.length;
for (var i = 0; i< len; i++) {      
    var d = data[i];
    if(!d.error){
if(d.Success == true){
html += d.Message;
}

}else{
    alert(html);
    }}
            alert(d.error);
    alert("error no se puede parsear");
    }


        } )
            }
    });

the alert is just to debug to see the values but the only value i get is id_cliente val no other value is added do i need to bind o delegate the inputs? also my submit button is type button not submit so it wont reload the page thanks in advance!

the form is created this way:

  function selectedcliente(){
var id_clientea = $('select#clienteslist.list').val();
if($('form#info.customForm').length > 0 || id_clientea == ""){

    $('.clienteinfo').empty();
            }
if(id_clientea == 0){
var html = '';
html += '<form class="customForm" id="info">' +
'<div>' +
'<label for="contacto">Contacto</label>' +
'<input type="text" name="contacto" class="clientenom" value=""/><span id="contactoinfo">Nombre del contacto del cliente</span>' +
'</div>' +
'<div>' +
'<label for="cliente">Cliente</label>' +
'<input type="text" name="cliente" class="clientenom" value=""/><span id="clienteinfo">Nombre de la empresa/cliente</span>' +
'</div>' +
'<div>' +
'<label for="direccion">Direccion</label>' + 
'<input type="text" name="direccion" class="clientenom" value=""/><span id="direccioninfo">Direccion de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="colonia">Colonia</label>' +
'<input type="text" name="colonia" class="clientenom" value=""/><span id="coloniainfo">Colonia de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="estado">Estado</label>' +
'<input type="text" name="estado" class="estado" value=""/><span id="estadoinfo">Estado donde se encuentra la empresa</span>' +
'</div>' +
'<div>' +
'<label for="cp">Codigo Postal</label>' +
'<input type="text" name="cp" class="clientenom" value=""/><span id="cp">Codigo Postal del lugar de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="telefono">Telefono</label>' +
'<input type="text" name="telefono" class="clientenom" value=""/><span id="telefonoinfo">Telefono de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="email">E&ndash;mail</label>' +
'<input type="text" name="email" class="clientenom" value=""/><span id="emailinfo">E&ndash;mail de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="acumulado">Acumulado</label>' +
'<input type="text" name="acumulado" class="clientenom" value=""/><span id="acumuladoinfo">Total de todas las compras que se han hecho</span>' +
'</div>' +
'<div>' +
'<label for="tipocliente">Tipo del Cliente</label>' +
'<input type="text" name="tipocliente" class="clientenom" value=""/><span id="tipoclienteinfo">Que tipo de cliente es (Gobierno, Particular, Industrial, Distribuidor, Particular GR)</span>' +
'</div>' +
'<div>' +
'<label for="prospecto">Prospecto o Cliente</label>' +
'<input type="text" name="prospecto" class="clientenom" value=""/><span id="prospectoinfo">Prospecto o Cliente?</span>' +
'</div>' +
'<div>' +
'<label for="nivel">Nivel del Cliente</label>' +
'<input type="text" name="nivel" class="clientenom" value=""/><span id="nivelinfo">Nivel del cliente (depende del total acumulado)</span>' +
'</div>' +
'<div>' +
'<input type="button" class="clientenom" id="send" value="Registrar Proyecto" />' +
'</div>' +
'</form>'
;
        $('.clienteinfo').append(html);
}
else
{
var jqxhr = $.post('php/selectcliente.php',{"id_cliente":id_clientea}, function(data){
 data = JSON.parse(data);

 if(typeof(data) == 'object' && JSON.parse){
var html = '';
var len = data.length;
//alert(len);
for(var i = 0; i<len; i++){
var d = data[i];
    if(!d.error){

html += '<form class="customForm" id="info">' +
'<div>' +
'<label for="contacto">Contacto</label>' +
'<input type="text" name="contacto" class="clientenom" value="' + d.contacto + '"/><span id="contactoinfo">Nombre del contacto del cliente</span>' +
'</div>' +
'<div>' +
'<label for="cliente">Cliente</label>' +
'<input type="text" name="cliente" class="clientenom" value="' + d.cliente + '"/><span id="clienteinfo">Nombre de la empresa/cliente</span>' +
'</div>' +
'<div>' +
'<label for="direccion">Direccion</label>' + 
'<input type="text" name="direccion" class="clientenom" value="' + d.direccion + '"/><span id="direccioninfo">Direccion de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="colonia">Colonia</label>' +
'<input type="text" name="colonia" class="clientenom" value="' + d.colonia + '"/><span id="coloniainfo">Colonia de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="estado">Estado</label>' +
'<input type="text" name="estado" class="estado" value="' + d.estado + '"/><span id="estadoinfo">Estado donde se encuentra la empresa</span>' +
'</div>' +
'<div>' +
'<label for="cp">Codigo Postal</label>' +
'<input type="text" name="cp" class="clientenom" value="' + d.cp + '"/><span id="cp">Codigo Postal del lugar de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="telefono">Telefono</label>' +
'<input type="text" name="telefono" class="clientenom" value="' + d.telefono + '"/><span id="telefonoinfo">Telefono de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="email">E&ndash;mail</label>' +
'<input type="text" name="email" class="clientenom" value="' + d.correo + '"/><span id="emailinfo">E&ndash;mail de la empresa</span>' +
'</div>' +
'<div>' +
'<label for="acumulado">Acumulado</label>' +
'<input type="text" name="acumulado" class="clientenom" value="' + d.acumulado + '"/><span id="acumuladoinfo">Total de todas las compras que se han hecho</span>' +
'</div>' +
'<div>' +
'<label for="tipocliente">Tipo del Cliente</label>' +
'<input type="text" name="tipocliente" class="clientenom" value="' + d.tipo_cliente + '"/><span id="tipoclienteinfo">Que tipo de cliente es (Gobierno, Particular, Industrial, Distribuidor, Particular GR)</span>' +
'</div>' +
'<div>' +
'<label for="prospecto">Prospecto o Cliente</label>' +
'<input type="text" name="prospecto" clss="clientenom" value="' + d.prospecto + '"/><span id="prospectoinfo">Prospecto o Cliente?</span>' +
'</div>' +
'<div>' +
'<label for="nivel">Nivel del Cliente</label>' +
'<input type="text" name="nivel" class="clientenom" value="' + d.nivel + '"/><span id="nivelinfo">Nivel del cliente (depende del total acumulado)</span>' +
'</div>' +
'<div>' +
'<input type="button" class="clientenom" id="send" value="Registrar Proyecto" />' +
'</div>' +
'</form>'
;
    }else{
        alert(d.error); 
        }

    }
    $('.clienteinfo').append(html);
}else{
    alert("Is not object");

    }
    });
    }
}

Answer 1

.clientenom input[name="nivel"] is trying to find an input with a name of nivel that is within an element with the class of clientenom.

This is not the case in your html. The input is not within .clientenom it has that class itself.

Unless you have multiple inputs with the same name, just drop the class all together:

var contacto = $('input[name="contacto"]').val();

If you do need the class, it should be:

input.clientenom[name="nivel"]

or

input[name="nivel"].clientenom

EDIT: On a similar note, in most cases, there is no reason to do something like select#clienteslist.list. If the element has an ID just use the ID, unless there is some reason you only want to get it when it is a select and has the class list.