Is it possible to not reload the View completely after closing the dialog?

Question

JavaScript

The essence of the problem: a dialog box opens on the main page via Html.ActionLink(), data is entered in it. The dialog box uses a separate View and its own Model. After closing the dialog, the page reloads completely, I return it in the controller via RedirectToAction(). Scrolling page and reloading completely is not an option. For dialogue I use the following script:

<script>
    $(document).ready(function () {
        $.ajaxSetup({ cache: false });
        $(".openDialog").on("click", function (e) {
            e.preventDefault();

            $("<div></div>")
                .addClass("dialog")
                .attr("id", $(this)
                .attr("data-dialog-id"))
                .appendTo("body")
                .dialog({
                    title: $(this).attr("data-dialog-title"),
                    close: function () { $(this).remove() },
                    modal: true
                })
                .load(this.href);
        });

        $(".close").on("click", function () {
            $(this).closest(".dialog").dialog("close");
        });
    });
</script>

How to load new data without refreshing the page completely? The scrolling page jumps and it's terribly inconvenient.

Answer 1

Have you tried returning instead of RedirectToAction() - Json() for example? Return a dataset with the result of the operation and new data to update the interface.