Insert Javascript variable into Html.Partial ViewDataDictionary ASP.NET MVC

Question

I have a javascript function and when it is called I want to insert a partial into a div. All is working fine, but, when I want to pass some javascript into Html.Partial ViewDataDictionary, it isn't passing the rendered javascript.

<script>

function addExperience() {

     @{var uid = @MvcHtmlString.Create("new Date().getTime()");}
     console.info(@uid); //output ok !

     var partialView = @(Html.Raw(JsonConvert.SerializeObject(Html.Partial("~/Views/Dashboard/_editUserExperience.cshtml", Model,  new ViewDataDictionary { { "id", uid } }).ToString().Trim('"'))))

     $("#newExperienceSection").append(partialView); //it renders "new Date().getTime(), not the number
}

</script>

Thank you !

Razor code (Html.Raw, Html.Partial) is parsed on the server before its sent to the client. A javascript variable does not even exist at that point - its not in scope. — user3559349
– user3559349, Commented Feb 27, 2015 at 9:51
"View Page Source", what does the rendered addExperience() code look like? — musefan
– musefan, Commented Feb 27, 2015 at 9:52
Unfortunately it is rendered all partial content with "new Date().getTime()" ... Do you know a better method to insert a partial view dynamically ? — RaduGabor
– RaduGabor, Commented Feb 27, 2015 at 10:01
as Stephen mentioned, Razor is parsed on server and at that time you will not have javascript code, so what you can do is, once your page is loaded you can have an ajax to simply get your partial view and append it in newExperienceSection — Mox Shah
– Mox Shah, Commented Feb 27, 2015 at 10:04
@RaduGabor: So the problem is you are rendering a string? What happens if you remove ToString().Trim()? This should technically work if you are using Raw and you have the correct content format in your partial. However, I worry what that SerializeObject may be producing, you sure you need that? — musefan
– musefan, Commented Feb 27, 2015 at 10:26

Rui · Accepted Answer · 2015-04-13 10:51:04Z

If you call Jsonconvert.SerializeObject with a string (Html.Partial returns a string), it returns a string.

So you statement var partialView = ... will be rendered as

var partialView = "the contents of the partial view";

That's why, when you do this:

$("#newExperienceSection").append(partialView);

it actually displays the javascript as text.

If you want to get a partial view to execute javascript, you can return javascript inside script tags, and as soon as you add that to the DOM it gets executed, for example if you set your _editUserExperience.cshtml as this:

<script>
  alert('this gets executed as soon as you do add this to the DOM with the jQuery append command');
</script>

When you execute $("#newExperienceSection").append(partialView); you'll see the alert.

An easier way to insert a partial view is to take advantage of $.ajax, for example, in addExperience:

$.get('@Url.Action("ActionMethodThatReturnsPartial", "YourController")').done(function(theHtmlReturned) { 
  $("#newExperienceSection").html(theHtmlReturned);
});

($.get is just shorthand for $.ajax using a get request)

Source: http://api.jquery.com/jquery.ajax/

http://api.jquery.com/jquery.get/

http://api.jquery.com/category/deferred-object/

Collectives™ on Stack Overflow

Insert Javascript variable into Html.Partial ViewDataDictionary ASP.NET MVC

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related