<?php

include("DFJQUERY.inc");
include("DFSELMAN.inc");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

</head>

<script language="javascript" src="DSSCRIPT.js"></script>
<script language="javascript">
$(document).ready(function() {
function getAjaxSource(){
	return 'ZserverPruebaJquery.php';
}
function llenaPaises(){
	 $.post(getAjaxSource(),
		{ loadMenu: '34' },
		function(datos) {
			var objSelect= new SelectManager('paises');
			objSelect.clearOptions();
			objSelect.addOptions(eval(datos));
		}
	);
}
  
  $('select#paises').change(function(){
	var objPaises= new SelectManager('paises');
	var objEstados= new SelectManager('estados');
	var objDelMun= new SelectManager('delMun');
	var objColCiu= new SelectManager('colCiu');

	objEstados.dropOptions(1,objEstados.getLength());
	objDelMun.dropOptions(1,objDelMun.getLength());
	objColCiu.dropOptions(1,objColCiu.getLength());
	$.post(getAjaxSource(),
  			{ keyEstados: objPaises.getSelectedValue()},
  			function(datos) {
				objEstados.clearOptions();
				objEstados.addOptions(eval(datos));
			}
		);
		objPaises=null;
		objSelect=null;
	});
	
	$('select#estados').change(function(){
		var objPaises= new SelectManager('paises');
		var objEstados= new SelectManager('estados');
		var objDelMun= new SelectManager('delMun');
		var objColCiu= new SelectManager('colCiu');

		objDelMun.dropOptions(1,objDelMun.getLength());
		objColCiu.dropOptions(1,objColCiu.getLength());
		$.post(
			getAjaxSource(),
			{
			keyDelMun: objPaises.getSelectedValue()+"|"+objEstados.getSelectedValue()
			},
			function(datos) {
				objDelMun.clearOptions();
				objDelMun.addOptions(eval(datos));
			}//termina funcion tratado datos
		);//termina post
	});//termina accion change
	
  	$('select#delMun').change(function(){
		var objPaises= new SelectManager('paises');
		var objEstados= new SelectManager('estados');
		var objDelMun= new SelectManager('delMun');
		var objColCiu= new SelectManager('colCiu');

		objColCiu.dropOptions(1,objColCiu.getLength());
		$.post(
			getAjaxSource(),
			{
			keyColCiu: objPaises.getSelectedValue()+"|"+objEstados.getSelectedValue()+"|"+objDelMun.getSelectedValue()
			},
			function(datos) {
				objColCiu.clearOptions();
				objColCiu.addOptions(eval(datos));
			}//termina funcion tratado datos
		);//termina post
	});
	llenaPaises();
});

function getCP(datos){
	if(datos['idColonia']!='undefined' && datos['cp']=='undefined'){
		
	}
	else if(datos['idColonia']=='undefined'  && datos['cp']!='undefined'){
	
	}
}
//Termina en Carga 
</script>
<body>
<form id="form1" name="form1" method="post" action="">
  <table width="100%"  cellspacing="0" cellpadding="0">
    <tr>
      <th colspan="3" style="#333333" scope="col"><span class="style1">ENCABEZADO</span></th>
    </tr>
    <tr>
      <td><div align="center" id="divPrueba2">SE OCULTA</div> </td>
      <td><div align="center" id="divPrueba">SE OCULTA</div> </td>
      <td>no pasa nada </td>
    </tr>
    <tr>
      <td>Pais:
        <select name="paises" id="paises">
        </select></td>
      <td><label></label></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td colspan="3">Estado:
        <label>
        <select name="estados" id="estados">
        </select>
        </label></td>
    </tr>
    <tr>
      <td colspan="3">Del./Mun.:
        <select name="delMun" id="delMun">
        </select></td>
    </tr>
    <tr>
      <td colspan="3">Col./Ciudad
        <label>
        <select name="colCiu" id="colCiu">
        </select>
        </label>
      </td>
    </tr>
    <tr>
      <td colspan="3"><label>
        <label>
        <input name="codigoPostal" type="text" id="codigoPostal" />
        </label>
        <div align="center">
          <input name="loadMenu" type="submit" id="loadMenu" value="Busca Codigo" />
        </div>
      </label></td>
    </tr>
  </table>
  <label></label>
</form>
</body>
</html>
