Hide required fields on edit page

I want to hide required fields but can’t save data because the fields are empty.

My code on Startup Script:


<script>
loadjs.ready("load", function () {
    // Startup script
    // Write your table-specific startup script here, no need to add script tags.
    <?php if(CurrentPage()->MyFieldA->CurrentValue == 1){ ?>
        $(this).fields("myFieldB").visible(true);
        //$("#myFieldB").show();
    <?php } else { ?>
       $(this).fields("myFieldB").visible(false);
       //$("#myFieldB").hide();
    <?php } ?>
});
</script>

My code on : Edit Tag > Client Side Events
This code works fine when there is a change action

{ // keys = event types, values = handler functions
	"change": function(e) {
		if (this.value == 1) { 
			 $(this).fields("myFieldB").visible(true);
			 $("#Div_ID").show();
         } else {
			 $(this).fields("myFieldB").visible(false);
			 $("#Div_ID").hide();
         }
	}
}

If the field is set as “required”, it is required even it is invisible. If the field can be empty when invisible, you should not set the field as required. You better use client side Form_CustomValidate event to check if the field has value when it is visible.