DWZ Dynamic Table

<!--index.jsp>>>index>>> Fixed Asset Management -<%@ Page Language="Java"ContentType="text/html; Charset=utf-8"pageencoding="UTF-8"%><%@include File="/context/devuxtags.jsp"%><Divclass= "PageContent">    <Divclass= "Panelbar">        <ulclass= "ToolBar">            <Li><aclass= "Add"><span>Add to</span></a></Li>            <Li><aclass= "Delete"><span>Delete</span></a></Li>            <Li><aclass= "Edit"title= "Modify"><span>Modify</span></a></Li>                        <Liclass= "line">Line</Li>                    </ul>        <Selectclass= "Combox"ID= "Fixedassetstype">            <optionvalue= "Computer">Computer host</option>            <optionvalue= " the">Computer monitor</option>            <optionvalue= "+">Desk</option>            <optionvalue= "$">office chair</option>        </Select>    </Div>        <DivID= "jTableDynamic99999"></Div>

<script type= "Text/javascript" > (function ($) {$.fn.jtabledynamic = function (options) {options = $.extend (        True, {cols: [], URL: "", Pagging:false, numperpage:10}, Options);        var $table = $ (this); Loaddynamictabledata = function (Numperpage, pagenum) {$table. html (' <table class= "table" width= "100%" >&lt            ;thead></thead><tbody></tbody></table> '); if (options.pagging) {var pagination = ' <div class= ' panelbar ' > ' + ' <div class= ' pages ' ><span > per page display </span> ' + ' <select class= "Combox" name= "numperpage" ><option value= "ten" >10</option> <option value= ">20</option><option" value= ">50</option></select>" + "<span >, total <label id= "TotalCount" ></label> bar </span></div> ' + ' <div class= "pagination" Targettype= "" totalcount= "numperpage=" "pagenumshown=""currentpage=" 1 "></div></div>";            $table. Append (pagination);            } var cols = Options.cols;            var fixedassetshead = "<tr>";                for (var idx = 0; idx < cols.length; idx++) {var col = cols[idx]; Fixedassetshead + = ' <th width= ' + col.width + ' px ' > ' + ' <div class= "Gridcol" title= "' + Col.name + '" style= "Tex T-align:center; "            > ' + col.name + ' </div></th> ';            } Fixedassetshead + = ' </tr> ';            $table. Find (' thead '). HTML (fixedassetshead); $.ajax ({type: ' POST ', Url:options.url, data: {NUMPERPAG E:numperpage, Pagenum:pagenum}, DataType: ' JSON ', conte Nttype: "application/x-www-form-urlencoded;                Charset=utf-8 ", async:false,//handling page initialization after getting and setting the table content with Ajax, the table has no click events, cell misalignment, and so on. SUccess:function (Respmsg, Textstatus, JQXHR) {if (Respmsg.code = =) {var da                        Ta = respmsg.data;                        var rows = data.rows;                        var total = data.total;                            if (rows instanceof Array) {$table. Find (' #totalCount '). HTML (total);                            var content = "";                                    try {for (var idxd = 0; idxd < rows.length; idxd++) {                                    Content + = ' <tr target= "Sid_user" rel= "' + idxd + '" class= "" > ";                                        for (var idx = 0; idx < cols.length; idx++) {var col = cols[idx];                                    Content + = "<td>" + Rows[idxd][col.code] + "</td>";                                } content + = "</tr>";    }                            $table. Find ("Select[name= ' Numperpage ')"). Val (numperpage);                                $table. Find ('. Pagination '). attr ("TotalCount", total);                                $table. Find ('. Pagination '). attr ("CurrentPage", pagenum);                            $table. Find ('. Pagination '). attr ("Numperpage", numperpage);                                } catch (Exception) {content = ""; Alertmsg.error (' Tabular data format is incorrect!                            ‘);                        } $table. Find (' tbody '). HTML (content); } else {alertmsg.error (' The table data returned by the server is not formatted correctly!                        ‘); }} else {Alertmsg.error (' error occurred while querying tabular data!                    \ n ' + respmsg.msg); }}, Error:function (XMLHttpRequest, Textstatus, Errorthrown) {alertmsg. Error (' There was a mistake in requesting the tabular data!                ‘);     }       });        } loaddynamictabledata (10, 1);            Dwzpagebreak = function (options) {var numperpage = $table. Find ("Select[name= ' Numperpage ']"). Val ();            var pagenum = Options.data.pageNum;            Loaddynamictabledata (Numperpage, pagenum);        $ ($ (' Div.page.unitBox ') [1]). Initui (); $table. Find (' select[name= ' Numperpage "]). Live (" Change ", function () {Loaddynamictabledata ($ (this). Val (            ), 1);        $ ($ (' Div.page.unitBox ') [1]). Initui ();        });            $table. Selectedrow = function () {if (! $table. Find ("tr.selected"). length) return null;        else return $table. Find ("tr.selected");    } return $table; };})            (jQuery); $ (function () {var fixedassetsoptions = {computer: {URL: "Fixedassets/computerlist",                Options: [{code: "id", Name: "Device Number", width:100}, { CodE: "Brand", Name: "Branding", width:200}, {code: "CPU",                Name: "CPU", width:300}, {code: "Memory", Name: "Ram",            WIDTH:200}, {code: "Harddisk", Name: "Hard disk", width:300    }]}, monitor: {}};    var fixedassetstypeoptions = fixedassetsoptions[$ (' #fixedAssetsType '). Val ()].options;    var fixedassetstypeurl = fixedassetsoptions[$ (' #fixedAssetsType '). Val ()].url; var $table = $ (' #jTableDynamic99999 '). Jtabledynamic ({cols:fixedassetstypeoptions, pagging:true, ur    L: ' <%= basepath%> ' + Fixedassetstypeurl});        $ (". ToolBar"). Find (". Delete"). Live ("Click", Function () {var selectedrow = $table. Selectedrow (); if (Selectedrow) {alertmsg.confirm ("Are you sure you want to delete the selected data?! ", {okcall:function () {VAr rel = selectedrow.attr ("rel");        }            }); } else Alertmsg.error (' Row not selected!    ‘);    });        $ (". ToolBar"). Find (". Edit"). Live ("Click", Function () {var selectedrow = $table. Selectedrow ();            if (selectedrow) {var rel = selectedrow.attr ("rel");             var url = "<%= basepath%>fixedassets/computeredit?cid=" + rel;        $.pdialog.open (URL, "rel", "Modify Information", {mask:true}); } else Alertmsg.error (' Row not selected!    ‘); });}); </script>

　　

DWZ Dynamic Table