DropDown lost selected values ​​after update

Question

I have a drop-down list, when the user selects this parameter, the value is transferred, but after refreshing the page I want to save the selected value (but now they are set to the default value), so the user knows what was selected. Any hope.

I know this may be a duplicate, but I did not find a useful answer in duplicate questions

My drop down list

<select id="Selection">
    <option value="">Sort by</option>
    <option value="0">Code</option>
    <option value="1">Title A-Z</option>
    <option value="2">Title Z-A</option>
    <option value="3">Brand</option>
    <option value="4">Lowest price</option>
    <option value="5">Highest price</option>
    <option value="6">Lowest Quantity</option>
    <option value="7">Highest Quantity</option>
</select>

Jquery

$(document).ready(function () {
    $("#Selection").change(function () {
        var item = $(this).find(":selected").val();

        $.ajax({
            url: "/Cook/AddCookies",
            data: { item: item },
            type: 'POST',
            // contentType: 'application/json; charset=utf-8',
            success: function (data) {

                // Variable data contains the data you get from the action method
            }
        });
    });

Answer 1

Solved

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js"></script>

<select id="Selection">
    <option value="">Sort by</option>
    <option value="0">Code</option>
    <option value="1">Title A-Z</option>
    <option value="2">Title Z-A</option>
    <option value="3">Brand</option>
    <option value="4">Lowest price</option>
    <option value="5">Highest price</option>
    <option value="6">Lowest Quantity</option>
    <option value="7">Highest Quantity</option>
</select>

<script>
    $(document).ready(function () {
        var val = getCookie("TestCookie");
        $("#Selection").val(val);

        $("#Selection").change(function () {
            var item = $(this).find(":selected").val();

            $.ajax({
                url: "/Cook/AddCookies",
                data: { item: item },
                type: 'POST',
                success: function (data) {
                }
            });
        });

    });

    function getCookie(name) {
        var re = new RegExp(name + "=([^;]+)");
        var value = re.exec(document.cookie);
        return (value != null) ? unescape(value[1]) : null;
    }
</script>

Answer 2

, . " ", , MVC asp.net. , . .

<select id="Selection">
    <option value="">Sort by</option>
    <option value="0">Code</option>
    <option value="1">Title A-Z</option>
    <option value="2">Title Z-A</option>
    <option value="3">Brand</option>
    <option value="4">Lowest price</option>
    <option value="5">Highest price</option>
    <option value="6">Lowest Quantity</option>
    <option value="7">Highest Quantity</option>
</select>

<script>
    $(document).ready(function () {
        var someVarName = JSON.parse(localStorage.getItem("someVarName"));
        if (someVarName.itemNumber != null) {
            var number = parseInt(someVarName.itemNumber) + 1;
            $('select>option:eq(' + number +')').attr('selected', true);
        }

        $("#Selection").change(function () {
            var item = $(this).find(":selected").val();

            $.ajax({
                url: "/Home/MyAction",
                data: { item: item },
                type: 'POST',
                // contentType: 'application/json; charset=utf-8',
                success: function (data) {
                    localStorage.setItem("someVarName", JSON.stringify(data));
                }
            });
        });
    });
</script>

   [HttpPost]
    public JsonResult MyAction(string item)
    {
        return Json(new {itemNumber = item, value = "your data"});
    }

, . .

, ajax , , - , . , -

<select id="Selection">
    <option value="">Sort by</option>
    <option value="0">Code</option>
    <option value="1">Title A-Z</option>
    <option value="2">Title Z-A</option>
    <option value="3">Brand</option>
    <option value="4">Lowest price</option>
    <option value="5">Highest price</option>
    <option value="6">Lowest Quantity</option>
    <option value="7">Highest Quantity</option>
</select>

<script>
    $(document).ready(function () {
        var someVarName = localStorage.getItem("someVarName");
        if (someVarName != null) {
            var number = parseInt(someVarName) + 1;
            $('select>option:eq(' + number + ')').attr('selected', true);
        }

        $("#Selection").change(function () {
            var item = $(this).find(":selected").val();
            localStorage.setItem("someVarName", item);
        });
    });
</script>