JavaScript function does not refresh the data very well

Question

JavaScript function does not refresh the data very well

Navigation

#1 by (0 votes)

0

Hello good afternoon friend my problem is that I use a select option which if I choose that if I must hide a button and a select and also if it is NA but if it is NOT shows them then use a javascript function and it works very good but let's say I choose yes and then I'm lame and then I choose NA and again I choose not do not load me the javascript function does not refresh this is my code

$(document).delegate('.txtFormulario_Pregunta', 'change', function(event) {
        var valor = $(this).val();

        var idPre = $(this).attr('id').replace('txtFormulario_Pregunta_', '');




        if (valor === 'NO'){
            if ($('#txtFormulario_Pregunta_Observacion_' + idPre).length === 0){


                $(this).parent('div').parent('div').append(tds);
                $('#btnagregartecins_inc_' + idPre).show();
                $('#txtFormulario_Pregunta_Observacion_' + idPre).show();
                $('#txt_tec_ins_inc_' + idPre).show();
                $('#btnagregartecinc' + idPre).show();




    var tds = '<br><textarea class="form-control" rows="6" placeholder="OBSERVACIÓN:" id="txtFormulario_Pregunta_Observacion_' + idPre + '"></textarea>';




                    $(this).parent('div').parent('div').append(tds);
                    $('#txtFormulario_Conformidad').val('NO');
                } else{
                    $('#txtFormulario_Pregunta_Observacion_' + idPre).remove();

                }
            }

            else{

                if (valor === 'SI') {


                    $('#btnagregartecins_inc_' + idPre).hide();
                    $('#txtFormulario_Pregunta_Observacion_' + idPre).hide();
                    $('#txt_tec_ins_inc_' + idPre).hide();
                    $('#btnagregartecinc' + idPre).hide();

            }


                if (valor === 'NA') {


                    $('#btnagregartecins_inc_' + idPre).hide();
                    $('#txtFormulario_Pregunta_Observacion_' + idPre).hide();
                    $('#txt_tec_ins_inc_' + idPre).hide();
                    $('#btnagregartecinc' + idPre).hide();

            }
            }

        });

and my html is this

tds += "<select class='txtFormulario_Pregunta' id='txtFormulario_Pregunta_" + val.idPre + "' rel='" + val.idPre + "'>";
tds += "<option disabled selected>Seleccione</option>";
tds += "<option value='SI'>SI</option>";
tds += "<option value='NO'>NO</option>";
tds += "<option value='NA'>N.A</option>";
tds += "</select>";

javascript php ajax

asked by PlayTutoAlvarez 21.09.2018 в 21:57

source

1 answer

INSERT Run in XAMPP but not online You do not get the values after buying redsys

score 0 · Answer 1

I leave a possible solution to your problem, along with some recommendations:

First:

// Agregue el attributo data-pre para obtener el id más facil
tds += "<select class='txtFormulario_Pregunta' data-pre='" + val.idPre + "' id='txtFormulario_Pregunta_" + val.idPre + "' rel='" + val.idPre + "'>";
tds += "<option hidden>Seleccione</option>";
tds += "<option value='SI'>SI</option>";
tds += "<option value='NO'>NO</option>";
tds += "<option value='NA'>N.A</option>";
tds += "</select>";

Then:

// .delegate(..), es una versión antigua de .on()
// por lo tanto no se recomienda su uso
$(document).on('.txtFormulario_Pregunta', 'change', function(event) {
    var valor = $(this).val();
    var idPre = $(this).data('pre'); // El nuevo atributo que agregue al select

    if (valor === 'NO'){
        if ($('#txtFormulario_Pregunta_Observacion_' + idPre).length === 0){
            $(this).parent('div').parent('div').append(tds);
            $('#btnagregartecins_inc_' + idPre).show();
            $('#txtFormulario_Pregunta_Observacion_' + idPre).show();
            $('#txt_tec_ins_inc_' + idPre).show();
            $('#btnagregartecinc' + idPre).show();

            var tds = '<br><textarea class="form-control" rows="6" placeholder="OBSERVACIÓN:" id="txtFormulario_Pregunta_Observacion_' + idPre + '"></textarea>';

            $(this).parent('div').parent('div').append(tds);
            $('#txtFormulario_Conformidad').val('NO');
        }
    } else{
        // Aquí solo necesitas especificarlo una vez
        // puesto que es la misma acción de ocultar si el valor es "SI" o "NA"
        $('#btnagregartecins_inc_' + idPre).hide();
        $('#txt_tec_ins_inc_' + idPre).hide();
        $('#btnagregartecinc' + idPre).hide();

        // Remover el elemento para que se cree uno nuevo cada que se 
        // seleccione la opción "NO"
        $('#txtFormulario_Pregunta_Observacion_' + idPre).remove();
    }
});

I could not do a test, but if an error arises, just comment what it is and review it.