Welcome to HBH! If you have tried to register and didn't get a verification email, please using the following link to resend the verification email.

A table maker in JavaScript. - Javascript Code Bank


A table maker in JavaScript.
A table maker in JavaScript.
                <!-- Made by TheMasterSinner -->

<html>
	<head>
		<title>Table Maker</title>
		<script>
			var rows = 2;
			var cols = 3;
			var r, c;

			function updatecount()
			{
				if (rows < 1) {
					rows = 1;
				}
				
				if (cols < 1) {
					cols = 1;
				}
				
				document.getElementById('rows').innerHTML = rows;
				document.getElementById('cols').innerHTML = cols;
			}

			function updatedata()
			{
				document.getElementById('text').value = returntable();
				document.getElementById('example').innerHTML = returntable();
			}

			function returntable()
			{
				var tabletext = '';
					tabletext += '<table border="1">\n';
						for (r=1; r<=rows; r++)
						{
							tabletext += '\t<tr>\n';
								for (c=1; c<=cols; c++)
								{
									tabletext += '\t\t<td>'+r+' - '+c+'</td>\n';
								}
							tabletext += '\t</tr>\n';
						}
					tabletext += '</table>';
				return tabletext;
			}
		</script>
		<style>
			.button { width: 25px; height:25px; }
		</style>
	</head>
	<body onload="updatecount();">
		<table border="0">
			<tr>
				<td><input type="submit" value="+" class="button" onclick="rows++; updatecount();" /></td>
				<td><input type="submit" value="-" class="button" onclick="rows--; updatecount();" /></td>
				<td>Rows: <span id="rows"></span></td>
			</tr>
			<tr>
				<td><input type="submit" value="+" class="button" onclick="cols++; updatecount();" /></td>
				<td><input type="submit" value="-" class="button" onclick="cols--; updatecount();" /></td>
				<td>Cols: <span id="cols"></span></td>
			</tr>
		</table>
		<table border="0" style="margin-top: 20px;">
			<tr>
				<td><input type="submit" value="Update Code and Show Example" onclick="updatedata();" /></td>
				<td>&nbsp;</td>
			</tr>
			<tr valign="top">
				<td><textarea id="text" cols="50" rows="20"></textarea></td>
				<td><span id="example"></span></td>
			</tr>
		</table>
	</body>
</html>
            
Comments
ghost's avatar
ghost 15 years ago

Quaint. Good job.

chandaMark's avatar
chandaMark 3 years ago