zoukankan      html  css  js  c++  java
  • Grid表格的js触发事件

    没怎么接触过Grid插件;

    解决的问题是:点击Grid表行里的内容触发js方法弹出模态框,用以显示选中内容的详细信息。

    思路:给准备要触发的列加上一个css属性,通过这个css属性来获取元素并触发js方法。

     1 function flowGrid() {
     2         var clients = [
     3             {"流程节点": "立项", "项目数量(单位)": 25, "金额(单位)": 1, "加权平均IRR": "231"},
     4             {"流程节点": "审批", "项目数量(单位)": 45, "金额(单位)": 2, "加权平均IRR": "1234"},
     5             {"流程节点": "待放款情况", "项目数量(单位)": 29, "金额(单位)": 3, "加权平均IRR": "124"}
     6         ];
     7         $("#flow_grid").jsGrid({
     8              "100%",
     9             height: "200px",
    10             data: clients,
    11             fields: [
    12                 {name: "流程节点", type: "text",  100, css: "js_font_color", headercss: "js_header_color"},
    13                 {name: "项目数量(单位)", type: "text",  140},
    14                 {name: "金额(单位)", type: "text",  100},
    15                 {name: "加权平均IRR", type: "text",  100}
    16             ]
    17         });
    18     }

    以上是实例化Grid表格的代码,在将要触发js方法的列(流程节点)加了一个css属性。

    1 $(document).on("click", ".js_font_color", function () {
    2         $(".js_font_color").attr("data-toggle", "modal");
    3         $(".js_font_color").attr("data-target", "#myModal");
    4         console.log($("#flow_name"));
    5         console.log($(this).html());
    6         document.getElementById("flow_name").innerHTML = $(this).html();
    7 
    8         $(this).unbind();
    9 });

    这样就实现了这个功能,希望大佬能给我说说更简单更好的办法。

  • 相关阅读:
    Linq用法笔记
    关于Json的总结
    关于Json的总结
    Managing uniquely tagged items using the internet
    关于Json的总结
    Net中Session的用法
    Net中Session的用法
    Net中Session的用法
    【基础】Asp.Net操作Cookie总结
    Asp.Net操作Cookie总结
  • 原文地址:https://www.cnblogs.com/Yinjiawei/p/9555460.html
Copyright © 2011-2022 走看看