Curso de web master 11/08/12

Modulo ASP (no es un lenguaje tiene elementos para conectarse) Jquery------buscar Dreamweaver----las paginas dinamicas necesitan un servidor web------cual lenguaje va utilizar Asp----necesito: iis(internet informacion server) Php--- necesito: apache Se necesita una carpeta instalada en c: Inetpub---iis Wamp--- apache

En dw pongo el nombre del proyecto----- siguiente-----pongo el servidor------aspVbscrip---siguiente-----como desea trabajar----editar y comprobar localmente---siguiente---localhost con la carpeta creada----siguiente----si deseamos un servidor remoto para decirle a dw que lo suba del cliente al servidor----siguienteno porque aun no tenemos el servidor----siguiente--completado.

Para el proyecto necesito: -Indexinicia el proyecto Index.html Index.asp Index.php -musuarios.asp -Validar.asp -mproducto.asp(mantenerlo al dia) -mcategorias.asp -cerrar.asp

Para crear el index: Archivo -----nuevo-----paginadinamica----aspVBScript

Una vez creada la pagina le doy f12---si no se ve la pagina es porque no esta definido el servidor ------- si no se ve me voy a inicio---panel de control----herramienta administrativa---servicio de internet---- +--- sitioweb---+--- sitio web predeterminado---clic derecho--propiedades---- puerto tcp--- lo pongo en 80. Para la primera tabla debe tener un ancho de 960 pixel, las tablas que van dentro deben ir con porcentajes Los top y los bottom se hacen con imagenmarcador de posiciones En el formulario introduzco una tabla y combino celdas Para el boton registrarse----- envio lo que le pongo a la pagina musuarioventana comportamientoir a url Para crear musuario.asp: Para crear mproducto.asp Mcategoria.asp Validar.asp : usa puro cdigo asp, borro todo y coloco asp Cerrar.asp

Segunda clase

Trabajar con una base de datos usando asp con acces----solo cambia las instrucciones. 3 tablas: categorias Usuarios Productos Esta base de datos debe ser copiado en la carpeta en c: inetpub Cerramos .. luego . Las tablas las creamos en la ficha creardiseo de tablas

Le doy los camposluego cierro y le doy el nombre a la tabla En la tabla usuarios Tipo: S: superusuario a: administrador u: usuarios tabla producto coloco un campo principal y dos foraneas que me relaciona producto con las tablas categorias e usuario luego coloco los campos que me describe la tabla producto estatus: a: activo i: inactivo para relacionar las tablas: herramienta de base de datos.relaciones.escojo todas de idcategorias arrastro hasta idcategoria de productos.exigir integridad referencialaceptar cuando cerramos la relaciones estas se copian en el mismo documentos como accces datoslas copio y la pego en inetpub..en el sitio creado yuliezerprimeraclase debemos crear una pagina que nos conecte la base de datosconexborramos todo el codigo que aparece.. nos vamos a asp y colocamos las etiquetas<%%> guardamos como conex.asp la base de datos debe estar guardada en una carpeta creada llamada datos.. datos/datos.accdben dw en dw en la pagina validar creamos una rutina: nos traemos la pagina conex. <!--#include virtual=""-->borramos virtual y colocamos <!--#include file="conex.asp"-->

Para poder hablar con la base de datos necesito: necesito saber sql (mediante select) Para hacerlo en asp creamos una variable wsql: trabajando con sql(en la pagina validar) wsql="select * from usuarios where usuario='" &usuario& "' and clave='"&clave & "'" wsql="select * from usuarioswherelogin='" &usuario& "' and clave='"&clave & "'"

'response.Write(wsql) esta instruccion la pongo si quiero ver que se esta construyendo , set crea variables especiales .....rs crea un arreglo tiene todos los campos pedidos.se consideran objetos ........ la variable session es una variable especial

Set rs=con.execute(wsql) If rs.eof= false then session("mensaje")=("Bienvenido: " &rs("nombre")) else session("mensaje")=("usuario no existe") endif

'para que me regrese al index debo hacer lo siguiente response.Redirect("index.asp")

me voy al indexbusco diseome ubico centrado despues de los botones y muestro el mensaje bienvenido o no existe..coloco esto <%response.write( session("mensaje"))%>

para crear la pagina cerrar abro la pagina cerrar ya creada en la primera claseborramos todo y le colocamos asp<%%> <% session.Abandon() response.Redirect("index.asp") %> Luego voy a index y borro la palabra cerrar y coloco un boton cerrar.para que sea un vinculo.selecciono boton y abro en ventanacomportamientosigno +.ira urlexaminarselecciono la pagina cerraraceptar aceptar

Tercera clase 25/08/2012 Sql.insert Insert into usuarios(nombre de los campos)values()

Insert into usuarios(login,clave,nombre,correo,telefono,direccion)values(login,clave,nombre) Me voy a al index reviso que registro me redirija a musuariome voy a musuario Debe mostrar un formulario con los datos login, clave, nombre, correo, telefo y direccion. Para mayor orden colocamos una tabla principal. Una fila, una columna,400 pixel, borde cero,centradodentro de la tabla inserto un formulario. dentro del formulario inserto una nueva tablaf8,c2,100%,b1. Luego voy a la fase de configuracionme paro en el campo de texto de login y le cambio el nombre a login en vez de text file.. se le define la cantidad de caracteres dependiendo de el tamao de la tabla. Para clave se llamara clave, maximo 6 tipo contrasea.debo definir a donde va esos dos botones Registrar enviar formulariome ubico en alguna parte del formulario..le doy abajo en<form#form1>se sombrea todo el formulario. Defino todo(metodo post) Acccion: gusuario.. me posesiono en el form..actualizo y grabo Borrar..se borra solo Regresarninguno y se le pone un comportamiento ,,,irurl.. index Creamos una pagina gusuario para guardar En musuario Fase de validacion..debemos decirle a dw que valideseleccciono el formularioventana comportamiento.validar formulario..selecciono todos, menos direccion y telefono y les digo que es obligatorio, en correo le pongo adems direccion de correo electronico. Nos vamos a gusuario Verificamos en el servidor que el usuario ya no esteborramos todo el codigo de gusuario..incluimos <!--#include file="conex.asp"-->

Debo darle permiso de escritura a la carpeta en c: la operacin debe ser una consulta actualizada.a la carpeta le doy clic derechopropiedadesuso compartido de la webcompartir esta carpetaescritura

En el index en las filas que me quedan En la 1ra fila colocamos : formulariouna tabla..la tabla debe ser f2,c1,100%,b1 EN LA SEGUNDA LINEA UN MENU.. este men tendra 3 opciones: producto, categorias, usuario. Metemos una tabla con f2,c1,100%,bo. En la tercera fila colocamos una tabla f3.b0

Luego hacemos los vinculos para producto con mproducto, categoria con mcategoria, usuario con musuario Para los top uso firework para los fondos Para todos los formularios le coloco stile=margin:o

Cuarta clase Debo conectar index con la base de datos,,,,,, debemos incluir el include en indexmetemos ,,, <!--#include file="conex.asp"--> en la segunda linea de index para conextar con la base de datos Nos vamos a index en aqu lo sombreo y me voy al codigo para programarlodespejamos el aqu con <% %> Aqui <% %> Vamos a crear un ciclo en los asp <% 'leeer la tabla categoria wsql="select * from categorias order by nombre" 'debo crear un rs para para crear un arreglo asociativo de la tabla y lo relaciono con el nombre de latabla rscat set rscat=con.execute(wsql) 'probamos el codigo y seguimos con un ciclo while rscat.eof=false 'Aqui sustituyo la palabra aqui por el valor del arreglo asociativo <% response.Write(rscat("nombre%> <% response.Write(rscat("nombre"))%><br> <% rscat.movenext 'un avance wend %> Para los estilos en el head de index.asp Nos vamos a la pagina arsistema webmaster y descomprimo menu vertical index.html en la pagina de inetput .esa pagina men vertical la abrimos con dw y vemos el men lo copiamos

en index vuelvo al index del html abierto en dw y copio cualquier men y luego lo pego en index asp Copio la imagen en una nueva carpeta img y la guardo en mi sitio en index.asp busco los menus copiado y coloco en index.asp /*- Menu 1--------------------------- */

#menu1 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #3D261D; border-size: 1px; border-width: 1px; }

#menu1 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; }

#menu1 li a:link, #menu1 li a:visited { color: #E4D6CD; display: block; background: url(menu1.gif); padding: 8px 0 0 10px;

#menu1 li a:hover { color: #FFF; background: url(menu1.gif) 0 -32px; padding: 8px 0 0 10px; }

Para crear una lista no ordenada en el index <div id="menu1"><!--inicio un div------------- clase cuatro --> <ul><!--inicio un ul para crear una lista no ordenada--> <% 'leeer la tabla categoria wsql="select * from categorias order by nombre" 'debo crear un rs para para crear un arreglo asociativo de la tabla y lo relaciono con el nombre de la tabla rscat set rscat=con.execute(wsql) 'probamos el codigo y seguimos con un ciclo while rscat.eof=false 'Aqui sustituyo la palabra aqui por el valor del arreglo asociativo <% response.Write(rscat("nombre %> <% response.Write(rscat("nombre"))%><br> <% rscat.movenext 'un avance wend %>

</ul><!--fin ul para crear una lista no ordenada --> </div><!--fin div -->

luego hago los llamado como estan mas abajo en html de la siguente forma en index.asp= <% response.Write("<li><a href='#'> "&rscat("nombre") & "</a></li>")%> todo es para llamar el estilo de men 1

en productos -categoras - usuarios del diseo index asp <div align="center"> <a href="mproductos.asp">Productos</a> <a href="mcategorias.asp">Categorias</a> <a href="musuario.asp">Usuarios</a> </div> Lo cambio por esto para aplicarle el estilo <div id="menu1"> <ul> <li><a href="mproductos.asp">Productos</a></li> <li><a href="mcategorias.asp">Categorias</a></li> <li><a href="musuario.asp">Usuarios</a></li> </ul> </div> Para colocar estilo a la palabra todas <div id="menu1"> <ul> <li> <a href="#"> Todas </a> </li>

</ul> </div>

En la parte vacia de index meto una tabla principal de 1*1 anc 100% vertical -superior Abajo una tabla de 1*1 100% dentro de esta meto una tabla de f3 c1 180pxi Seleccionamos un lugar de la tabla de 3 filas.. me ubico arriba del td donde comienza esa tabla y despejo esa area y coloco <%%> arriba y debajo de esa tabla

5ta clase Mantenimiento de productos (mproductos) La parte que dice men debe verse solo cuendo entre un usuario. Nos vamos a validar. Debemos usar variables de sesin Nos vamos al index buscamos la tabla que hicimos para guardar el men.. debemos poner un if para ver cuando se muestre el men.. despejamos la tabla y metemos asp al princioi y final de la tabla

Para que no me cresca la tabla me poseciono en la tabla y en propiedades vertical superior

Me voy a validar para permitir quienes vean el mencreanos variable sessin validado nos metemos en el bloque de bienvenidacolocamos session("validado")="si" En el bloque no existe colocamos session("validado")="no" if rs.eof= false then session("validado")="si" session("mensaje")=("<b>Bienvenido: </b><br>" & rs("nombre")) else session("validado")="no" session("mensaje")=("<b>usuario no existe</b>")

end if session("tipo")=rs("tipo") ' amalcena en la variable tipo una letra cuando existe el usuario esta variable la vamos a usar. Nos vamos al index cuando la variable existe puede tener s a u.. me voy a las men y les doy los permisos con: <ul> <li><a href="mproductos.asp">Productos</a></li> <% if session("tipo")= "a" or session("tipo")= "s" then%> <li><a href="mcategorias.asp">Categorias</a></li> <% end if %> <% if session("tipo")= "s" then%> <li><a href="musuario.asp">Usuarios</a></li> <% end if %> </ul> Tabla producto Debemos hacer una forma para hacer mantenimiento de los productos.. el administardor puede ver el de cualquier usuario cuando le demos al men producto nos vamos a una pagina que tiene una seccin superior y una inferior.. superior un formulario para agregar la parte inferior una lista , opciones nos vamos a mproducto.. colocamos una tabla de f2, c1 , 800 pxl, centramos, borde o. En la lnea de abajo colocamos una tabla f4, c 8, 100%.(segunda fila) En la lnea de esta tabla en las celdas que dicen ok busco los dibujos en internet.. icon finder Para que salgan todos los productos.. debemos trabaja con las bases de datos.. colocamos el include conex en mproducto. Luego colocamos un cdigo asp para hacer una lnea dinmica <% wsql="select * from productos order by idproducto desc" set rs=con.execute(wsql) while rs.eof=false

%>

<!--fin del asp iniciado arriba --> <% rs.movenext wend %> Esta lnea de cdigo es para mostrar el nombrea que esta en la base de datos <% response.write(rs("nombre"))%> me posesiono en cualquier celda de la tabla y uso ese response write pero con lo que deseo que salga. Para cargar la imgenes me voy a diseo me centro en la celda, incerto una imagen luego me voy al cdigo borro el 1er uno e inserto cdigo asp <td align="center"><img src="imgproducto2/img<% response.write(rs("idproducto")) %>1.jpg" width="127" height="94" /></td> Para traer a la table los valores de las categorias: modificamos el select que hicimos al principio <% wsql="select * from productos order by idproducto desc" set rs=con.execute(wsql) while rs.eof=false

%> Por un select compuesto y haciendo alias select *, productos.nombre as np, categoras.nombre as nc from productos inner join categoras on productos.idcategorias=categoras.idcategoria luego en el cdigo mas arriba cambiamos los nombres por los alias np en producto y nc en categoras. La otra forma de hacerlos es por acces directamente Nos vamos a acces crear.consulta de diseo seleccionamos categoraaceptar luego producto..aceptar y se relacionan en consulta Le doy al asterisco *, luego a nombre de categora , despus anombre de producto luego veo el cdigo y lo acomodo copio luego pego en el cdigo de la tabla categora

Para hacer los cdigo de la parte de arriba de la tabla categora(primera fila) Creamos un formulario..dentro agregamos una tabla dependiendo de cuantos producto quiero cargar f8, c2, 500pix centrado border 1

TIPO VALORES DE LISTA.. NORMAL-----N PROMOCION---P PARA CATEGORIA ..VALORES DE LISTAseleccione una categora A Nombre---codigo nos ubicamos en la celda y nos vamos al codoigo pr que esto va a ser dinamico colocamos esto: <select name="CATEGORIA" id="CATEGORIA"> <option value="A">Seleccione una categoria</option> <% wsql="select * from categorias order by nombre" set rsc=con.execute(wsql) while rsc.eof=false %> Aqui cambio codigo por ="<% response.write(rsc("idcategoria Nombre por %>"><% response.write(rsc("nombre")) %> <option value="<% response.write(rsc("idcategoria")) %>"><% response.write(rsc("nombre")) %></option> <% rsc.movenext wend %> </select> Nos vamos adiseoformulario y lo validamos---accion la mandamos para ella misma mproducto mproductos.asp?modo=g para pasar un parmetro cuando aga clic PROGARMO REGISTRAR Y RESTABLECER

debemos validar formulario..ventana comportamiento-----validar formulario uno por uno obligatorio y el tipo de campo dw valida menos categora nos vamos al codifgo fdel formulario RisNum= oblifatori numrico 'CANTIDAD','','RisNum', ESTO LO COPIAMOS Y LO PEGAMOS antes de nombre y luego borramos cantidad y colocamos categora .. 'CATEGORIA','','RisNum', CON ESTO VALIDAMOS CATEGORIA DIVISION DE ESTA PAGINA EN VARIAS PARTES Para q la pagina tenga varias formas dibvidir en varias secciones Nos ubicamos en el body preguntamos si el modo esta en blanco