Pass JSON data to strongly typed partial view in ASP.NET

Question

Question:
What's the best way to pass JSON data in javascript to an ASP.NET MVC strongly typed partial view?

Details:
I'm developing on a Win7 machine using VS2013 Express for Web.
I have a strongly-typed partial view using a class Workorder:

@model WebApplication1.Models.WorkOrder.WorkOrder
<h3>Partial Result:</h3>
Name: @Model.woName
<br />
SN: @Model.woSN
<br />

I make an AJAX call in my javascript on a Razor view page, that returns JSON data called "data":

function showPartial(data) {
    @{
        WorkOrder w = Json.Decode(<text>data</text>, WorkOrder);
        @Html.Partial("PartialWOTop", w);
    }
}

However, the view page won't process properly. I get the following error:

 Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS1525: Invalid expression term '<'

Source Error:


Line 36:         function showPartial(data) {
Line 37:             @{
Line 38:                 WorkOrder y = Json.Decode(<text>data</text>, WorkOrder);
Line 39:                 @Html.Partial("PartialWOTop", y);
Line 40:             }


Source File: c:\Users\xupd48act\Documents\Computer\Dev\VS Projects\WebApplication1\WebApplication1\Views\BacklogTracker\Index.cshtml    Line: 38

The first parameter to Json.Decode() should be a JSON string, but your example has (unquoted) XML ... am I missing something? — David
– David, Commented Dec 30, 2014 at 20:29

iCollect.it Ltd · Accepted Answer · 2014-12-30 23:16:39Z

2

You are trying to inject client-side code into the server-side generation of the partial view. That is not the way MVC partial views work. The partial view is already rendered before the page is supplied to the browser (i.e. long before the client side jQuery is run).

Instead you need to POST/GET the data to a controller method, return your partial view based on that data, and then render the returned HTML by inserting it into your page.

e.g. something like this:

function showPartial(data) {
    $.ajax({
       url: "controller/action",
       data: data,
       dataType: html,    // Expect back HTML
       success: function(html){
           $('#someelement').html(html);
       }
    });
}

or the shorter version using $.load:

function showPartial(data) {
    $('#someelement').load( "controller/action", data );
}

The server-side MVC controller method needs to take the data and return a partial view (as it probably does now). You need to show your controller code if you need more details :)

edited Dec 30, 2014 at 23:16

answered Dec 30, 2014 at 23:05

iCollect.it Ltd

93.9k26 gold badges189 silver badges210 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aaron Thomas Over a year ago

Ahhh yes okay that explains it for a newbie. Thank you!

Collectives™ on Stack Overflow

Pass JSON data to strongly typed partial view in ASP.NET

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related