0

Comunidada,

Necesito pasar una cadena de texto almacenada en base de datos sql server como la siguiente "1,2,3" a campos de checkbox que representan los dias de la semana como se muestra a continuación

introducir la descripción de la imagen aquí

Lo que me tiene que hacer es si tengo el 1,2,3 me marque el domingo que es = 1, el 2 que es igual a lunes y el 3 que es igual a martes, haciendo una simulación de como deberia quedar seria lo siguiente:

introducir la descripción de la imagen aquí

pase la cadena a un arreglo de la siguiente manera:

var arr = JSON.parse("[" + listas['spot'][0].checkDias + "]");
        console.log( arr)
        console.log(typeof arr[0])

esto me genera el siguiente arreglo de manera correcta

introducir la descripción de la imagen aquí

ahora no se como debo pasar esto a la parte grafica en la vista tengo lo siguiente:

$('#checkDias').val(listas['spot'][0].checkDias);
$('#checkDias').prop('title', listas['spot'][0].checkDias);

y la parte de los check la siguiente:

<div class="form-row" style="display: flex; padding-bottom:1.5rem;">
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="2" id="lunes">
            <label class="form-check-label" style="font-weight: 100;" for="lunes"> Lunes </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="3" id="martes">
            <label class="form-check-label" style="font-weight: 100;" for="martes"> Martes </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="4" id="miercoles">
        <label class="form-check-label" style="font-weight: 100;" for="miercoles"> Miercoles </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="5" id="jueves">
            <label class="form-check-label" style="font-weight: 100;" for="jueves"> Jueves </label>
    </div>
</div>
<div class="form-row" style="display: flex; padding-bottom:1.5rem;">
    <div class="form-row" style="display: flex;">
        <div class="form-check-inline" style="margin-right: 4px;">
            <input class="form-check-input" name="semanaDia[]" type="checkbox" value="6" id="viernes">
            <label class="form-check-label" style="font-weight: 100;" for="viernes"> Viernes </label>
        </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="7" id="sabado">
            <label class="form-check-label" style="font-weight: 100;" for="sabado"> Sabado </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="1" id="domingo">
            <label class="form-check-label" style="font-weight: 100;" for="domingo"> Domingo </label>
    </div>
</div>

Espero me puedan orientar en como poder marcar como seleccionadas esos datos que son dias en la vista.

Muchas gracias

1 respuesta 1

1

Te recomiendo que cambies el orden de los dias y empieces por domingo. Si haces eso puedes resolver tu problema iterando por el array y chequeando las checkboxes correspondientes asi:

var arr = [ 1,2,3 ];

var i = 0;

for (i = 0; i < arr.length; i++) {
  $('input[name=semanaDia\\[\\]]')[arr[i]-1].checked = true;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-row" style="display: flex; padding-bottom:1.5rem;">
<div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="1" id="domingo">
            <label class="form-check-label" style="font-weight: 100;" for="domingo"> Domingo </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="2" id="lunes">
            <label class="form-check-label" style="font-weight: 100;" for="lunes"> Lunes </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="3" id="martes">
            <label class="form-check-label" style="font-weight: 100;" for="martes"> Martes </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="4" id="miercoles">
        <label class="form-check-label" style="font-weight: 100;" for="miercoles"> Miercoles </label>
    </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="5" id="jueves">
            <label class="form-check-label" style="font-weight: 100;" for="jueves"> Jueves </label>
    </div>
</div>
<div class="form-row" style="display: flex; padding-bottom:1.5rem;">
    <div class="form-row" style="display: flex;">
        <div class="form-check-inline" style="margin-right: 4px;">
            <input class="form-check-input" name="semanaDia[]" type="checkbox" value="6" id="viernes">
            <label class="form-check-label" style="font-weight: 100;" for="viernes"> Viernes </label>
        </div>
    <div class="form-check-inline" style="margin-right: 4px;">
        <input class="form-check-input" name="semanaDia[]" type="checkbox" value="7" id="sabado">
            <label class="form-check-label" style="font-weight: 100;" for="sabado"> Sabado </label>
    </div>
    
</div>

1
  • muchas gracias por la respuesta, al realizar el for me dice que no se ha definido la propiedad checked. el 26 jul. 2022 a las 13:59

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.