Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/08/2012, 16:28
DarkSadahrot
 
Fecha de Ingreso: agosto-2012
Ubicación: Bogota
Mensajes: 5
Antigüedad: 12 años, 4 meses
Puntos: 0
Exclamación Matrices en tablas dinamicas html con javascript

Hola como van, estoy empezando con html y javascript asi que mi codigo puede parecer algo redundante y se que tambien se puede optimizar bastante.

Bueno mi problema.... es un ejercicio en el cual debo solicitar al usuario el tamaño de dos matrices bidimencionales y multiplicarlas, el objetivo es que al obtener esos datos debo presentar en el formulario la captura visual de las matrices, es decir si el usuario quiere una matriz de 2 filas y 3 columnas debe mostrarse los input necesarios para realizar el carge de la matriz.

he creado el formulario para obtener los tamaños y generar las matrices por medio de tablas, pero al momento en que se generan las tablas con los input text el formulario se reinicia y necesito que las tablas se creen justo debajo en el formulario activo.

ademas si me pueden colaborar sobre el como logro obtener los datos digitados y hacer la multiplicacion se loa agradeceria mucho

aqui el codigo (si existe una mejor forma de crear las tablas tambien lo agradeceria, he visto muchos ejemplos pero hasta ahora solo he podido con este XD)

Código:
<html>
	<head>
		<meta name="author" content="Vargas Sarmiento Yimi"/>
		<meta name="description" content="Guia 1 HTML/JavaScript - ADSI 259128"/>
		<style>
			body {
				background-color: #DCDCDC;
			}
			#plano {
				font-family: Tahoma, Verdana, Arial;
				font-size: 12px;
				color: #000000;
				background-color: transparent;
				border-width: 0;
			}
		</style>
		<script>
			function OkSize(colA, filB) {
				if (colA == filB) {
					return true;
				} else {
					return false;
				}
			}

			function genMatrices(filA, colA, filB, colB) {

				document.write('<table name"tblMatrices" id="tblMatrices" border=1>')
				document.write('<tr>')

				document.write('<td align="center" valing="middle">')
				document.write('<table name="tblMtzA">')
				for ( i = 0; i < filA; i++) {
					document.write('<tr>')
					for ( j = 0; j < colA; j++) {
						document.write('<td><input type="text" size="1" maxlength="2"/></td>')
					}
					document.write('</tr>')
				}
				document.write('</table>')
				document.write('</td>')

				document.write('<td align="center" valign="middle">')
				document.write('<table name="tblMtzB">')
				for ( i = 0; i < filB; i++) {
					document.write('<tr>')
					for ( j = 0; j < colB; j++) {
						document.write('<td><input type="text" size="1" maxlength="2"/></td>')
					}
					document.write('</tr>')
				}
				document.write('</table>')
				document.write('</td>')

				document.write('<td align="center" valign="middle">');
				document.write('<table name="tblMtzR">')
				for ( i = 0; i < filA; i++) {
					document.write('<tr>')
					for ( j = 0; j < colB; j++) {
						document.write('<td><input type="text" size="1" maxlength="2"/></td>')
					}
					document.write('</tr>')
				}
				document.write('</table>')
				document.write('</td>')

				document.write('</tr>')
				document.write('</table>');
				
				var matrices = document.getElementById('tblMatrices');
				document.getElementById('divMatrices').innerHTML = matrices;

			}

			function OpeMultp(filA, colA, filB, colB) {
				if (OkSize(colA, filB) == false) {
					alert('No se puede multiplicar')
					document.frmArreglo4.txtMtzAfil.focus
				} else {
					genMatrices(filA, colA, filB, colB)
				}
			}

		</script>
	</head>
	<body>
		<form name="frmArreglo4" id="frmArreglo4">
			<h3 align="center">Arreglos 4</h3>
			<p align="center">
				Escriba el c&oacute;digo necesario para multiplicar dos matrices y generar el resultado.
				<br/>
				Tenga encuenta los criterios de validaci&oacute;n para multiplicar dos matrices.
			</p>
			<hr/>
			<h2 align="center">MULTIPLICACION DE MATRICES</h2>
			<table align="center" border="1">
				<tr>
					<td>
					<table>
						<tr>
							<td align="center" colspan="4"><b>Matriz A</b></td>
						</tr>
						<tr>
							<td>Filas:</td><td>
							<input name="txtMtzAfil" type="text" size="1" maxlength="2" value="2"/>
							</td><td>Columnas:</td><td>
							<input name="txtMtzAcol" type="text" size="1" maxlength="2" value="4"/>
						</tr>
					</table></td>
					<td>
					<table>
						<tr>
							<td align="center" colspan="4"><b>Matriz B</b></td>
						</tr>
						<tr>
							<td>Filas:</td><td>
							<input name="txtMtzBfil" type="text" size="1" maxlength="2" value="4"/>
							</td><td>Columnas:</td><td>
							<input name="txtMtzBcol" type="text" size="1" maxlength="2" value="3"/>
							</td>
						</tr>
					</table></td>
				</tr>
			</table>
			<br />
			<div align="center">
				<input name="btnMultiplicar" type="button" value="Generar Matrices" onclick="OpeMultp(txtMtzAfil.value, txtMtzAcol.value, txtMtzBfil.value, txtMtzBcol.value)"/>
			</div>
			<br/>
			<div id="divMatrices"> </div>
		</form>
	</body>
</html>

Muchas gracias!!!!!