I have a web page with a couple of view ponents, when I click on these ponents I open a simple editor for it, see image below. If I edit the text and hit enter, I would like to rerender the view ponent and not the hole page. Is it possible to invoke a view ponent using javascript to get this behaviour?

I have a web page with a couple of view ponents, when I click on these ponents I open a simple editor for it, see image below. If I edit the text and hit enter, I would like to rerender the view ponent and not the hole page. Is it possible to invoke a view ponent using javascript to get this behaviour?

• javascript
• asp-core

2 Answers 2

With updates, you should now be able to do this with asp core. You can return a ViewComponent from an IActionResult, then just call it with jQuery:

[Route("text-editor")]
public IActionResult TextEditor()
{
    return ViewComponent("TextEditorViewComponent");
}

Then this can be called from your View with something as simple as this:

function showTextEditor() {
    // Find the div to put it in
    var container = $("#text-editor-container");
    $.get("text-editor", function (data) { container.html(data); });
 }

If you need to pass parameters to the ViewComponent you can do so in the IActionResult (maybe they trickle through from the View to there, to the view ponent, etc).

This is not possible today but you could build a standard proxy for viewponents if you'd like though (similarly you could build a proxy to partial views). e.g. you a catchall attribute route on an action.