Exécuter un onchange depuis un appel jquery / dropdown liées

Bonjour à tous,

je ne savais pas trop quoi mettre comme titre, peut-être celui-ci est-il saugrenu ou vide de sens dans ce cas n'hésitez pas à me le dire.

J'ai le code suivant:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
  <title>Jedox multi-selector - Proof of concept</title>
 
  <!-- Libraries -->
  <script src="../jquery/jquery.js" type="text/javascript"></script>
  <script src="../jquery/jquery-ui.custom.js" type="text/javascript"></script>
  <script src="../jquery/jquery.cookie.js" type="text/javascript"></script>
 
  <!-- CSS -->
  <link href="style.css" rel="stylesheet" type="text/css">
 
  <script type="text/javascript">

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
   $(document).ready(function() {
    var $regions = $('#regions');
    var $departements = $('#departements');
    var $villes = $('#villes');
 
    $.ajax({
        url: 'treatment.php',
        data: 'go', 
        dataType: 'json', 
        success: function(json) {
            $.each(json, function(index, value) {
 
                $regions.append('<option value="'+ index +'">'+ value +'</option>');
 
            });
        }
    });
 
 
    $regions.on('change', function() {
        var val = $(this).val(); 
 
        if(val != '') {
            $departements.empty(); 
 
            $.ajax({
                url: 'treatment.php',
                data: 'id_region='+ val, 
                dataType: 'json',
                success: function(json) {
                    $.each(json, function(index, value) {
			$departements.append('<option value="'+ index +'">'+ value +'</option>');                        			
                    });
 
                }
            });
            $('#departements option:eq(0)').prop('selected', true);
        }
    });
 
 
    $departements.on('change', function() {
        var val = $(this).val(); 
 
        if(val != '') {
            $villes.empty();
 
            $.ajax({
                url: 'treatment.php',
                data: 'id_dept='+ val, 
                dataType: 'json',
                success: function(json) {
 
                    $.each(json, function(index, value) {
			console.log(index);
                        $villes.append('<option value="'+ index +'">'+ value +'</option>');                        
                    });
 
                }
            });
            $('#villes option:eq(0)').prop('selected', true);
        }
    });
 
 
});

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
  </script>
</head>
 
  <body>	
	<select id="regions" name="regions">
	<option value="">-- Régions --</option>
	</select>
 
	<select id="departements" name="departements">
	    <option value="">-- Départements--</option>
	</select>
	<select id="villes" name="villes">
	    <option value="">-- Villes--</option>
	</select>	
  </body>
</html>

et le php qui va avec:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<?php
if(isset($_GET['go']) || isset($_GET['id_region']) || isset($_GET['id_dept'])) {
 
    $json = array();
 
    if(isset($_GET['go'])) {
       $json['32']='Lorraine';
       $json['34']='Midi';
    } else if(isset($_GET['id_region'])) {
       $arrDepts=array(
		    '32'=>array(
			      '55'=>'Meuse',
			      '54'=>'Meurthe-et-Moselle'
			      ),
		    '34'=>array(
			      '31'=>'Haute-Garonne',
			      '32'=>'Gers'
			      )
		      );
       $json=$arrDepts[$_GET['id_region']];
    }
    else if (isset($_GET['id_dept']))
    {
       $arrVilles=array(
		    '55'=>array(
			      '551'=>'Bar le Duc',
			      '552'=>'Verdun'
			      ),
		    '54'=>array(
			      '541'=>'Nancy',
			      '542'=>'PAM'
			      ),			      
		    '31'=>array(
			      '311'=>'Toulouse',
			      '312'=>'Castres'
			      )
		      );
	$json=$arrVilles[$_GET['id_dept']];
    }
 
 
    //echo $_GET['id_dept'];
     //print_r($json);
    // envoi du résultat au success
    echo json_encode($json);
}
?>

ceci fonctionne bien mais ce que je veux faire (c'est le but des lignes 59 et 83), c'est que lors de l'initialisation il exécute les évenements onchange comme si c'était l'utilisateur qui avait changé de combobox. Je m'explique:

1. au début j'ai --- Régions --- / --- Départements --- / --- Villes ---
2. lorsque je choisis "Lorraine", je souhaiterais que dans "Départements" arrive directement le premier, à savoir Meurthe-et-Moselle, mais aussi dans "villes" la première option, à savoir "Nancy"

Est-ce possible ? Avec le code ci-dessus il me sélectionne la première valeur de Départements, mais pas de Villes :-(

Une idée? D'avance merci !