Récupérer position scrollbar

Bonjour,

Je bosse sur un projet en JS /C# / ASP.NET… Et j’ai une page avec un tableau navigable avec une scrollbar verticale.
Je voudrais pouvoir garder la position de la scrollbar quand je clique sur une autre page puis reviens sur ce tableau.
J’ai créé un script JS via jquery pour stocker la variable de la position dans un cookie :

Code:

1
2
3
4
5
6
7
8
9
<script type="text/javascript">  
  if(typeof($.cookie(cookieSelectedReference)) != 'undefined'){
    var scrollBox = $('#scrollable-outer');
    var selectedRow = scrollBox.find('#ref-'+$.cookie(cookieSelectedReference));
    if(selectedRow.length){
      selectedRow.trigger('click');
    }
  }    
</script>

Je garde donc ma variable de la position de la scrollbar et le lien de la page dans mon cookie sur l’événement click.
Par contre je n’arrive pas à réutiliser / récupérer ma position de la scrollbar quand je retourne sur mon tableau.

Ma page ASPX :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<div id="regulation-mapping-wrap">
 
    <div id="scrollable-outer">
        <table class="sticky-header">
            <thead>
                <tr class="head-row">
                    <th class="col-1"></th>
                    <th class="col-2 sortable" title="@Html.Resource("REGMAPPING_SORT_BY_TYPE")" data-sort="string"><a href="#">@Html.Resource("REGMAPPING_COL_TYPE")</a></th>
                    <th class="col-3">@Html.Resource("REGMAPPING_COL_REFERENCE")</th>
                    <th class="col-4 sortable desc" title="@Html.Resource("REGMAPPING_SORT_BY_DATE")" data-sort="date" data-sort-dir="desc"><a href="#">@Html.Resource("REGMAPPING_COL_DATE")</a></th>
                    <th class="col-5">@Html.Resource("REGMAPPING_COL_DESCRIPTION")</th>
                    <th class="col-6">@Html.Resource("REGMAPPING_COL_LINKS")</th>
                    <th class="col-7"></th>
                </tr>
            </thead>
            <tbody>
                @{
                    int n = 0;
                    foreach (var reg in Model.Regulations)
                    {
                        @Html.RegulationMappingRow(reg, n);
                        n++;
                    }
                }
            </tbody>
        </table>
    </div>
</div>
 
 
<!-- modal popup to view documents list -->
<div id="dialog-document-list" title="@Html.Resource("REGMAPPING_DOCUMENTS")" class="d-hidden modal">
    <ul class="naked document-list">
        <li id="fr-doc-item" class="item">
            <a class="file" href="#" target="_blank">
                <span class="icon file-extension pdf"></span>
                <span class="name">@Html.Resource("BTN_FR_DOC_LINK")</span>
            </a>
        </li>
        <li id="en-doc-item" class="item">
            <a class="file" href="#" target="_blank">
                <span class="icon file-extension pdf"></span>
                <span class="name">@Html.Resource("BTN_EN_DOC_LINK")</span>
            </a>
        </li>
    </ul>
</div>
 
@section JsSection{
    <script type="text/javascript">
        function getRegulationDocs(enDocUrl, frDocUrl) {
            $('#en-doc-item').css('display', 'none');
            $('#en-doc-item > a').attr('href', '#');
            $('#fr-doc-item').css('display', 'none');
            $('#fr-doc-item > a').attr('href', '#');
            if (frDocUrl != "")
            {
                $('#fr-doc-item').css('display', 'block');
                $('#fr-doc-item > a').attr('href', frDocUrl);
            }
            if (enDocUrl != "") {
                $('#en-doc-item').css('display', 'block');
                $('#en-doc-item > a').attr('href', enDocUrl);
            }
            $('#dialog-document-list').dialog('open');
        }
    </script>

Une petite idée de la façon de m’y prendre et ce qui cloche dans mon code ?

Merci.