Change 'required' attribute depending if select(input) is visible or not

Question

Okay, I got many selects which some are hidden or visible depending on change in a select input.. The probem is I need all the selects to have required attribute, but when hidden I cannot submit.. Here is the code I use to hide/show the select inputs and it works, now I doesn't need only to show but required=true too, or hide and required=false..

<script type="text/javascript">
    $(document).ready(function(){           
        $("#departamento").hide();
        $("#departamento").required=false;
        $("#fecha_rec").hide();
        $("#fecha_rec").required=false;
        $("#origen").hide();
        $("#asunto").hide();
        $("#fecha_entrega").hide();
        $("#rangofechas").hide();
        $("#otro_dpto").hide();
        $("#otro_dpto").required=false;
        $("select[name='buscarpor']").change(function(){
            var option_value = $(this).val();
            if(option_value=='Departamento') {
                $("#departamento").show();
                $("#departamento").required=true;
                $("#fecha_rec").hide();
                $("#origen").hide();
                $("#asunto").hide();
                $("#fecha_entrega").hide();
                $("#rangofechas").hide();
            }
            else if(option_value=='Fecha recibido') {
                $("#fecha_rec").show();
                $("#fecha_rec").required=true;
                $("#departamento").hide();
                $("#origen").hide();
                $("#asunto").hide();
                $("#fecha_entrega").hide();
                $("#rangofechas").hide();
            }
            else if(option_value=='Origen') {                   
                $("#origen").show();

                $("#fecha_rec").hide();
                $("#departamento").hide();
                $("#asunto").hide();
                $("#fecha_entrega").hide();
                $("#rangofechas").hide();
            }
            else if(option_value=='Asunto') {
                $("#asunto").show();
                $("#fecha_rec").hide();
                $("#departamento").hide();
                $("#origen").hide();
                $("#fecha_entrega").hide();
                $("#rangofechas").hide();
            }
            else if(option_value=='Fecha de Entrega') {
                $("#fecha_entrega").show();
                $("#fecha_rec").hide();
                $("#departamento").hide();
                $("#origen").hide();
                $("#asunto").hide();
                $("#rangofechas").hide();
            }
            else if(option_value=='Rango de Fechas') {
                $("#rangofechas").show();
                $("#fecha_rec").hide();
                $("#departamento").hide();
                $("#origen").hide();
                $("#asunto").hide();
                $("#fecha_entrega").hide();
            }
            else {
                $("#departamento").hide();
                $("#fecha_rec").hide();
                $("#origen").hide();
                $("#asunto").hide();
                $("#fecha_entrega").hide();
                $("#rangofechas").hide();
            }
        });

        $("select[name='departamento']").change(function(){
            var option_value = $(this).val();
            if(option_value=='Otro') {
                $("#otro_dpto").show();
                //$("#departamento").required=false;
                $("#otro_dpto").required=true;
            }else{
                $("#otro_dpto").hide();
            }
        });


    });
</script>

I mean the following:

if(option_value=='Fecha recibido') {
    $("#fecha_rec").show();
    $("#fecha_rec").required=TRUE;
}else{
    $("#fecha_rec").hide();
    $("#fecha_rec").required=FALSE;
}

Answer 1

if you talk about the html5 input required attribute, then you need to use

in jquery:

$("#fecha_rec").attr('required', 'required');
//and
$("#fecha_rec").removeAttr('required');

with the first element (DOM)

$("#fecha_rec")[0].required = true;
// and
$("#fecha_rec")[0].required = false;