0

I am a beginner here. I am working on this ASP.NET Core MVC project where I am trying to load Update.cshtml in <div id="divInventoryPageLoad"></div> in Index.cshtml as a PartialView. However, I am not getting any output in the <div id="divInventoryPageLoad"></div> in Index.cshtml when I run the code. On checking Inspect Element from the browser, I see that I am getting the error: POST http://localhost:52880/Inventory/Update 500 (Internal Server Error)

Index.cshtml

<div class="pm-body clearfix">
<div role="tabpanel">
    <ul class="tab-nav" role="tablist">
        <li class="active" role="presentation">
            <a href="#inventoryDetails" aria-controls="inventoryDetails" role="tab" data-toggle="tab" aria-expanded="true" onclick="LoadInventoryUpdateDetails(@ViewBag.InventoryId)">Inventory Details</a>
        </li>
        <li id="inventorylocatetab">
            <a href="#inventoryLocate" aria-controls="inventoryLocate" role="tab" data-toggle="tab" aria-expanded="true" onclick="LoadInventoryLocate()">Inventory Locate</a>
        </li>
    </ul>
</div>
<div id="divInventoryPageLoad"></div>
</div>

@section Scripts{
<script type="text/javascript">
    $(document).ready(function () {
        $('#divInventoryPageLoad').load('/Inventory/Update', { Id:@ViewBag.InventoryId }, function() {
        });

    })

    function LoadInventoryUpdateDetails(Id) {
        $('#divPageLoad').load('/Inventory/Update', { Id:Id }, function() {
        });

    }

    function Locate() {
        $('#divPageLoad').load('/Inventory/Locate');

    }
</script>

}

Controller

    // GET: /Inventory/
    public IActionResult Index(int Id)
    {
        ViewBag.InventoryId = Id;
        return View();
    } 

    // GET : ~/Inventory/Update/Id
    public IActionResult Update(int Id)
    {
        ...
    }

The ActionMethod for Update is not getting hit when I test with the help of breakpoints. What to do?

4 Answers4

0

From the docs at http://api.jquery.com/load/

"The POST method is used if data is provided as an object; otherwise, GET is assumed."

You are causing the request to send via POST, but the way you have things set up in the controller it won't work because it is looking for id to be in the URL, not in the POST data inside the request body.

Your best bet is just to concatenate the id in the URL like Ehsan said; that would change the request to GET and everything would be happy. If you insisted on keeping it POST (which wouldn't make much sense if it's idempotent and just returning chunks of HTML), you would need to add [FromBody] to the parameter.

Paul Abbott
  • 7,065
  • 3
  • 27
  • 45
0

The syntax you are using is when we are doing a POST request not a GET.

So, when the request goes it might not be able to find the action with name update that can accept POST request or might be parameters that the POST request method accepts are different.

Your action method is HttpGet and you need to send a GET call via load.

So,you need to write it like:

$('#divInventoryPageLoad').load('/Inventory/Update?id='+@ViewBag.InventoryId)
Ehsan Sajjad
  • 61,834
  • 16
  • 105
  • 160
0

Appears from the error that the .load() function is performing a POST and the controller action is a GET.

Sprinkle the action with [HttpPost]

[HttpPost]
public IActionResult Update(int Id)
{
    ...
}

SUGGESTION

I would suggest any action that modifies data be a POST only action and from the name of your action I would assume it is modifying some data. This other question, has a good breakdown as to why.

Steve0
  • 2,233
  • 2
  • 13
  • 22
0

I think you are using the wrong url. You can try

$('#divInventoryPageLoad').load('/Inventory/Update?id=@ViewBag.InventoryId')

or

$('#divInventoryPageLoad').load('/Inventory/Update/@ViewBag.InventoryId')
Rodrigo Werlang
  • 2,118
  • 1
  • 17
  • 28