Simple implementation of HTML Table blank cell complement _javascript skill

When I first taught myself Web development, there was no such thing as the div/css layout, the world of Table layout. Then there is a problem, how to fill all Sudoku blank cells? --This is the problem that I'm getting a headache for the company product page. Because I am not a program of origin, encounter this slightly with the algorithm problem, it is helpless, hehe. Incidentally, remember that pagination algorithm also toss me a bit.

The so-called Sudoku, that is, the table, 3 rows x 4 columns = 12 cells. If you have only 10 products, you can populate only 10 cells in the table, and the remainder is blank. Although blank, but also to render <td></td> elements, otherwise the table will look out of shape. Of course you can, but problem table is dynamically rendered by ASP. So how to calculate, how to show the blank TD is a problem. I thought a few ways, in retrospect, of course, is not reasonable, in short, are dead horse when the live horse medicine ... Can show on the line ... Oh.

Later in the Div/css era, Table was discarded. So the algorithm does not care. -Later in the project, I found that the table layout still works, so I figured out the little problem. The code with JS dynamic control is as follows:

/** * @class rendertable * Enter an array and the number of columns to generate a table of markup. * @param {Array} list * @param {number} cols * @param {function} getValue/define (function (Require, exports, module)
		{module.exports = function (list, cols, getValue) {this.list = list; This.cols = cols | |
		
		5; This.getvalue = GetValue | |
	This.getvalue;
			
			} Module.exports.prototype = (new function () {This.render = function (list) {list = list | | this.list;
			var len = list.length;
			var cols = this.cols;//digit var rows;
			var remainder = len% cols;
				var htmls = [];
				
			rows = Len/remainder; if (remainder = = 0) {//divisible List.foreach directly processing (addtr.bind) ({cols:cols, htmls:htmls, Getvalue:thi
			S.getvalue}));
				
				}else{//processing remainder part of var Remainnerarr = List.splice (List.length-remainder);
			
				List.foreach (Addtr.bind ({cols:cols, htmls:htmls, getValue:this.getValue})); Fill vacancy var Emptyarr = new Array (cols-remainnerarR.length);
				Emptyarr = Emptyarr.join (' empty ');
				Emptyarr = Emptyarr.split (' empty ');
				
				Remainder part + vacancy Remainnerarr = Remainnerarr.concat (Emptyarr); if (remainnerarr.length!= cols) {throw ' last line of length error!
				The length should be ' + cols;
			} Remainnerarr.foreach (Addtr.bind ({cols:cols, htmls:htmls, getValue:this.getValue}));
		Return addtable (Htmls.join (")); /** * Default to get the display value of the function.
		 This function is typically overwritten.
		* @param {Mixed} * @return {String} */this.getvalue = function (data) {return data; /** * Add a <td></td> for each value. Jorai one line plus a </tr></tr> * @param {Mixed} item * @param {number} I * @param {Array} arr/function ad
			
			DTr (item, I, arr) {var html = ' <td> ' + this.getvalue (item) + ' </td> ';
			if (i = = 0) {html = ' <tr> ' + html;
			}else if ((i + 1)% This.cols = = 0 && I!= 0) {html = ' </tr><tr> ';
	}else if (i = = arr.length) {html = ' </tr> ';		} this.htmls.push (HTML); }/** * * @param {String} HTML/function addtable (HTML) {return ' <table> ' + HTML + ' </table
	> ';
	var table = document.createelement (' table ');
	table.innerhtml = html;
	table.border= "1";
		Document.body.appendChild (table);
}
	});
 });

Big may think this is a flash and the problem of thinking. But I was in a career change. A little bit of "technical content" has become a stumbling block for me ...

The above is a small series for everyone to bring the HTML Table blank cells complement the simple realization of all the content, I hope that we support the cloud-Habitat Community ~