Hide checkbox and display another

Question

Hide checkbox and display another

Navigation

#1 by (1 votes)
#2 by (1 votes)

0

I made a small validation in my script, but I'm not able to do the following validation.

I have 2 checkboxes, each executes an action, as you can see in my if below.

@if (item.Cadeado == 1 && item.cadeadoAH == 1) {
  <input type="checkbox" name="check_LiberarFormulario" data-form="AltaUti" data-value="@item.PatientId" data-content="@item.PatientId" checked style="height: 14px;">
} else {
  <input type="checkbox" name="check_BloquearFormulario" data-form="AltaUtiDesc" data-value="@item.PatientId" data-content="@item.PatientId" style="height: 14px;">
}

Below are the two scripts of these two checkboxes

   $('[name="check_LiberarFormulario"]').click(function (element) {
        var $btn = $('#' + element.id);
        var id = $(this).attr('data-value');
        var formulario = $(this).attr('data-form');

        $.ajax({
            method: 'POST',
            url: '/Formulario/Cadastro/AbrirCadeadoForm',
            data: { 'id': id, 'formulario': formulario },
            success: function (response) {
                notif({
                    'type': 'danger',
                    'msg': '<b>Formulário Liberado!</b> Sua página será atualizada em alguns segundos',
                    'position': 'center',
                    'multiline': true,
                    'timeout': 2000
                })
            },
            error: function (response) {
                $('.resultadoSalvar.modal').modal('show');
                $('#tituloSalvo45').text('Ocorreu um erro');
                $('#mensagemResultadoSalvar').text('Ocorreu um erro inesperado, entre em contato com o suporte!');
            }
        });
    });

    $('[name="check_BloquearFormulario"]').click(function (element) {
        var $btn = $('#' + element.id);
        var id = $(this).attr('data-value');
        var formulario = $(this).attr('data-form');

        $.ajax({
            method: 'POST',
            url: '/Formulario/Cadastro/AbrirCadeadoForm',
            data: { 'id': id, 'formulario': formulario },
            success: function (response) {
                notif({
                    'type': 'success',
                    'msg': '<b>Formulário Bloqueado!</b>',
                    'position': 'center',
                    'autohide': true,
                    'multiline': true,
                    'timeout': 2000
                })
            },
            error: function (response) {
                $('.resultadoSalvar.modal').modal('show');
                $('#tituloSalvo45').text('Ocorreu um erro');
                $('#mensagemResultadoSalvar').text('Ocorreu um erro inesperado, entre em contato com o suporte!');
            }
        });
    });

When checkLiberateForm is removed check check_BloquearFormulario should be displayed, vice versa, ie click on one and display the other, and at the time of loading the page may only show one option.

I tried to do with show () and hide () fadeIn () and FadeOut () only I did not succeed in any of these options.

javascript jquery

asked by anonymous 28.03.2018 / 20:48

2 answers

Default value for property according to type and core Regular expressions in pyhton

score 1 · Answer 1

Have you tried using the toggle method of jQuery? See more here

$( "button" ).click(function() {
  $( "p" ).toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><button>Toggle</button><p>Hello</p><pstyle="display: none">Good Bye</p>

score 1 · Answer 2

You can do this using jquery:

var check1 = $("#id-do-check-1");
var check2 = $("#id-do-check-2");

check1.on("change", function () {
        if (check1.find("input:checked").length) {
            check2.show();
        }
        else {
            check2.hide();
        }
    }
);

See the full example: link