Razor 将页面返回到 Post 方法中的特定位置

Question

So idea is Id like the user to click a button, have the page submit through the post method which will populate fields for a form, then return the page with a modal displayed. I have this working, except the issue is that the page is at the top even if the user clicked halfway down. Id like the page to redisplay where it was, with the modal displaying.

I know that there is a fragment parameter, but only for redirecttopage and not page()? Sending it back to get resets everything, so thats not realy ideal. Ive also tried altering the url with javascript which works with setting the page position, but somehow it will not display the modal with that?

Does anyone know how to easily return the page in the post method to a specific spot on the page?

Javascript: (Modal shows up for one second then disappers when it goes to the page position)

        function OnLoad() { //Used for redisplaying on error purposes
            if ("@TempData["EditingParty"]" == "Yes") {

                var loadedURL = window.location.href;
                var fragmentPieceOfURL = "@TempData["EndOfURL"]"

                location.href = loadedURL + fragmentPieceOfURL;

                document.getElementById("EditUsersForm").style.display = "inline-block";


            }
            else {
                document.getElementById("EditUsersForm").style.display = "none";
            }


    }

Cshtml Button that goes to post (i is counter to keep track of anchor tag for redisplay location):

<a id="@i"></a>

<button type="submit" style="white-space:nowrap" class="btn btn-secondary btn-sm" formnovalidate asp-page-handler="DisplayEdit" asp-route-id="@Model.UsersOnCaseList.ElementAtOrDefault(i).UserID" asp-route-AttorneyRole="@Model.UsersOnCaseList.ElementAtOrDefault(i).AttorneyRole" asp-route-email="@Model.UsersOnCaseList.ElementAtOrDefault(i).EmailAddress" asp-route-pAttorneyRoleID="@Model.UsersOnCaseList.ElementAtOrDefault(i).AttorneyRoleID" asp-route-PageFragment="@i" asp-route-pEditAttorneyUserID="@Model.UsersOnCaseList.ElementAtOrDefault(i).UserID">Edit <i class="fas fa-ribbon"></i></button>

Modal:

<div class="modal" tabindex="-1" role="dialog" id="EditUsersForm" style="display:none">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Edit User</h5>
                        <button type="button" onclick="closeEditUsersForm()" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="form-group" style="margin-top:15px;padding-left:15px">
                        <label asp-for="EditUserEmailInput"></label> <span class="red">*</span>
                        <input asp-for="EditUserEmailInput" class="form-control" id="EmailInputBox" value="@Model.EditUserEmailInput" style="display:block;width:25em" />
                        <span style="display:block" asp-validation-for="EditUserEmailInput" class="text-danger" id="AddUserInputValidation"></span>

                    </div>
                    <div class="form-group" style="margin-top:15px;padding-left:15px">
                        <label class="control-label">Role</label> <span class="red">*</span>
                        <select asp-for="AttorneyRoleIDEditForm" asp-items="@(new SelectList(Model.AttorneyRolesList, "AttorneyRoleID","AttorneyRole"))" name="AttorneyRoleIDEditForm" id="SelectAttorneyRoleIDEditForm" class="form-control" style="width:25em" onchange="DidSelectPlaintiffEdit()">
                            <option class="form-control" value=-1>Select a Role</option>
                        </select>
                        <span asp-validation-for="AttorneyRoleIDEditForm" class="text-danger"></span>
                    </div>
                    <div class="form-group" style="margin-top:15px;padding-left:15px">
                        <label asp-for="EditUserPartyInput"></label>  <span class="red">*</span><br />
                        <input asp-for="EditUserPartyInput" value="@Model.EditUserPartyInput" class="form-control" id="PartyNameInputEdit" style="display:inline-block;width:25em" />
                        <span style="display:block" asp-validation-for="EditUserPartyInput" class="text-danger" id="PartyNameInputValidation"></span>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-primary" style="margin:0 auto" asp-page-handler="SaveUserEdits" asp-route-UserBeingEdited="" id="EditSubmitButton" name="EditUserSubmit" value="Yes">Submit</button>
                        <button class="btn btn-primary" style="margin:0 auto; display:none" asp-page-handler="SaveUserEdits" disabled id="SubmitButtonDisabled" name="AddUserSubmit" value="Yes">Submit</button>
                    </div>
                </div>
            </div>
        </div>

CS file:

 public IActionResult OnPostDisplayEdit(int id, string email,string AttorneyRole,int pAttorneyRoleID,int pAttorney,int pEditAttorneyUserID,int PageFragment)
        {

            EditUserEmailInput = email;

            string curDictionaryAttorneyRole;

            if (AttorneyRole.Contains('('))//Just because in development user didnt always have ability to enter a party
            {

                curDictionaryAttorneyRole = AttorneyRole.Split(new[] { '(' }, 2)[0].Trim();

                EditUserPartyInput = AttorneyRole.Split(new[] { '(' }, 2)[1];

                var LastRightParenIndex = EditUserPartyInput.LastIndexOf(')');

                EditUserPartyInput = EditUserPartyInput.Substring(0, LastRightParenIndex); //Pulling the right parenthesis out
            }
            else //Its just the dictionary role
            {
                curDictionaryAttorneyRole = AttorneyRole;
                EditUserPartyInput = null;
            }

            TempData["EditingParty"] = "Yes";
            TempData["EndOfURL"] = PageFragment.ToString() + "&#" + PageFragment.ToString();

            SetFileSequenceField();
            ModelState.Clear(); //Used to remove the validations
            SetAttorneyRoleList();

            var selectedIndex = AttorneyRolesList.Where(arl => arl.AttorneyRole == curDictionaryAttorneyRole).Select(arl => arl.AttorneyRoleID).FirstOrDefault();

            AttorneyRoleIDEditForm = selectedIndex;
            EditAttorneyUserID = pEditAttorneyUserID;
            UneditedEmail = email;
            UneditedAttorneyRoleID = pAttorneyRoleID;
            PopulateUserList();
            //return RedirectToPage("AddUsersToCase","GET",fragment:PageFragment.ToString());
            return Page();

            //var PageURL = Page();

            //PageURL = PageURL. + "&#" + PageFragment.ToString();

            //return PageURL;
        }

Answer 1

You can try to replace

location.href = loadedURL + fragmentPieceOfURL;

to

history.pushState({}, null, loadedURL + fragmentPieceOfURL);

So that the page will not be refreshed with location.href .