foreach var a in p2 ltligtltinput type34checkbox34 name34pcat34 value39apcat39 autocomplete34off34gtampnbspampnbspapcatltligt ltscriptgt documentreadyfunction 34inputtypecheckbox34clickfunction var cat new Array var a2 3434 var b2 3434 var type new Array

Hi 4ashwaniSolution for this is to use LocalStorage Refer the below sample and modify your codelthtml xmlns34httpwwww3org1999xhtml34gtlthead runat34server34gt lttitlegtlttitlegt ltscript type34textjavascript34 src34httpsajaxgoogleapiscomajaxlibsjquery191jqueryminjs34gtltscriptgt ltscript type34textjavascript34gt function if localStorage ampamp localStorage34checked34 var localStoredData JSONparselocalStorage34checked34 var checkboxes 34inputname39pcat3934 for var i 0 i lt checkboxeslength i for var j 0 j lt localStoredDatalength j if checkboxesivalue localStoredDataj checkboxesichecked true

Retain CheckBox checked after page reload / refresh using jQuery in ASP.Net

4ashwani

SOLVED CLOSED ACTIVE ANSWERED
User: 4ashwani
Posted: on Oct 27, 2017 01:13 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 24828
Sample Code: Download

        @foreach (var a in p2)
        {
            <li><input type="checkbox" name="pcat" value='@a.pcat' autocomplete="off"/>&nbsp;&nbsp;@a.pcat</li>
        }

        <script>
        $(document).ready(function () {
            $("input[type=checkbox]").click(function () {
                var cat = new Array();
                var a2 = "";
                var b2 = "";
                    var type = new Array();
                    $.each($("input[name='pcat']:checked"), function () {
                        a2=a2+' '+$(this).prop('value');
                        alert(a2);
                    });
                    $.ajax({
                        type: "GET",
                        url: "/home/prodss",
                        data:{catt:a2,type:b2},
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success:function(data)
                        {
                            if(data!=null)
                            {
                                window.location.href='@Url.Action("products","Home")';
                            }
                        }
                    });
            </script>

dharmend...

0 1

Reply
ANSWER
User: dharmendr
Replied: on Oct 27, 2017 01:45 AM
Report

Hi 4ashwani,

Solution for this is to use LocalStorage. Refer the below sample and modify your code.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            if (localStorage && localStorage["checked"]) {
                var localStoredData = JSON.parse(localStorage["checked"]);
                var checkboxes = $("input[name='pcat']");
                for (var i = 0; i < checkboxes.length; i++) {
                    for (var j = 0; j < localStoredData.length; j++) {
                        if (checkboxes[i].value == localStoredData[j]) {
                            checkboxes[i].checked = true;
                        }
                    }
                }
                localStorage.removeItem('checked');
            }
            $("input[type=checkbox]").click(function () {
                var data = $("input[name='pcat']:checked").map(function () {
                    return this.value;
                }).get();
                localStorage['checked'] = JSON.stringify(data);
                window.location.reload();
            });
        });   
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input type="checkbox" name="pcat" value="cat1" autocomplete="off" />cat1
        <input type="checkbox" name="pcat" value="cat2" autocomplete="off" />cat2
        <input type="checkbox" name="pcat" value="cat3" autocomplete="off" />cat3
    </div>
    </form>
</body>
</html>

Demo

Retain CheckBox checked after page reload / refresh using jQuery in ASP.Net

Company

Explore

Follow us

Contact Us