Hola a todos.
En un template que he desarrollado he incluido un combobox dinamico (Provincia, Ciudad, Distrito)
Para ello he utilizado Ajax y Jquery.
Funciona perfectamente, pero me gustaria saber como puedo insertar una imagen de "Ejecutando o espera".
Aqui os dejo el codigo.
Un saludo.
Funcion1
Código PHP:
Ver originaladd_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function implement_ajax() {
if(isset($_POST['main_catid']))
{
$categories= get_categories('parent='.$_POST['main_catid'].'&hide_empty=0'. '&orderby=ID');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Selecciona una localidad</option>'.$option;
die();
} // end if
}
add_action('wp_ajax_my_special_action', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_action', 'implement_ajax');//for users that are not logged in.
?>
<?php
add_action('wp_ajax_my_special_action2', 'my_action_callback2');
add_action('wp_ajax_nopriv_my_special_action2', 'my_action_callback2');
function implement_ajax2() {
if(isset($_POST['termidid'])) {
$categories= get_categories('child_of='.$_POST['termidid'].'&hide_empty=0'. '&orderby=name');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Selecciona un distrito</option>'.$option;
} // end if
}
add_action('wp_ajax_my_special_action2', 'implement_ajax2');
add_action('wp_ajax_nopriv_my_special_action2', 'implement_ajax2');//for users that are not logged in.
Formulario combobox
Código PHP:
Ver original<div class="create_post_row clearfix"> <label> <?php _e(ADS_TITLE_TEXT);?> : <span class="indicates">*</span> </label>
<input name="post_title" id="post_title" value="<?php echo $data['post_title'];?>" type="text" class="textfield required email" />
<span id="post_titleInfo"></span>
</div>
<script>
$(function(){
$('#main_cat').change(function(){
var $mainCat=$('#main_cat').val();
// call ajax
$("#termid").empty();
$.ajax({
url:"wp-admin/admin-ajax.php",
type:'POST',
data:'action=my_special_action&main_catid=' + $mainCat,
success:function(results)
{
// alert(results);
$("#termid").removeAttr("disabled");
$("#termid").append(results);
}
});
}
);
});
$(function(){
$('#termid').change(function(){
var $costra=$('#termid').val();
// call ajax
$("#zona").empty();
$.ajax({
url:"wp-admin/admin-ajax.php",
type:'POST',
data:'action=my_special_action2&termidid=' + $costra,
success:function(results)
{
// alert(results);
$("#zona").removeAttr("disabled");
$("#zona").append(results);
}
});
}
);
});
</script>
<div class="create_post_row clearfix"> <label><?php _e(SELECT_CAT_TEXT);?> : <span class="indicates">*</span> </label>
<?php
wp_dropdown_categories('show_count=0&selected=-1&hierarchical=1&depth=1&orderby=name&hide_empty=0&exclude=1,55&show_option_none=Selecciona tu Provincia&name=main_cat');
?>
</div>
<div class="create_post_row clearfix"> <label> <?php _e(LOCALIDAD2_TEXT);?> : <span class="indicates">*</span> </label>
<select name="termid" id="termid" disabled="disabled" style="width: 400px; border-style:solid; border-width:1px; border-color: #CCC" ><option value=""><?php _e(LOCALIDAD_TEXT);?></option>
</select>
</div>
<div class="create_post_row clearfix"> <label> <?php _e(LOCALIDAD3_TEXT);?> : <span class="indicates">*</span> </label>
<select name="zona" id="zona" disabled="disabled" style="width: 400px; border-style:solid; border-width:1px; border-color: #CCC" "><option value=""><?php _e(LOCALIDAD_TEXT);?></option>
</select>
</div>