I want to show a partial view when user clicks on a Button not on page load. I am facing an issue, partial view always comes on page load and on button click. I am not able to hide it on page load. This is _projectView.cshtml a partial view

@Html.Hidden("SessionProjectId", Convert.ToString(Session["PId"]))   
<div id="projectModal"  >
    <div >
        @(Html.Kendo().ComboBox()
    </div>
</div>

<script type="text/javascript">

    function showProjectModal(projectId) {
        $('#projectModal').modal({
            backdrop: 'static', keyboard: false
        });
    
        if (projectId > 0) {
            $("#ProjectCombo").data("kendoComboBox").value(projectId);
        }
        else {
            $('#projectModal').find('.close').hide();
        }
    }
</script>

This is _login (this also a partial view common for project) page from where _projectView.cshtml get initialized using showProjectModal button function. Below code also shows popup on page load(which I don't want).

<div>@Html.Partial("_ChooseProject")</div>  
<div >
    <div >
        <div>
            <button type="button"  onclick="showProjectModal(@Session["ProjectId"] );">Project: <span id="projectLabel">@Session["ProjectName"]</span></button>
        </div>
    </div>
</div>

This is a Popup which comes on top center of the screen. When I try to hide it on page load using css/js, it hides but left the screen locked/blur. I can't click anywhere.

How can I stop showing _projectView.cshtml from _login.cshtml on page load ?

CodePudding user response：

Below are some logic with which you can restricted the event.

1. If you identify the @Session["ProjectId"] is nullor less than 1 then you can place a condition under your showProjectModal function. if projectId having data then only you initialize else nothing.

2. Another Option is that you can fill ViewBag from the controller end from the Login page . to identify request came from login so you can render script dynamically.

3. Also you can handle with URL with the help of the JavaScript you can retrieve and check condition if login page no need to render/load event.

4. You can also use Section as partial view to load your content.

Please some more details so will guide you more.