Jump to content

My Script Will Only Work In Firefox.


Recommended Posts

So I'm trying to write a simple javascript that takes input from a form and creates a table with it and displays the HTML for the table. For some reason it only works in Firefox and does not work in Internet Explorer or Google Chrome. What happens is after you push the submit button it displays the table and HTML but then for some reason the page resets. It doesnt do this in firefox, but it works correctly. I know the functions for creating the Table and HTML are fine because they work if I call them outside of the form. So Iam doing something wrong with the form but Im not sure what.Here is my java script:

	function checkForm(){		var numRows = document.forms["tableForm"].numRows.value;		var numCols = document.forms["tableForm"].numCols.value;		if(isNaN(numRows) || isNaN(numCols)){			alert("Enter numbers stupid.");			return false;		}		else if(numRows < 1 || numRows < 1){			alert("Table needs at least 1 row and 1 column.");			return false;		}		return true;	}		function createTable(numRows, numCols){		var table = document.createElement('table');		document.body.appendChild(table);		table.border=1;		for(var i = 0; i <= numRows; i++){			var currentRow = table.insertRow(i);			for(var j = 0; j <= numCols; j++){				var currentCell = currentRow.insertCell(j);				currentCell.appendChild(document.createTextNode('This is a cell.'));			}		}		}		function createTableHTML(numRows, numCols){		var pre = document.body.appendChild(document.createElement("pre"));		var tableHTML = "<table>\n";		for(var i = 0; i <= numRows; i++){			tableHTML += "\t<tr>\n\t\t";			for(var j = 0; j <=numCols; j++){				tableHTML += "<td> </td>";			}			tableHTML += "\n\t</tr>\n";		}		tableHTML += "</table>";		pre.appendChild(document.createTextNode(tableHTML))	}

Here is my Form

	<form id="tableForm" action="#" 	onsubmit = "createTable(document.forms['tableForm'].numRows.value, document.forms['tableForm'].numCols.value); 				createTableHTML(document.forms['tableForm'].numRows.value,document.forms['tableForm'].numCols.value);">		<table>			<tr>				<td>Number of Rows:</td>				<td><input id="numRows"type="text" size="2" maxlength="2"></td>			</tr>			<tr>				<td>Number of Cols:</td>				<td><input id="numCols"type="text" size="2" maxlength="2"></td>			</tr>			<tr>				<td>Table Header:</td>				<td><input type="checkbox"></td>			</tr>			<tr>				<td>Table Footer:</td>				<td><input type="checkbox"></td>			</tr>			<tr>				<td colspan="2"><input type="submit" onclick="return checkForm();" value="Create Table"></td>			</tr>		</table>	</form>

Here is the actual script if you want to test it:(It works in firefox)www.maxeddy.net/tablecreator.html

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...