I have a web form page that its elements and validators needs to be enabled and disabled relative to the user's choice and each others value dynamically. I have done this using JQuery For example like this:
switch (RequestKind) {
case "0":
$('.inside').find('input, select, textarea').not("#DrpRequestKind, #FileUpload, #_btnAttachFiles").prop("disabled", true).val(null);
$("#DrpLeaveDuration, #_DDLlocatePersonelNo, #DrpLeaveKind").addClass("ddl-disabled").val(0);
$("#TxtDateOF, #TxtDateTO").css("background-color", "rgb(238, 238, 238)");
//Enable\Disable Required validation
$("#VDrpLeaveKind")[0].enabled = true;
$("#VTxtDateTO")[0].enabled = true;
$("#VDrpLeaveDuration")[0].enabled = true;
$("#VTxtEndTime")[0].enabled = true;
$("#VTxtStartTime")[0].enabled = true;
ValidatorEnable($("#VtxtVacationDesc")[0], false);
break;
case "1":
$('.inside').find('input, select, textarea').not("#DrpRequestKind, #FileUpload, #btnAttachFiles").prop("disabled", true);
$("#DrpLeaveDuration, #DrpLeaveKind").prop("disabled", true).addClass("ddl-disabled").val(0);
$("#TxtDateOF").css("background-color", "white").removeAttr("disabled").val(null);
$("#TxtDateTO").css("background-color", "white").prop("disabled", false).val(null);
$("#TxtStartTime, #TxtEndTime").prop("disabled", false).val(null);
$("#TxtlocatePersonelNo").prop("disabled", false).val(null);
$("#DDLlocatePersonelNo").prop("disabled", false).removeClass("ddl-disabled").css("background-color", "").val(0);
$("#txtVacationDesc").prop("disabled", false).val(null);
//Disable\Enable required validation
ValidatorEnable($("#VDrpLeaveKind")[0], false);
ValidatorEnable($("#VDrpLeaveDuration")[0], false);
$("#VTxtStartTime")[0].enabled = true;
$("#VtxtVacationDesc")[0].enabled = true;
break;
case "2":
$('.inside').find('input, select, textarea').not("#DrpRequestKind, #FileUpload, #btnAttachFiles").prop("disabled", true).val(null);
$("#DrpLeaveDuration").prop("disabled", false).removeClass("ddl-disabled").val(0);
$("#TxtDateOF, #TxtDateTO, #DDLlocatePersonelNo").css("background-color", "rgb(238, 238, 238)");
$("#DDLlocatePersonelNo, #DrpLeaveKind").val(0);
//Enable\Disable Required validation
$("#VDrpLeaveKind")[0].enabled = true;
$("#VDrpLeaveDuration")[0].enabled = true;
$("#VTxtEndTime")[0].enabled = true;
$("#VTxtStartTime")[0].enabled = true;
ValidatorEnable($("#VtxtVacationDesc")[0], false);
break;
default:
}
above script is a simple example for impact dropdownlist change on others. Now, when a post back occurs befor submit all change reset to default. I try save the state of every element on page using sessionStorage and restore them ofter post back, but I did not succeed, becouse I can not detect this is first time the page is load or not(fist time does not have previous state). I want to know that is my sloution is right, and how can save this state and is the correct way to do this? thanks
Aucun commentaire:
Enregistrer un commentaire