Presentación
https://drive.google.com/open?id=0B7Ct7K_LTJvSaWRoVjFES0xFZjQ
Ejercicio
http://www.w3schools.com/bootstrap/bootstrap_theme_company.aspReferencias
http://www.oneskyapp.com/es/docs/bootstrap/css
https://bootswatch.com/
http://www.w3schools.com/bootstrap/default.asp
http://www.tutorialspoint.com/bootstrap/bootstrap_grid_system.htm
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<!-- Librería jQuery
-->
<script src="Scripts/jquery-3.1.0.js"></script>
<!-- Librería de Bootstrap
-->
<script src="Scripts/bootstrap.js"></script>
<!-- Estilo de Bootstrap
-->
<link href="Content/bootstrap.css" rel="stylesheet" />
<script src="Scripts/ValidaProducto.js"></script>
</head>
<body>
<div class="container">
<div class="row"> <!-- Fila 1 -->
<div class="col-lg-8"> <!-- Columna 1 -->
<form id="frm" name="frm" class="form-inline"
method="get" action="Consulta.aspx"
onsubmit="return fValidaDatos();">
<fieldset>
<legend>Datos</legend>
<div id="divCod" name="divCod" class="form-group">
<label for="CodProd" class="control-label">
Código
Producto:
<input type="text" maxlength="5" class="form-control"
id="CodProd" name="CodProd" />
</label>
</div>
<div id="divProd" name="divProd" class="form-group">
<label for="NomProd" class="control-label">
Nombre
Producto:
<input type="text" maxlength="50" class="form-control"
id="NomProd" name="NomProd" />
</label>
</div>
<div class="form-group">
<input type="submit" id="Ingreso" name="Ingreso"
class="btn btn-primary" />
</div>
</fieldset>
</form>
</div>
<div class="col-lg-4"> <!-- Columna 2 -->
</div>
</div>
</div>
</body>
</html>
ValidaProducto.js
function fValidaDatos() {
var bRetorno = true;
var PatronNumero = "[0-9]";
var PatronLetras = "[a-zA-Z\\s]";
var Indice = 0;
try {
//Encontrar
elemento
var iCP = document.getElementById("CodProd").value;
//Validar el
Patrón de Número
Indice = String(iCP).search(PatronLetras);
if (Indice > -1) {
//El patrón
existe en la cadena de caracteres
$("#divCod").addClass("has-error");
bRetorno = false;
}
else {
$("#divCod").removeClass("has-error");
Indice = String($("#NomProd").val()).search(PatronNumero);
if (Indice > -1) {
$("#divProd").addClass("has-error");
bRetorno
= false;
}
}
}
catch (e) {
console.log(e);
}
return bRetorno;
}
No hay comentarios.:
Publicar un comentario