MVC @foreach 和 JavaScript 混淆答案

【问题标题】：MVC @foreach and JavaScript ConfusionMVC @foreach 和 JavaScript 混淆
【发布时间】：2016-08-04 13:28:05
【问题描述】：

我正在尝试在 Bootstrap 弹出窗口中创建一个按钮，该按钮在通过 Razor foreach 运行时将 Razor 值传递给另一个名为 killDatabase 的 JavaScript 函数。该代码会生成一个您可以选择的按钮列表，但我也希望能够点击一个按钮并删除其中一个选项。该代码不会引发任何错误，并且一切正常，除了任何删除按钮将始终删除最后一个元素，而不是应该与之关联的元素。我假设这是因为该函数在 onclick 上被调用，所以此时 @str 只是最后一个元素的名称，但我想知道是否有任何方法可以将该值存储为每个元素的唯一值?我尝试在 foreach 中添加一个 JavaScript 变量，但仍然遇到了同样的问题。

<div class="btn-group-vertical btn-block" data-toggle="buttons" id="btns">
    @foreach (var str in Model)
    {

    <div id="popover-content" hidden>
        Are you sure you would like to permanently delete this query from the database?<br />
        <button onclick="killDatabase('@str')" class="btn btn-primary btn-sm" style="float:left; margin-bottom: 10px;">Yes</button>
        <button class="btn btn-sm btn-primary" style="float:left;">No</button>
    </div>
        <label class="btn btn-default" style="height:auto">
            <div class="form-group" style="height:auto; padding-bottom: 10px;">
                <input type="radio" name="query" value="@str" /> 
                <span class="pull-left">@str</span>
                <span class="pull-right"> 
                <button class="btn btn-sm btn-danger" style="margin-top:-2px;" data-toggle="popover" title="Confirm Deletion" data-placement="bottom">
                <span class="glyphicon glyphicon-trash"></span></button></span>
            </div>
        </label>

    }
</div>

【问题讨论】：

这段代码是否在外部 Javascript 文件中？如果是这样，您将无法使用任何 razor 语法（例如 @str）来引用您的服务器端变量。
使用您显示的代码，它将 str 变量（循环中的迭代器）传递给您的 killDatabase 方法。该方法有什么作用？当您查看页面的源代码时，您是否看到呈现独特的 str 变量？
@RionWilliams 抱歉，应该提到这是在视图中，而不是外部 JavaScript。就像我说的，其他一切都很好，包括对@str 的其他引用，除非我将它传递给killDatabase
你的killDatabase 函数是什么样的？您应该能够轻松查看源代码，以确保您的 @str 值被正确传递。尝试调用该函数时，开发者工具 (F12) 中是否存在任何错误？
@Shyju 以@str 为值的<input> 显示唯一值，如果我在每个开头执行console.log，我也会看到唯一值只有当我通过时用onclick 发送给killDatabase

标签： javascript asp.net-mvc twitter-bootstrap razor

【解决方案1】：

所以我要结束这个问题，因为我真的对 AJAX 感到困惑。这就是它归结为：我有一个糟糕的 AJAX 调用，我试图在页面加载后初始化的弹出窗口上做一些事情，所以任何时候我都会尝试在该弹出窗口中使用 @str 值，它会只取最近的值。我已经将代码重新设计为更精简、错误更少的设计，并且现在可以正常工作。感谢所有试图提供帮助的人

【讨论】：