通过Jquery在C#razor中填充一个变量

Posted 2023-05-08

【中文标题】通过Jquery在C#razor中填充一个变量

【英文标题】：Fill a variable in C # razor through the Jquery

【发布时间】：2019-11-12 02:46:49

【问题描述】：

借助 SignalR（实时）库，我有一个检索数据的函数

我想在 Url.Action 的参数中将此列表传递到我的控制器中。

<td>
    @
        var Users = new List<UserConnected>();

    

    @html.Hidden("listUserConnected", "", new  id = "listUserConnected_" + @item.SET_NOM )
    <h3 class="text-warning"><span style="color: black" id="[e-mail]_NOM" onclick="chargementVuePartielleInModal('@Url.Action("DetailUsersConnected", "Parametrages", new module = Users)')">0</span></h3>
</td>

......

chat.client.UpdateCountAccueil = function (count, listUsers) 
    //$('#@(Users)').push(listUsers);
    console.log("count accueil :" + count);
    $.each(listUsers, function (index, value) 
        console.log("listUsers : " + index + "  " + value.UserName);

    );


    $('#NombreConnection_Accueil').text(count);

如何在 ASP.NET（带有剃刀）中通过 javascript 中的函数填充变量？

我想用 js“listUsers”函数中的列表填充我的用户列表。最后通过 Url.Action 发送了我的控制器中填写的用户列表。

我尝试了几种技术，包括：

$('#@(Users)').push(listUsers);

和

$.each(listUsers, function (index, value) 
    console.log("listUsers : " + index + "  " + value.UserName);
    @Users.Add(listUsers);  <-- ***listUsers not know*** 
);

但这并没有改变什么

【问题讨论】：

您需要从 Javascript 写入 html。 razor 引擎是一种在 Web 服务器上而不是在 Bowser 上运行动态网页的技术。在浏览器上呈现的是来自 razor 引擎的输出 html。我在这里为选择列表回答了类似的问题***.com/questions/56537153/…

【参考方案1】：

你不能这样做，你应该使用 JavaScript 和 ajax 请求来做到这一点。 因为剃须刀页面被渲染，然后服务器将 html 发送到您的浏览器。 您可以使用 ajax 发送用户列表

【参考方案2】：

您将不得不改变对 Razor 页面的看法。基本上你可以保留你的 Razor 视图，但你需要使用像 Vue、React 等客户端框架来更好地处理所有客户端/ajax 事件。如果你想让某些东西快速运行，你可能仍然可以使用https://knockoutjs.com/。

查看https://knockoutjs.com/examples/helloWorld.html 以获取示例，但基本上您可以从 Razor 将初始加载到 json 并继续使用客户端代码处理其他所有内容。

https://www.dotnetcurry.com/aspnet-mvc/933/knockoutjs-aspnet-mvc-tutorial-beginner https://docs.microsoft.com/en-us/aspnet/single-page-application/overview/introduction/knockoutjs-template

如果您想跳入流行的解决方案，可以研究 React、Vue 和 Angular。 Angular 有点重，所以如果你不想搞乱路由，你可能想从 Vue 和 React 开始，并从每个视图类型的应用程序开始。

【参考方案3】：

你不能通过 javascript 来做。您必须使用 ajax 调用来从服务器检索数据，如下所示：

function getLists()
            $.ajax(
                url: controller/action,
                method: 'POST',
               //if you need parameters
                data: parameter:parameter,
                //the list that you return from your controller
                success: function (data) 
                    $('#Users').push(data)
                
            );