The <partial> tag is a Razor construct which is handled on the server side. It’s not something JS or plain HTML will understand.

For the logic to work in the way you require you need to change your Action so that it returns the HTML from the partial view instead of JSON.

The pattern would look something like this, although obviously I’m simplifying due to lack of specific detail on your models or expected HTML output.

[HttpPost]
public IActionResult Test2(int id)
{
    List<Location> p = _context.Locations.Where(x => x.CategoryId.Equals(id)).ToList();
    return View("PartialViewName", p);
}

@model List<Location>

@foreach(var item in Model) 
{
  <div class="sidebar_container">
    <div class="sidebar_list">@item.Foobar</div>
  </div>
}

function yoo(id) {
  $.ajax({
    type: 'POST',
    url: '/Home/Test2',
    data: { 'id': id },
    success: function(result) {
      $('#container').html(result);
    }
  });
}

I need some help with showing the right filtered data from the database.
If the user press a button, then a screen shows up with partial views. Every partial view is a model with it’s own data in it. Im using ajax to make it more dynamical.

Controller:

    [HttpPost]
    public JsonResult Test2(int id)
    {
        List<Location> p = _context.Locations.Where(x => x.CategoryId.Equals(id)).ToList();
        return Json(p);
    }

Partial view:

<div class="sidebar_container" id="style-3">
    <div class="sidebar_list" id="locatieLijstAfter">

    </div>
</div>

Script:

function yoo(id) {
    $.ajax({
        type: 'POST',
        url: '/Home/Test2',
        data: { 'id': id },
        success: function(result){
            var p = "";
            for (var i = 0; i < result.length; i++) {
                $('#locatieLijstAfter').html('< partial name="../Shared/_LocationItemPartial.cshtml" ' + 'model = "' + result[i] + '" /> ');
            }

        }

this is what i have now, but this happens when i run it.
enter image description here