验证错误后触发jquery

时间:2017-04-03 02:58:12

标签: javascript jquery html laravel checkbox

我正在使用带有laravelcollective / html 5.2的laravel 5.3 .. 我做了一个复选框,如果检查,隐藏的输入将出来,如果我取消选中它将隐藏输入..并在laravel验证请求错误后复选框保持选中但隐藏的输入没有显示..请我需要帮助..谢谢..

我的复选框html:

<label>
{!! Form::checkbox('penerima_beda', '1', null, ['id' => 'penerima_beda']) !!}Penerima Berbeda
</label>

这是我的jquery:

$("#penerima_beda").click(function() {
        if(this.checked){
            $("#panel_penerima").css("display", "block");
            $("#nama_penerima").attr("required", "required");
            $("#no_telp_penerima").attr("required", "required");
            $("#alamat_penerima").attr("required", "required");
            //console.log(this);
        }else if(!this.checked){
            $("#panel_penerima").css("display", "none");
            $("#nama_penerima").removeAttr("required");
            $("#no_telp_penerima").removeAttr("required");
            $("#alamat_penerima").removeAttr("required");
        }
    });

1 个答案:

答案 0 :(得分:0)

您需要在文档加载上添加一个check子句以显示隐藏的输入字段

$(document).ready(function () {

    // Show the input if the checkbox is checked
    if ($("#penerima_beda").is(":checked")) {
        $("#panel_penerima").css("display", "block");
        $("#nama_penerima").attr("required", "required");
        $("#no_telp_penerima").attr("required", "required");
        $("#alamat_penerima").attr("required", "required");
    }

    // This works only on click event
    $("#penerima_beda").click(function() {
        if(this.checked){
            $("#panel_penerima").css("display", "block");
            $("#nama_penerima").attr("required", "required");
            $("#no_telp_penerima").attr("required", "required");
            $("#alamat_penerima").attr("required", "required");
        }else if(!this.checked){
            $("#panel_penerima").css("display", "none");
            $("#nama_penerima").removeAttr("required");
            $("#no_telp_penerima").removeAttr("required");
            $("#alamat_penerima").removeAttr("required");
        }
    });

});