Umbraco v9 Call Specific Controller Method and pass parameter

Question

I would like to call specific action method with a parameter and retrieve data from the controller in Umbraco v9.

public class SearchResultController : RenderController
{
    private readonly UmbracoHelper UmbracoHelper;
    private readonly IPublishedValueFallback PublishedValueFallback;
    private ISearchRepository SearchRepository;

    public SearchResultController(ILogger<ContentPageController> logger, ICompositeViewEngine compositeViewEngine, IUmbracoContextAccessor umbracoContextAccessor,
        IPublishedValueFallback publishedValueFallback,
        UmbracoHelper umbracoHelper, ISearchRepository searchRepo
        )
        : base(logger, compositeViewEngine, umbracoContextAccessor)
    {
        UmbracoHelper = umbracoHelper;
        PublishedValueFallback = publishedValueFallback;
        SearchRepository = searchRepo;
    }

    [HttpGet]
    public override IActionResult Index()
    {
        var model = new SearchResult(CurrentPage, PublishedValueFallback);
        return View("~/Views/SearchResult.cshtml", model);
    }

    [HttpPost]
    public IActionResult SearchResult(string searchString)
    {
        var results = SearchRepository.SearchString(searchString);
        var model = new SearchResult(CurrentPage, PublishedValueFallback);
        return View("~/Views/SearchResult.cshtml", model);
    }
}

View:

function Search() {
debugger;
var searchString = document.getElementById("searchLabel").value;
var url = "www.test.com/search?searchString=" + searchString;
location.href = url;
}

I have also tried with @Html.Actionlink method, but I really can't make it work to properly redirect and pass the parameter. If i type the link manually and correctly in browser, the value also gets passed into the controller (debugger shows everything is ok). Thanks for all the Help!

Answer 1

With Umbraco 9 being on dotnet 5+, we now use ViewComponents for this - https://our.umbraco.com/Documentation/Reference/Templating/Mvc/ViewComponents

so for example, you might have a ViewComponent to render your SearchResult list something like this:

using Microsoft.AspNetCore.Mvc;
using MyProject.Core.Models.View;
using MyProject.Core.Services;

namespace MyProject.Core.ViewComponents
{
    public class SearchResults: ViewComponent
    {
        private readonly ISearchRepository searchRepo;
        private readonly UmbracoHelper umbraco;
        private readonly IPublishedValueFallback publishedValueFallback;

        public SearchResults(
            UmbracoHelper umbraco, 
            IPublishedValueFallback publishedValueFallback,
            ISearchRepository searchRepo)
        {
            this.searchRepo = searchRepo;
            this.umbraco = umbraco;
            this.publishedValueFallback = publishedValueFallback;
        }

        public IViewComponentResult Invoke(string searchString)
        {
            var results = SearchRepository.SearchString(searchString);
            var model = new SearchResult(umbraco.AssignedContentITem, publishedValueFallback);
            return View(model);
        }
    }
}

Then, create the Default ViewComponent cshtml class in the /Views/Shared/Components/SearchResults directory (named Default.cshtml) something like this:

@inherits UmbracoViewPage<SearchResult>

<!-- Your View code goes here -->

You can render ViewComponents in your templates a couple of different ways, but my favourite is to use the tag-helper format - to do so, register your assembly containing them in your _ViewImports.cshtml file:

@addTagHelper *, MyProject.Core

And then you can you can place them in your templates like so:

<vc:search-results search-string="hello"></vc:search-results>

Microsoft Docs Reference: View components in ASP.NET Core