【问题标题】:How to update / refresh div tag in ajax in MVC 3如何在 MVC 3 的 ajax 中更新/刷新 div 标签
【发布时间】:2014-05-21 15:04:12
【问题描述】:

我在一个循环中有复选框(最初没有选中),并希望在复选框旁边显示附加图标,但仅在选中复选框时显示。我已经包含了“if”语句,但是当用户选择一个复选框时,图标不会出现。我该怎么做呢

<div id="divItems">
<table> <thead></thead><tbody>
@foreach (Employee item in Model)
{
   <tr>
        <td> <label class="checkbox">
             <input type="checkbox" name="@(item.Name)" id="@(item.Name)"              class="clink" value="(item.FullName)" /> @item.Name  </label>
        </td>
        <td>
             <a href="#MModal" class="open-Modal" data-id="(item.MapSPNames)" 
                  data-toggle="modal">  
               <i class="icon-edit" title="Filter"></i>  
             </a>
         </td>  

   </tr>
}
</tbody></table>
</div>

【问题讨论】:

  • 为什么要在复选框更改时调用 .ajax?
  • Naveen 我正在从更新页面其他部分的控制器获取其他数据 - 我想当它进行 ajax 调用时我可以同​​时更新我的​​ div 标签
  • 假设clink 在代码中拼写正确。应该是click
  • 那么.ajax结果不会影响
    ?这意味着您只想在选中的复选框之后显示 。对吗?
  • 使用开发者工具确定图标编辑是否被写入 HTML。如果不是,我会在if 语句中添加一个alert(Request[item.Name]) 以验证该值是否正确。

标签: javascript jquery ajax asp.net-mvc-3 razor


【解决方案1】:

编辑

创建一个函数并在任何你想要的地方调用它:

  function showChecked() {
     $(".open-Modal").each(function () {
         $(this).hide();
     });
  $(".clink").each(function () {
    if ($(this).is(":checked"))
       $(this).parent().next().find(".open-Modal").show();
   else
      $(this).parent().next().find(".open-Modal").hide();
  });
  }

现在根据您的需要调用函数 showChecked()。就像更改复选框一样:

$(".clink").on("change", function () {
  showChecked();
});

也可以在 $(document).ready 或您正在加载 div id="divItems" 的 html 的地方调用此函数

【讨论】:

  • Naveen 谢谢,但我想将 html 保留在 jquery 之外 - 我们可以在 jquery 中显示/隐藏它吗?
  • 我已经更新了代码。如果您有任何疑问,请提出任何问题。
  • Naveen 我尝试了您的上述解决方案,但它不起作用。我已经更新了上面的代码以显示我的确切代码 c# razor - 请看看我是否做错了什么。谢谢
  • Naveen 它仍然无法正常工作 - 它肯定正在执行每个函数并正在检查是否已检查但行 "$(this).parent().next().find(".icon-编辑").show();"没有做任何事情。如您所述,我正在 .clink.on 更改函数中运行 showChecked()。
  • 你的图标被 显示?
猜你喜欢
相关资源
最近更新 更多
热门标签