将值从 ViewModel 传递到 JavaScript

Question

我正在制作一个 MVC 5 Web 应用程序，我希望将一个值从我的 ViewModel 传递到我 JavaScript

中的一个函数

目的是在用户选择选项 "No" 时隐藏 Label/Div 并在用户将选项更改回 "Yes"

时使其重新出现

这是我目前的情况：

视图模型：

public enum BasicAnswer
        {
            [Display(Name= "Yes")]
            Yes,
            [Display(Name= "No")]
            No
        }
 public BasicAnswer userDiscomfortResponse { get; set; }

查看：

   <div id="UserDiscomfortAnswerLabel">
            <label id="somelabel">Did you have any discomfort with an exercise?</label>
            <div class="Answer1" onclick=feedback data-id='@Model.userDiscomfortResponse'>
                @Html.EnumDropDownListFor(m => m.userDiscomfortResponse, new { @class = "form-control" })
        </div>
    </div>

    <div class="Question2">
        <label id="UserDiscomfortExerciseLabel">What exercise was the issue?</label> 
        <div class="Answer2">
            @Html.DropDownListFor(m => m.discomfortExercise, Model.UsersSelectedExcerises, new { @class = "form-control" })
        </div>
    </div>

JavaScript:

function feedback() {
    var feedback = $(this).attr('data-id'); 
    if (feedback == "Yes") {
        document.getElementById("UserDiscomfortExerciseLabel").style.display = "block"
    }
    else {
        document.getElementById("UserDiscomfortExerciseLabel").style.display = "none"
    }
}

我遇到的问题是 var feedback = $(this).attr('data-id') 结果未定义，因此标签在点击时隐藏但再也不会显示。

我错过了什么吗？

提前致谢。

Answer 1

好的，尝试删除 div 上的 onclick 并添加：

$(document).ready(function()
{
    function feedback() {
        var feedback = $('#userDiscomfortResponse').val()
        if (feedback == "Yes") {
            document.getElementById("UserDiscomfortExerciseLabel").style.display = "block"
        }
       else {
           document.getElementById("UserDiscomfortExerciseLabel").style.display = "none"
       }
    }

    $("#userDiscomfortResponse").change(feedback);
    feedback();
}

将值从 ViewModel 传递到 JavaScript

Passing values from ViewModel to JavaScript

javascript

c#

model-view-controller

jquery