Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript Passing data from (html-JavaScript) table to JavaScript Function

lexerpv

New Coder
Hi, I've got a button for adding rows (select option value and Input) to a html-JavaScript table, When I select an element from the select option value (idmedico) I use onchange option in the select for going to a JavaScript function for fetching the name for the idmedico and the populate the input (id="nombre_'+cont+'"). Because I can add several rows in html-JavaScript table then I will have: idmedico[0] -- id="nombre_0" idmedico[1] -- id="nombre_1"etc.
This is my JavaScript code for creating Table:
JavaScript:
var fila='<tr class="filas" id="fila'+cont+'">'+
        '<td><button type="button" class="btn btn-danger" onclick="eliminarDetalle('+cont+')">X</button></td>'+
        '<td><select  name="idmedico[]" class="form-control idmedico" data-id="'+cont+'" onchange="myFunction(this.value)" required  ><option value="" >Seleccione Cuenta</option><?php echo seleccionar_medico($connect); ?></select></td>'+
        '<td><input type="text" id="nombre_'+cont+'" name="nombre[]" value=""></td>'+
        '</tr>';
        cont++;
        detalles++;
        $('#detalles').append(fila);
This is the JavaScript function (myFunction) for fetching name and then populate input with the name:
JavaScript:
function myFunction(idmedico){
    var contador = document.getElementById('data-id');
        $.ajax({
            url: 'traer_nombre_medico.php',
            type: 'POST',
            dataType: 'json',
            data:{idmedico:idmedico},
            success: function(data)
            {
                              $('#nombre_'+contador).val(data.nombre);
            },
            error: function(errorThrown)
            {
                alert(errorThrown);
            }
            });
        }

The above function fetch the name for idmedico but doesn't populate the name in the input id="nombre_'+cont+'"
My problem is that I don't how to pass variable cont to Table.pngmyFunction():
The image show The table and how could works when selecting idmedico.

Please any ideas?
 
I don't see right away what is wrong here, but I find your code to create the fila string rather convoluted and error-prone.
Consider using the backtick operator, which has the advantage that you can create a multiline string with linefeeds and you can easily insert your counter like this : ${cont}

Thus the code would be

JavaScript:
var fila = `
<tr class="filas" id="fila${cont}">
<td><button type="button" class="btn btn-danger" onclick="eliminarDetalle(${cont})">X</button></td>
<td><select  name="idmedico[]" class="form-control idmedico" data-id="${cont}"
    onchange="myFunction(this.value)" required  ><option value="" >Seleccione Cuenta</option><?php echo seleccionar_medico($connect); ?>
    </select></td>
<td><input type="text" id="nombre_${cont}" name="nombre[]" value=""></td>
</tr>
`;

While this might not solve your problem, it is at least easier to understand and maintain.

One thing I do not understand here is this name="nombre[]" Why do you want those square brackets in the name ? Is that even legal ?
 

New Threads

Buy us a coffee!

Back
Top Bottom