根据JSON数据,自动生成Table

来源:互联网 发布:暖气片 知乎 编辑:程序博客网 时间:2024/04/30 02:59

jquery扩展
根据JSON数据,自动生成简单的Html Table.

 

因为项目要求,所以写了这个示例.顺便放到博客上来!

复制代码
jQuery.fn.MakeTable = function (objColumn, objData, objClassName, RowClick) {            //样式            $(this).attr("class", objClassName);            var sHtml = "";            sHtml += "<thead>";            var sTrHtml = "<tr>";            $.each(objColumn, function (i) {                sTrHtml += "<th ";                sTrHtml += "style=\"width:" + objColumn[i].Width.toString() + "px\"";                sTrHtml += ">";                sTrHtml += objColumn[i].ColumnName;                sTrHtml += "</th>";            });            sTrHtml += "</tr>";            sHtml += sTrHtml + "</thead>";            sHtml += "<tbody>";            $.each(objData, function (i) {                sTrHtml = "<tr";                if (RowClick != null && RowClick != undefined) {                    //alert(RowClick);                    sTrHtml += " onclick=\"CheckRow(this," + RowClick + ")\"";                }                sTrHtml += ">";                var objTr = objData[i];                for (x in objTr) {                    sTrHtml += "<td style=\"";                    var objLinqData = jLinq.from(objColumn).equals("DataId", x).take()[0];                    sTrHtml += "text-align:" + objLinqData.DataAlign + ";";                    sTrHtml += "\" ";                    if (objLinqData.OnClick != null) {                        sTrHtml += " onclick=\"" + objLinqData.OnClick + "\"";                    }                    sTrHtml += ">";                    if (objLinqData.Format != null) {                        sTrHtml += objLinqData.Format(objTr[x]);                    }                    else {                        sTrHtml += objTr[x];                    }                    sTrHtml += "</td>";                    //alert(x);                }                // sTrHtml += objData[i].                sTrHtml += "</tr>";                sHtml += sTrHtml;            });            sHtml += "</tbody>";            //alert(sHtml);            // $("#" + sId + " > tbody:last").append(sTrHtml);            var sId = this[0].id;            $("#" + sId).append(sHtml);        };
复制代码


下载

0 0