I have created the banner in a bootstrap modal(it will show in dashboard page if the condition is satisfied). and If we close the button it will disappear it is working fine

But the issue is when i close the banner and if I go to any page and when I back to the dashboard page again it is showing .

My requirement is to show the banner only once in a session(using session storage)and when close and go to another page and then if I go back to the dashboard page It should not show.

index.cshtml

  @if (Model.IsOptinEligible)
        {
            <div class="member-eligibility-popup">
                <div id="memberEligibilityPopup" class="modal fade modalPopup" role="dialog" data-backdrop="static" data-keyboard="false" tabindex="-1">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-body modal-body-content">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h3 class="modal-title bannerModalTitle">["You have access to Coaching!"]</h3>
                                <div class="row">
                                    <div class="col-sm-8">
                                        <p class="modalContent">["A coach can work with you to create a personalized plan and help make sure you stay on track to reach your goal."]</p>
                                    </div>
                                    <div class="col-sm-4">
                                        <a href="#" class="banner-modal-button">@_Localized["Get Started Now"]</a>
                                    </div>
                                </div>
                            </div>
                                </div>
                            </div>
                 </div>
            </div>

        }

@if (Model.IsOptinEligible == true)
{
    <script>
        $(function () { $("#memberEligibilityPopup").modal('show'); });
    </script>
}

Can anyone help me on this

CodePudding user response：

Use session storage

if(!sessionStorage.getItem('shown')) { 
  /* show it here */
  // Mark it as shown
  sessionStorage.setItem('shown', '1');
}