Can I reload an asp 5/MVC 6 View Component via ajax?

Question

I am playing around with MVC 6 and have a grid of Users that are currently registered to my site. Above the gird, I have built a View Component for the search/filter functionality. It is invoked via

@Component.Invoke("UserSearchBar")

One of the requirements is to be able to save and reapply the values of the dropdowns so that an end user can quickly access his/her frequently used searches. I have added a dropdown in the View Component of all the saved searches.

Once a user saves a search, I would like to reload the UserSearchBar View Component to update the dropdown list.

My questions are:

1. How do I reload a view component via ajax after a button is pressed?
2. In this scenario, should I use a Partial instead of a view component, because of limitations in view components and reloading?

I could use a Partial inside the View Component for the drop down. Or add an element to the dropdown programmatically but I would still have the same question of reloading the View Component when I click a button to apply one of the saved searches.

---

Solution

After thinking through the problem while writing it out, I have come up with a better (more correct?) way that would not involve reloading the View Component. On save, make an ajax call to the save search method and add an element to the dropdown. And on saved search apply, make a call to a method that would return the saved search and apply it.

However, I would still like to know if it is possible (and how) to reload a View Component in MVC 6.

Answer 1

All you need to do is set up a route in a controller that returns the view component. For example:

public class MyController : Controller {
    public IActionResult GetMyViewComponent() {
        return ViewComponent("MyViewComponent", <arguments...>);
    }
}

You can then make a GET request to this controller via AJAX, and replace the old view component with the result of the request.

As for whether you should use a partial or view component, it is up to you, but I would recommend sticking with a view component because it allows you to keep the relevant logic for the search bar within the component itself.