Grid表格的js触发事件

没怎么接触过Grid插件；

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

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

 function flowGrid() {

         var clients = [

             {"流程节点": "立项", "项目数量(单位)": 25, "金额(单位)": 1, "加权平均IRR": "231"},

             {"流程节点": "审批", "项目数量(单位)": 45, "金额(单位)": 2, "加权平均IRR": "1234"},

             {"流程节点": "待放款情况", "项目数量(单位)": 29, "金额(单位)": 3, "加权平均IRR": "124"}

         ];

         $("#flow_grid").jsGrid({

             width: "100%",

             height: "200px",

             data: clients,

             fields: [

                 {name: "流程节点", type: "text", width: 100, css: "js_font_color", headercss: "js_header_color"},

                 {name: "项目数量(单位)", type: "text", width: 140},

                 {name: "金额(单位)", type: "text", width: 100},

                 {name: "加权平均IRR", type: "text", width: 100}

             ]

         });

     }

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

 $(document).on("click", ".js_font_color", function () {

         $(".js_font_color").attr("data-toggle", "modal");

         $(".js_font_color").attr("data-target", "#myModal");

         console.log($("#flow_name"));

         console.log($(this).html());

         document.getElementById("flow_name").innerHTML = $(this).html();

         $(this).unbind();

 });

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

巴特西

Grid表格的js触发事件

最新文章

热门文章