<style>
	input{
		font-size: 11px;
		background-color: #EEF3F7;
	}
	select{
		font-size: 11px;
		background-color: #EEF3F7;
	}
</style>
<article>
	<h1><span class="icon-users"></span> &nbsp;&nbsp;Administrar Usuarios</h1>
    <h2>Lista de todos los usuarios</h2>
    <section>
    	<table>
			<thead>
				<tr>
					<th style="width:56px">Usr</th>
					<th style="width:71px">Claves</th>
					<th style="width:95px">Uso</th>
					<th style="width:68px">Estado</th>
					<th style="width:86px">Nombres</th>
					<th style="width:205px">Correo</th>
					<th style="width:32px">&nbsp;</th>
					<th style="width:32px" align="center">
					  <a href="#" onClick="registrarUsuariox();" style="cursor: pointer">
							<span class="icon-add-user"></span>
					  </a>
					</th>
				</tr>
			</thead>
		</table>
		<div id="listarUsuario"></div>
    </section>    
</article>
 <script>
	 function registrarUsuariox(){
		 $("#dialog-confirmx" ).dialog({
			resizable: false,
			height: "auto",
			width: 280,
			modal: true,
			buttons: {
				"Registrar": function() { agregarUsuariox($('#usx').val(),$('#pax').val(),$('#sox').val(),$('#stx').val(),$('#mbx').val(),$('#crx').val());},
				Cancel: function() { $( this ).dialog( "close" );}
			}
		});
	}
</script><!--ACTIVA LA VENTANA MODAL OCULTO -->
<div id="dialog-confirmx" title="Registrar Usuario" style="display:none">
	<p> 
	<center>   
<table width="100%" border="0">
  <tbody>
    <tr>
      <td width="15%">Usuario:</td>
      <td width="30%"><input type="text" id="usx"></td>
      <td width="55%">&nbsp;</td>
    </tr>
    <tr>
      <td>Contraseña:</td>
      <td><input type="password" id="pax"></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>Uso:</td>
      <td>				  
      	<select id="sox">
			<option value="webmas" selected>Web Master</option>
			<option value="ventas">Ventas</option>
			<option value="soport">Soporte</option>
			<option value="desarr">Desarrollo</option>
		</select>
	</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>Estado:</td>
      <td>
     		<select id="stx">
				<option value="1" selected>Activo</option>
				<option value="0" >Inactivo</option>
			</select>
      </td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>Nombres:</td>
      <td><input type="text" id="mbx"></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>Correo:</td>
      <td><input type="text" id="crx"></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
		<td colspan="3" align="center"><span id="agregarUsuariox"></span></td>
      </tr>
  </tbody>
</table>
<center>
	</p>
</div><!--VENTANA MODAL OCULTO -->
<script type="text/jscript" src="js/usuario.js"></script>

