resulta que estoy tratando de modificar este link de jquery: http://jqueryui.com/dialog/#modal-form
con respecto a un campo para verificar antes disponibilidad de usuario, si existe o no.
el asunto que el codigo trae una parte una variable valid, donde si es true agrega el campo.. si es false no lo agrega.
el punto que no he podido hacer que me entregue esa alerta en dicho campo.. pongo un alert para ver que muestra y solo abre una ventana sin comentarios, pero en un div donde puse la respuesta a la consulta de php, me indica si es true o false, y realiza bien la consulta.
pero jquery no me muestra esa respuesta para pasarla con la variable valid.
les muestro el ejemplo:
[js]function addUser() {
var valid = true;
allFields.removeClass( "ui-state-error" );
//valid = valid && checkSelect( Asignaturas);
valid = validaUsuario(Seccion);// AQUI DONDE DEBE MOSTRAR SI ES TRUE O FALSE PARA QUE VALIDE
alert(valid); // EN ESTE ALERT ME DEBE MOSTRAR LO PASADO POR LA VARIABLE VALID
if ( valid ) {
$( "#users tbody" ).append( "<tr>" +
"<td>" + Asignaturas.val() + "</td>" +
"<td>" + Seccion.val() + "</td>" +
"<td>" + Cupos_a_Ofertar.val() + "</td>" +
"</tr>" );
$.ajax({
url:"respuesta.php",
data:{"asignaturas":$("#Asignaturas").val(),"seccion":$("#Seccion").val()},
contentType:"application/x-www-form-urlencoded",
dataType:"html", //xml,html,script,json
error: function(){
alert("ha ocurrido un error");
},
ifModified:false,
processData:true,
success:function(datas){
$("#respuesta").html(datas);
},
type:"POST",
timeout:3000
});
dialog.dialog( "close" );
}
return valid;
}[/js]
La parte que esta en negrito en comentario, es donde me debe mostrar si es true o False y el alert me debe mostrar dicho resultado, pero no me muestra nada.
por favor su ayuda que la he pensado mucho y no se me ocurre como hacerlo.
adjunto la funcion ajax, donde consulto en la BD si existe el usuario o no: pero los alert no muestra nada.. aparece la ventana en blanco
[js]function validaUsuario(o)
{
$.ajax({
type: "POST",
url: "validar.php",
data:{"asignaturas":$("#Asignaturas").val(),"usuario"
.val()},success: function( respuesta )
{
return $("#respuesta").html(respuesta);
}
});
}
//****************************************************************************************************************************************************
function checkSelectSeccion(o)
{ if(validaUsuario(o) == 1){
alert("hola");
}
if(validaUsuario(o) == 0){
alert("chao");
}
}[/js]
adjunto el codigo completo:
[html5]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<link href="css/redmond/jquery-ui-1.10.4.custom.css" rel="stylesheet">
<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery-ui-1.10.4.custom.js"></script>
<style>
body { font-size: 62.5%; }
label, input { display:block; }
input.text { margin-bottom:12px; width:95%; padding: .4em; }
fieldset { padding:0; border:0; margin-top:25px; }
h1 { font-size: 1.2em; margin: .6em 0; }
div#users-contain { width: 350px; margin: 20px 0; }
div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; }
</style>
<script type="text/javascript">
//*******************************************************************************************************************
$(function() {
var dialog, form,
// From http://www.whatwg.or...te-(type=email)
emailRegex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/,
Asignaturas = $( "#Asignaturas" ),
Seccion = $( "#Seccion" ),
Cupos_a_Ofertar = $( "#Cupos_a_Ofertar" ),
allFields = $( [] ).add( Asignaturas ).add( Seccion ).add( Cupos_a_Ofertar );
//*******************************************************************
tips = $( ".validateTips" );
//*******************************************************************
function updateTips( t ) {
tips
.text( t )
.addClass( "ui-state-highlight" );
setTimeout(function() {
tips.removeClass( "ui-state-highlight", 1500 );
}, 500 );
}
//*******************************************************************
/*function checkLength( o, n, min, max ) { //verifica el largo de caracteres
if ( o.val().length > max || o.val().length < min ) {
o.addClass( "ui-state-error" );
updateTips( "Length of " + n + " must be between " +
min + " and " + max + "." );
return false;
} else {
return true;
}
}
*/
//*******************************************************************
function checkSelect(o)
{ if( o.val()=="")
{
o.addClass( "ui-state-error" );
updateTips( "debe seleccionar una opcion" );
return false;
}else
{
return true;
}
}
//*******************************************************************
function checkSelectSeccion(o)
{ if(validaUsuario(o) == 1){
alert("hola");
}
if(validaUsuario(o) == 0){
alert("chao");
}
}
//*******************************************************************
function validaUsuario(o)
{
$.ajax({
type: "POST",
url: "validar.php",
data:{"asignaturas":$("#Asignaturas").val(),"usuario"
.val()},success: function( respuesta )
{
return $("#respuesta").html(respuesta);
}
});
}
//*******************************************************************
//***************************************************
function addUser() {
var valid = true;
allFields.removeClass( "ui-state-error" );
//valid = valid && checkSelect( Asignaturas);
valid = validaUsuario(Seccion);
alert(valid);
if ( valid ) {
$( "#users tbody" ).append( "<tr>" +
"<td>" + Asignaturas.val() + "</td>" +
"<td>" + Seccion.val() + "</td>" +
"<td>" + Cupos_a_Ofertar.val() + "</td>" +
"</tr>" );
$.ajax({
url:"respuesta.php",
data:{"asignaturas":$("#Asignaturas").val(),"seccion":$("#Seccion").val()},
contentType:"application/x-www-form-urlencoded",
dataType:"html", //xml,html,script,json
error: function(){
alert("ha ocurrido un error");
},
ifModified:false,
processData:true,
success:function(datas){
$("#respuesta").html(datas);
},
type:"POST",
timeout:3000
});
dialog.dialog( "close" );
}
return valid;
}
//****************************************************************
//*******************************************************************
dialog = $( "#dialog-form" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
"Agregar Una Asignatura": addUser,
Cancel: function() {
dialog.dialog( "close" );
}
},
close: function() {
form[ 0 ].reset();
allFields.removeClass( "ui-state-error" );
}
});
form = dialog.find( "form" ).on( "submit", function( event ) {
event.preventDefault();
addUser();
});
$( "#create-user" ).button().on( "click", function() {
dialog.dialog( "open" );
});
});
//*************************************************************************
//*********************************************************************
</script>
</head>
<body>
<!--*************************************************************************************************-->
<div id="dialog-form" title="Agregar una nueva Asigantura">
<p class="validateTips">Todos los Campos Son Requeridos</p>
<form>
<fieldset>
<!--*************************************************************************************************-->
<label for="Asignaturas">Asignatura</label>
<select name="Asignaturas" id="Asignaturas" class="text ui-widget-content ui-corner-all">
<option selected="selected" value="">Seleccione La Asignatura</option>
<?php
for($i=0;$i<10;$i++)
{
?>
<option value="<?php echo $i; ?>">numero <?php echo $i; ?> </option>
<?php
}
?>
</select>
<!--<input type="text" name="Asignaturas" id="Asignaturas" class="text ui-widget-content ui-corner-all">-->
<!--*************************************************************************************************-->
<label for="Seccion">Seccion</label>
<select name="Seccion" id="Seccion" class="text ui-widget-content ui-corner-all">
<option selected="selected" value="">Seleccione la Seccion</option>
<?php
for($i=0;$i<10;$i++)
{
?>
<option value="<?php echo $i; ?>">seccion <?php echo $i; ?></option>
<?php
}
?>
</select>
<!--<input type="text" name="Seccion" id="Seccion" class="text ui-widget-content ui-corner-all">-->
<!--*************************************************************************************************-->
<label for="Cupos_a_Ofertar">Cupos A Ofertar</label>
<select name="Cupos_a_Ofertar" id="Cupos_a_Ofertar" class="text ui-widget-content ui-corner-all">
<option selected="selected" value="">Cupos a Ofertar</option>
<?php
for($i=0;$i<10;$i++)
{
?>
<option value="<?php echo $i; ?>">Cupos <?php echo $i; ?> </option>
<?php
}
?>
</select>
<!--<input type="password" name="Cupos_a_Ofertar" id="Cupos_a_Ofertar" class="text ui-widget-content ui-corner-all">-->
<!-- Allow form submission with keyboard without duplicating the dialog button -->
<!--*************************************************************************************************-->
<input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
</fieldset>
</form>
</div>
<!--*************************************************************************************************-->
<div id="users-contain" class="ui-widget">
<h1>Ramos Solicitados:</h1>
<table id="users" class="ui-widget ui-widget-content">
<thead>
<tr class="ui-widget-header ">
<th>Asignaturas</th>
<th>Seccion</th>
<th>Cupos A Ofertar</th>
</tr>
</thead>
<tbody>
<tr>
<!--<td>John Doe</td>
<td>john.doe@example.com</td>
<td>johndoe1</td>-->
</tr>
</tbody>
</table>
</div>
<button id="create-user">Create new user</button>
<div id="respuesta">hola</div>
<br />
<!--*************************************************************************************************-->
<!--*************************************************************************************************-->
</body>
</html>[/html5]
