In my .NET web app, I have a process that involves navigating from Page A to Page B where I input a barcode scan result. Page B then displays a table generated by various queries and data inserted into a view model.
What I am seeking is the ability to repeat this process while on Page B. Essentially, when I scan another barcode on Page B, I want it to trigger the same sequence as on Page A: reload Page B with updated results. My approach involves using AJAX to send a parameter to the controller, execute the necessary queries and actions, and return a refreshed View with the updated View Model. However, the issue arises when the page fails to reload with the new data and retains the old information.
I attempted placing the table in a partial view and trying to trigger a reload after each barcode scan on Page B. Unfortunately, this method does not load all the essential JavaScript code embedded within Page B, which is vital for tasks like editing table values. The JavaScript code is integral to Page B, not the separate ".cshtml" partial view.
The AJAX CODE snippet demonstrates how I send an ID to the controller, receive HTML content back, and update a div element containing the partial view of the table:
$.ajax
({
type: 'POST',
url: '@Url.Action("QueryBollaTestP", "Bolla")',
data: JSON.stringify({ 'NumBolla': evt.state.code }),
contentType: 'application/json; charset=UTF-8',
dataType: "html",
success: function (data)
{
$(".tesst").html(data);
},
})
Here's a snippet of the Controller code handling the POST request and returning the updated partial view with the pickingViewModel data for the table:
[HttpPost]
public ActionResult QueryBollaTestP(string NumBolla){
......... perform necessary operations and queries..... populate pickingViewModel for the table
return PartialView("_BollaTable", pickingViewModel);
}
My main objective is to find a solution that ensures the model on Page B reflects the correct data after updates, regardless of whether it involves using a partial view or not. The key requirement is to refresh the page with the accurate information and maintain the execution of the JavaScript code.