How to implement in such a way that JavaScript gets executed within the Razor's @Html.Raw?

Question

Here are some details about our development environment:

-DevExpress 20.2.3 ( we are using DevExtreme )

-Microsoft Visual Studio Enterprise 2019 (Version 16.4.6)

-ASP.NET Core 3.1.0

-AspNetCore.Mvc 3.1.0.0

If I implement the following then document object is Not defined:

 @using (Html.DevExtreme().NamedTemplate("upload-popup-template")) {
 
 @await Html.PartialAsync("UpldPopupContentTmpltPartial", new  HomeUpldPopupContentTmpltPartialViewModel()
 { SelectedUploadDataType =
 document.getElementById('HiddenSelectedUploadDataType').Value });
      }

Even if I try to embed within Script javascript tags, it still states that document object is undefined

@using (Html.DevExtreme().NamedTemplate("upload-popup-template")) {
 &lt;script type="text/javascript"&gt;
     @await Html.PartialAsync("UpldPopupContentTmpltPartial", new HomeUpldPopupContentTmpltPartialViewModel()
 { SelectedUploadDataType =
 document.getElementById('HiddenSelectedUploadDataType').Value });
     &lt;/script&gt; }

Could some please modify the following Razor/Javascript code in such a way that the JavaScript gets executed within the @Html.Raw ?

 @using (Html.DevExtreme().NamedTemplate("upload-popup-template")) {
 
 @await Html.PartialAsync("UpldPopupContentTmpltPartial", new
 HomeUpldPopupContentTmpltPartialViewModel()
 { SelectedUploadDataType =
 @Html.Raw("document.getElementById('HiddenSelectedUploadDataType').Value").ToString()
 }); }

JavaScript gets executed in the browser context. You're trying to execute it in the server context. Just not going to happen. — Heretic Monkey
– Heretic Monkey, Commented Dec 3, 2020 at 17:23
To add to what @HereticMonkey said. These two things happen separately. Anything in razor syntax will have already been compiled before reaching the user. Which means anything happening inside @... will know nothing about your javascript or what to do with it. Your best bet is to create a link with your javascript/html that targets a controller action accepting your param "HiddenSelectedUploadDataType" which sends back the VM you need in a partial view. — WiseGuy
– WiseGuy, Commented Dec 3, 2020 at 18:40

PeterS · Accepted Answer · 2020-12-03 22:10:25Z

1

Correct me If I’m wrong but from DevExtreme NamedTemplate you are trying to pass on of its JS values to external partial razor view.

What you need to do is to make sure that JS will be embed into Razor syntax, inside template. To achieve this please use JS() Expression.

Sample template passing local JS variable to external partial Razor View:

TestRazorView.cshtml

Please also read more about JS() Expression: https://docs.devexpress.com/AspNetCore/401153/devextreme-based-controls/concepts/razor-syntax/specify-options#new-js-expression

Please also read more about DevExtreme Templates: https://docs.devexpress.com/AspNetCore/401029/devextreme-based-controls/concepts/templates

edited Dec 3, 2020 at 22:10

answered Dec 3, 2020 at 18:46

PeterS

886 bronze badges

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

Collectives™ on Stack Overflow

How to implement in such a way that JavaScript gets executed within the Razor's @Html.Raw?

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