ReferenceError:未定义'x'-asp.net mvc部分视图和jQuery / JavaScript-将整个模型传递给操作方法

问题描述

在局部视图中,我尝试将ENTIRE模型传递给控制器​​的action方法的发布,但遇到错误。 (但是,我可以很好地传递模型的单个属性-参见底部):

$.post("/BlogPublished/SetModelSessionVar",@Model);     

我得到一个错误

 GnbgWebClient is not defined ReferenceError: GnbgWebClient is not defined

在控制台中看到。

我有一个断点。我可以在控制器的操作方法文章中看到模型和值。

enter image description here


注意:如果我在@Model周围加上单引号,例如:

    $.post("/BlogPublished/SetModelSessionVar",'@Model');

已发布,但收到的模型不包含任何值。它已初始化。

enter image description here


注意:我尝试使用参数名称而不使用单引号:

  $.post("/BlogPublished/SetModelSessionVar",{ likeOrdislikeVM: @Model } );

但出现相同的错误-未定义GnbgWebClient ReferenceError:未定义GnbgWebClient

相同条件,不同版本的帖子,但结果相同:

        $.ajax({
        type: 'POST',url: '@Url.Action("SetModelSessionVar","BlogPublished")',data: { likeOrdislikeVM: @Model},success: function (response) {

        },error: function (xhr,ajaxOptions,thrownError) {
            alert("Critical Error: something is wrong in the call to SetModelSessionVar! Status: " + xhr.status + ". Error: " + thrownError.toString() + ". Response Text: " + xhr.responseText);
        }
    })

注意:我尝试使用参数名称和单引号:

  $.post("/BlogPublished/SetModelSessionVar",{ likeOrdislikeVM: '@Model' } );

发布了帖子,但是模型只有NULL。不是我要传递的值。

enter image description here

相同条件,不同版本的帖子,但结果相同:

        $.ajax({
        type: 'POST',data: { likeOrdislikeVM: '@Model'},thrownError) {
            alert("Critical Error: something is wrong in the call to SetModelSessionVar! Status: " + xhr.status + ". Error: " + thrownError.toString() + ". Response Text: " + xhr.responseText);
        }
    })

现在,我从输入模型和结构中创建一个与输入模型相同的JavaScript变量。

我收到类似的参考错误

 holdLikeOrdislikeVM is not defined ReferenceError: holdLikeOrdislikeVM is not defined

在控制台中看到。

enter image description here

我有一个断点。我可以在控制器的action方法文章中看到JavaScript变量及其值。

enter image description here


现在只需使用参数名称和不带单引号的方式传递模型的SINGLE属性

  $.post("/BlogPublished/SetCountSessionVar",{ value: @Model.LikeCount});

它到达控制器并显示正确的值。

enter image description here

在这里,我只是使用参数名称和单引号传递了Model的单个属性

  $.post("/BlogPublished/SetCountSessionVar",{ value: '@Model.LikeCount'});

它到达控制器并显示正确的值。

enter image description here


部分查看代码

@model GbngWebClient.Models.LikeOrdislikeVM

<style>
.fa {
    cursor: pointer;
    user-select: none;
}

    .fa:hover {
        color: blue;
    }

/* I added. */
.my-size {
    font-size: 20px;
}
</style>

<div class="row">
<p><span class="blogLike my-size fa fa-thumbs-up"></span><span class="my-size"> : @Model.LikeCount</span> <span class="my-size"> | </span><span class="blogdisLike my-size fa fa-thumbs-down"></span><span class="my-size"> : @Model.disLikeCount</span></p>
</div>

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Styles.Render("~/Content/css")

<script type="text/javascript">
$(document).ready(function () {
    console.log('here at ready');

    const False = false,True = true;

    // Set the disabled attributes.
    SetLike(@Model.Likedisabled);
    SetdisLike(@Model.disLikedisabled);

    $.post("/BlogPublished/SetModelSessionVar",@Model);

    function SetLike(disabledSwitch) {
        console.log('here at SetLike');
        $(".blogLike").attr('disabled',disabledSwitch);

        if (disabledSwitch == true )
        {
            $(".blogLike").css('color','green');
        }
    }

    function SetdisLike(disabledSwitch) {
        console.log('here at SetdisLike');
        $(".blogdisLike").attr('disabled',disabledSwitch);

        if (disabledSwitch == true)
        {
            $(".blogdisLike").css('color','green');
        }
    }
});
</script> 

控制器动作方法

    public void SetModelSessionVar(LikeOrdislikeVM likeOrdislikeVM)
    {
        // Sets a model session variable according to the argument passed in.

        Session["likeOrdislikeVM"] = likeOrdislikeVM;
    }

解决方法

您需要序列化模型。如果您查看源代码,则可以在页面上看到正在创建的乱码。您会看到正在使用c#类型名称。

@Html.Raw(Json.Encode(Model));
,

您不应直接传递@Model。您应该用单引号将其括起来。

几个可行的步骤:

  1. 尝试将HttpPost添加到操作中。
  2. 始终最简单,最灵活的将数据发布到控制器的方法是使用AJAX,因为它在发布时提供了多种选择。