ASP.NET MVC混合Razor和JavaScript

How can we pass a JavaScript variable to Razor code?

我们如何将JavaScript变量传递给Razor代码?

Here I have a simple tabs

这里我有一个简单的标签

<div id="AboutDoctor" style="min-height:34vh;">
<div class="row text-center text-primary">@MEDONET.Language.Doctor.Texts.About</div>
<div class="col-xs-2">
    <!-- required for floating -->
    <!-- Nav tabs -->
    <ul class="nav nav-tabs tabs-left">
        <li><a href="#_Info" data-toggle="tab" onclick="GetTabPane('_Info')">@MEDONET.Language.Doctor.Texts.Info</a></li>
        <li><a href="#_Diplomas" data-toggle="tab" onclick="GetTabPane('_Diplomas')">@MEDONET.Language.Doctor.Texts.Diplomas</a></li>
        <li><a href="#profile" data-toggle="tab">@MEDONET.Language.Common.Texts.Licenses</a></li>
        <li><a href="#messages" data-toggle="tab">@MEDONET.Language.Doctor.Texts.Summary</a></li>
        <li><a href="#settings" data-toggle="tab">@MEDONET.Language.Common.Texts.Reviews</a></li>
        <li><a href="#_Contacts" data-toggle="tab" onclick="GetTabPane('_Contacts')">@MEDONET.Language.IndexTexts.Contact</a></li>
    </ul>
</div>
<div class="col-xs-9" style="margin-top:3vh">
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane" id="_Info">@MEDONET.Language.Common.Texts.Loading...</div>
        <div class="tab-pane" id="_Diplomas">@MEDONET.Language.Common.Texts.Loading...</div>
        <div class="tab-pane" id="profile">Licenses</div>
        <div class="tab-pane" id="messages">Summary</div>
        <div class="tab-pane" id="settings">Reviews</div>
        <div class="tab-pane" id="_Contacts">@MEDONET.Language.Common.Texts.Loading...</div>
    </div>
</div>

And by clicking on the tabs user invokes the GetTabPane() function and passes name of the function to it. The function by itself looks like this:

通过单击选项卡,用户可以调用GetTabPane()函数并将函数名称传递给它。该函数本身看起来像这样:

 function GetTabPane(val) {
    $('#'+val).load("@Url.Action("val", "Doctors", new { id = Model.Id })",
        function () { $('#'+val).tab-pane('show') });
 }

Almost all are work except the piece where I'm trying to pass the val as the action name

除了我试图传递val作为动作名称的部分之外,几乎所有工作都是有效的

...Action("val",...

So how it can be to pass a JavaScript value to Razor inside the script block?

那么如何在脚本块中将JavaScript值传递给Razor呢?

1 个解决方案

#1

You can not pass a JavaScript value to Razor. The reason is when in the page page life cycle the code is executed:

您无法将JavaScript值传递给Razor。原因是在页面生命周期中执行代码时:

Razor code is executed on the server before the page is returned to the client

在将页面返回到客户端之前,在服务器上执行剃刀代码

JS code is executed on the client after the page was returned

返回页面后,在客户端上执行JS代码

But you can solve your concrete problem by creating the URL initially with a placeholder, then replace it in the JS code.

但是,您可以通过最初使用占位符创建URL来解决您的具体问题,然后在JS代码中替换它。

<script type="text/javascript">

var urlPattern = '@Url.Action("__ACTION_NAME_TO_BE_REPLACED__", "Doctors", new { id = Model.Id })';

function GetTabPane(val) {
    var url = urlPattern.replace('__ACTION_NAME_TO_BE_REPLACED__', val);
    $('#'+val).load(url, function () { $('#'+val).tab-pane('show'); });
}
</script>

#1