设置从服务器端加载的后退按钮上的下拉值

Set the dropdown value on back button getting loaded from server side

本文关键字:按钮 服务器端 加载 设置      更新时间:2023-09-26

我有一个包含4个下拉列表的页面。当我选择第一个下拉列表时,有一个Ajax调用将过滤其他3个下拉列表数据,并单击提交按钮显示第二个页面。现在,当我点击浏览器的后退按钮时,第一页的下拉列表必须保留以前填写的数据。只有第一个下拉列表保留了数据,其他三个下拉列表没有填充之前选择的数据。为此,我在点击表单提交时设置cookie如下:

this.SetCookieForPriceGuide = function () {
        document.cookie = "VehicleMake=" + $("#VehicleMake").val();
        document.cookie = "VehicleYear=" + $("#VehicleYear").val();
        document.cookie = "VehicleModel=" + $("#VehicleModel").val();
        document.cookie = "VehicleDamage=" + $("#VehicleDamage").val();
    };

在按钮点击事件中设置CookieForPriceGuide,在返回按钮上调用加载函数,我试图设置如下的下拉值

this.load = function () {
        var VehicleYear = getCookie("VehicleYear");
        var VehicleMake = getCookie("VehicleMake");
        var VehicleModel = getCookie("VehicleModel");
        var VehicleDamage = getCookie("VehicleDamage");
}

getCookie方法如下:

function getCookie(cookieValue) {
    var textValue = cookieValue + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1);
        if (c.indexOf(textValue) == 0) {
            return c.substring(textValue.length, c.length);
        }
    }
    return "";
}

您可以如下设置下拉列表的选定值:

this.load = function () {
    setSelectedValue('ddl_VehicleYearId', getCookie("VehicleYear"), 'defaultValue');
    setSelectedValue('ddl_VehicleMakeId', getCookie("VehicleMake") 'defaultValue');
    setSelectedValue('ddl_VehicleModelId', getCookie("VehicleModel") 'defaultValue');
    setSelectedValue('ddl_VehicleDamageId', getCookie("VehicleDamage") 'defaultValue');
}
function setSelectedValue(dropdownId, cookieValue, defaultValue){
    var element = document.getElementById(dropdownId);
    if(cookieValue) // If cookie has value
        element.value = cookieValue;
    else    // set default value
        element.value = defaultValue;
}