從jquery設置razor變量中的值

Question

我有一個觀點，我想從jQuery中設置razor變量的值。 我這樣想

@{
    ViewBag.Title = "Products";
    Layout = "~/Views/Shared/_Layout.cshtml";
    string ip_address = "";
}

<script type="text/javascript">
    $(function () {
        $.get("http://ipinfo.io", function (response) {
            console.log("ip+" + response.ip);
            '@ip_address' = response.ip;

        }, "jsonp");
    });
</script>

但這是拋出一個錯誤Uncaught ReferenceError: Invalid left-hand side in assignment

Answer 1

您想要做的事情在技術上是不可能的 - 正如評論和其他答案已經注意到的那樣。

為了總結為什么這不起作用，Razor是一個視圖引擎 ，它使用在頁面請求時在服務器上執行的C＃代碼，以便構建發送給客戶端的HTML 響應 。

客戶端沒有引用Razor變量，並且Razor視圖引擎無法訪問JavaScript變量 - 盡管它可以在腳本塊中輸出JavaScript，該腳本塊在頁面加載時設置變量的初始值。

即使JavaScript可以訪問Razor變量，它也只會在頁面被傳遞到客戶端設備上的用戶代理（瀏覽器的外行術語）時執行，而且你做任何條件都為時已晚此時渲染，顯示/隱藏數據或安全檢查，或在視圖中使用變量。

如果您只需要客戶端IP地址，那么您已經可以通過Request對象的UserHostAddress屬性在控制器中訪問它。 根據您的想法，您可以通過ViewBag將其從控制器傳遞到視圖並呈現它（'您的IP地址是......'），或者如果您出於安全目的使用它，請將其用於控制器過濾返回到視圖的操作，或者確定是否應該向用戶呈現視圖（通常不應在視圖本身內執行業務/域邏輯）。

這也意味着您不依賴於第三方服務 - 您的Web服務器必須知道請求該頁面的用戶的IP地址，因為它使用此服務將響應發送回其瀏覽器。

如果您想要只能從瀏覽器確定的其他數據，例如正在呈現頁面的“視口”（瀏覽器窗口）的大小 - 最好的辦法是使用Ajax請求將其發送到控制器行動與No1_Melman的回答一樣。

Answer 2

我想我已經明白你要做什么了。

我強烈認為你對ASP.NET的了解還不夠，無法實現你想做的事情。 因此，我強烈建議您閱讀有關codeproject和asp.net的更多教程，以便您可以完全理解MVC框架以及如何使用它。

原始響應

如果需要，您可以將該信息直接發布到您的服務器：

$(function () {
    $.get("http://ipinfo.io", function (response) {
        $.post("/MyController/Action", response);
    }, "jsonp");
}) 

Razor僅用於渲染輸出。 因此，一旦您在瀏覽器中查看該頁面，它將與剃刀具有ZERO關系，即不與其進行交互。

我的代碼沒有加載部分，但是，一旦你加載了初始頁面（觸發到ipinfo的那個），你可以使用JavaScript來呈現UI。 我的代碼使用jQuery將IP響應發布到MVC中的一個動作，所以在我的/MyController/Action ，你用/Home/_ProductList替換。 順便說一下，你不應該用“_”為Action添加前綴

因此，根據您所說的，您希望加載部分內容而不是操作，由於您編寫的代碼，評論會讓我感到困惑。 我將如何做到這一點：

@{
    ViewBag.Title = "Products";
    Layout = "~/Views/Shared/_Layout.cshtml";
    string ip_address = "";
}

@Html.Partial("_ProductList");

<script type="text/javascript">
    $(function () {
        $.get("http://ipinfo.io", function (response) {
            $.post("/MyController/Action", response.ip, function (successObj) {
                 // In here is where I set what ever in the partial

                 // I'm guessing that in the partial it renders some product table to view the products?
                 $.each(successObj, function (product) {

                    $("productTable").append(/* some new row using the product variable */);
                 });
             });            
               console.log("ip+" + response.ip);
        }, "jsonp");
    });
</script>