Dev Faq
-1
votes

"Tentative d'accès au décalage du tableau sur la valeur de type null" au format HTML

J'ai créé un formulaire HTML avec une zone de texte liée à une liste déroulante. Lorsque j'entre le code postal dans la zone de texte, la liste déroulante à droite doit être remplie avec les pays correspondants.

Au lieu de cela, je deviens l'erreur:

Tentative d'accès au décalage du tableau sur la valeur de type null dans /var/www/html/index.php à la ligne 58, référence: http://127.0.0.1/html/

Voici mon code:

<!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Listes li&eacute;es en JQuery</title>
        <link rel="shortcut icon" href="../../../images/site/favicon.ico" />
        <link type="text/css" rel="stylesheet" href="css/style.css" />
        
        <!-- Linked Lists -->
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/jquery.chained.js"></script>
        
        <!-- Updating departements -->
        <script type="text/javascript">
            $(function(){
            $("#departement").chained("#region");
            });
        </script>
        
        <!-- Updating communes -->
        <script type="text/javascript">
            $(function(){
            $("#commune").chained("#codepostal");
            });
        </script>
</head>

<body>
<?php
        // Connecting to database
        $bddname = 'database';
        $hostname = 'localhost';
        $username = 'user';
        $password = 'pass';
        $db = mysqli_connect ($hostname, $username, $password, $bddname);
        $db -> set_charset("utf8");
?>

<form method="post">
    <select name="region" id="region">
        <option value="">Sélectionner une région</option>
        <?php
            // Call up regions and display them in dropdown list
            $req = "SELECT RegionId, NomRegion FROM regions ORDER BY NomRegion";        
            $rep = mysqli_query($db, $req);
            while ($row = mysqli_fetch_array($rep)) {
                echo "<option value=".$row['RegionId'].">".$row['NomRegion']."</option>";
            }
        ?>
    </select>

    <select name="departement" id="departement">
        <option value="">Sélectionner un département</option>
        <?php
            // Call up departments and display them in dropdown list
            $req = "SELECT DepartementId, RegionId, NomDepartement FROM departements ORDER BY NomDepartement";
            $rep = mysqli_query($db, $req);
            while ($row = mysqli_fetch_array($rep)) {
                echo "<option value=".$row['DepartementId']." class=".$row['RegionId'].">".$row['NomDepartement']."</option>";
            }
        ?>
    </select>

     <!-- Zip Code Textbox -->  
     <input type="text" name="codepostal" id="codepostal" value="<?php $row['CodePostal']; ?>">
            
     <select name="commune" id="commune">
        <option value="">Sélectionner une commune</option>
        <?php
            // Call up countries and display them in dropdown list
            $req = "SELECT NomCommune FROM communes;
                            LEFT JOIN communeCP;
                            ON communeCP.CommuneId = communes.CommuneId;
                            LEFT JOIN codesPostaux;
                            ON codesPostaux.CodePostalId = communeCP.CodePostalId;
                            WHERE codesPostaux.CodePostal = ".$row["CodePostal"]." ORDER BY NomCommune";
            $rep = mysqli_query($db, $req);
            while ($row = mysqli_fetch_array($rep)) {
                echo "<option value=".$row['communeId']." class=".$row['CodePostal'].">".$row['NomCommune']."</option>";
            }
        ?>
    </select>
    
</form>

</body>
</html>

4 commentaires

<input type="text" name="codepostal" id="codepostal" value="<?php $row['CodePostal']; ?>"> <- ici $row est nul, car vous n'êtes plus à l'intérieur la boucle de résultat de la requête.

Merci, mais comment pourrais-je faire ça?

Quelle devrait être la valeur par défaut de l'entrée «codepostal» (zipcode)? Il y en a un par ministère, et vous n'avez qu'une seule contribution pour cela. Vous ne voulez probablement pas y avoir de valeur par défaut.

Non, je ne souhaite pas avoir de valeur par défaut pour le code postal. L'utilisateur entre un code postal, puis le champ à droite doit automatiquement être rempli avec les pays correspondants.

3 Réponses :

0
votes

Utilisez jquery change eventListener.

$('#codepostal').on('change', fnuction(evt){
   $('#commune').html(mockCommuneOptions());
})

//return mock options
function mockCommuneOptions(){
  const options = ['a','b','c']
  let optiionsStr = '';
  options.forEach(option => {
    optiionsStr += `<option value='${option}'>${option}</option`;
  });

return optiionsStr;
}

3 commentaires

Merci arabe, mais comment pourrais-je afficher la liste des pays correspondants à partir d'une requête SQL au lieu de abc?

Je pense que vous devriez d'abord apprendre quelques notions de base. veuillez consulter l'article, j'espère que cela vous aidera sur ce problème makitweb.com/how-to-handle-ajax-request-on-the-same-page-php

Oui, je suis un débutant. J'ai jeté un œil sur l'article. Mais cela ne m'aide pas, je ne sais pas comment l'utiliser pour envoyer la valeur du champ de texte à ma requête SQL.

0
votes

Alors, testé avec AJAX. Sachez que mon script fonctionne sans aucune erreur dans mon journal apache2. Mais, il affiche [] entre la zone de saisie et la zone de liste pour droitiers et rien ne se passe lorsque j'entre un code postal.

Voici le code:

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
    <title>Listes li&eacute;es en JQuery</title>
    <link rel="shortcut icon" href="../../../images/site/favicon.ico" />
    <link type="text/css" rel="stylesheet" href="css/style.css" />
     
    <!-- Linked Lists -->        
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.chained.js"></script>
      
    <!-- Updating departements -->
    <script type="text/javascript">
        $(function(){
            $("#departement").chained("#region");
        });
    </script>
      
</head>
 
    <body>
    <?php
        // Connecting to database
        $bddname = 'database';
        $hostname = 'localhost';
        $username = 'user';
        $password = 'pass';
        $db = mysqli_connect ($hostname, $username, $password, $bddname);
        $db -> set_charset("utf8");
    ?>
            
    <form method="post">
        <select name="region" id="region">
            <option value="">Sélectionner une région</option>
                <?php
                    // Call up regions and display them in dropdown list
                    $req = "SELECT RegionId, NomRegion FROM regions ORDER BY NomRegion";        
                    $rep = mysqli_query($db, $req);
                    while ($row = mysqli_fetch_array($rep)) {
                        echo "<option value=".$row['RegionId'].">".$row['NomRegion']."</option>";
                    }
                ?>
            </select>
            
            <select name="departement" id="departement">
                <option value="">Sélectionner un département</option>
                <?php
                    // Call up departments and display them in dropdown list
                    $req = "SELECT DepartementId, RegionId, NomDepartement FROM departements ORDER BY NomDepartement";
                    $rep = mysqli_query($db, $req);
                    while ($row = mysqli_fetch_array($rep)) {
                        echo "<option value=".$row['DepartementId']." class=".$row['RegionId'].">".$row['NomDepartement']."</option>";
                    }
                ?>
            </select>
 
            <!-- Zip Code Textbox -->
            <input type="text" name="codepostal" id="codepostal" pattern="[0-9]*" maxlength="5">
            
                <!-- Call up countries to display them in dropdown list -->
                <script type="text/javascript">
                    $(document).ready(function(){
                        $("#codepostal").blur(function(){
                            var cp = $(this).val();
                            $.ajax({
                                type: 'post',
                                data: {codePostal:cp},
                                dataType: 'json',
                                success:function(response){
                                    var len = response.length;
                                    $("#commune").empty();
                                    for( var i = 0; i<len; i++ ){
                                        var id = response[i]['id'];
                                        var name = response[i]['name'];
                                        $("#commune").append("<option value='"+id+"'>"+name+"</option>");
                                    }
                                }
                            });
                        });
                    });
                </script>
            
                <?php 
                    // Handle AJAX request (start)              
                    $codepostal = 0;
                    if( isset($_POST['codePostal']) ){
                        $codepostal = $_POST['codePostal'];
                    }
                    $comm_arr = array();
                    if($codepostal > 0){
                        
                        // Query Db and store the Countries corresponding to Zip Code in an aray
                        $req = "    SELECT communes.CommuneId cid, NomCommune FROM communes
                                    LEFT JOIN communeCP
                                    ON communeCP.CommuneId = communes.CommuneId
                                    LEFT JOIN codesPostaux
                                    ON codesPostaux.CodePostalId = communeCP.CodePostalId
                                    WHERE codesPostaux.CodePostal = '$codepostal' ORDER BY NomCommune";
                        $rep = mysqli_query($db, $req);
                        while ($row = mysqli_fetch_array($rep)) {
                            $commId = $row['cid'];
                            $commune = $row['NomCommune'];      
                            $comm_arr = array("id" => $commId, "name" => $commune);
                        }
                    }
                    
                    // encoding array to json format
                    echo json_encode($comm_arr);
                ?>
            <!-- Countries dropdown list -->
            <select name="commune" id="commune">
                <option value="0">Sélectionner une commune</option>
            </select>
        </form>
        
    </body>
</html>

0 commentaires
0
votes

Alors, je finance la solution. Maintenant, j'essaye d'ajouter des fonctionnalités. Je voudrais afficher dans l'ancienne ou la nouvelle région dans la liste déroulante, en fonction des sélections de boutons radio. La fonctionnalité fonctionne. Mais je ne savais pas comment afficher les départements. J'ai besoin de 2 variables de régions, une pour les nouvelles régions et une autre si vous sélectionnez les anciennes régions. Mais ils ne sont pas envoyés à PHP. Voici mon code:

    var gReg = {};
var reg = {};

$(document).ready(function(){
    $("input[name='choix']").click(function(){
        
        // Populate Dropdownlist with new region names
        if ($(this).val() === '1') {
            $('#region').find('option').not(':first').remove();
            
            // AJAX request
            $.ajax({
                url: 'communes.php',
                type: 'post',
                data: {request: 1}, 
                dataType: 'json',
                success: function(response){
                    $("#region").click(function(){
                        var len = response.length;
                        for( var i = 0; i<len; i++){
                            var grandeRegionId = response[i]['grandeRegionId'];
                            var nomGrandeRegion = response[i]['nomGrandeRegion'];
                            function gReg() {
                                regype.gdeRegId = grandeRegionId;
                            } 
                            $("#region").append("<option value='"+grandeRegionId+"'>"+nomGrandeRegion+"</option>");
                        }
                    });

                }
            });
        // Populate Dropdownlist with old region names
        } else if ($(this).val() === '2') {
        
        // AJAX request
            $.ajax({
                url: 'communes.php',
                type: 'post',
                data: {request: 2},
                dataType: 'json',
                success: function(response){
                    $("#region").click(function(){
                        var len = response.length;
                        for( var i = 0; i<len; i++){
                            var regionId = response[i]['regionId'];
                            var nomRegion = response[i]['nomRegion'];
                            function reg() {
                                regype.regId = regionId;
                            }
                            $("#region").append("<option value='"+regionId+"'>"+nomRegion+"</option>");
                        }
                    });
                }
            });
        }
        // End condition

        
        // Populate dropdown list with departments                                  
        $('#region').blur(function(){
            function regionType() {
                regype.gdeRegId = grandeRegionId;
                
                // AJAX request
                // Populate it with departments based on grandeRegionId (New Regions)
                if (grandeRegionId > 0) {
                    $.ajax({
                        url: 'communes.php',
                        type: 'post',
                        data: {request: 3, grandeRegionId: gdRegId},
                        dataType: 'json',
                        success: function(response){
                            $("#departement").click(function(){ 
                                var len = response.length;
                                for( var i = 0; i<len; i++){
                                    var departementId = response[i]['departementId'];
                                    var nomDepartement = response[i]['nomDepartement'];
                                    $("#departement").append("<option value='"+departementId+"'>"+nomDepartement+"</option>");
                                }
                            });
                        }
                    });
                    
                // Populate it with departments based on regionId (Old Regions)
                } else if (regionId > 0) {
                    var regId = $(this).val();
                    function regionType() {
                        regype.regId = regionId;
                        // AJAX request
                        if (regionId > 0) {
                            $.ajax({
                            url: 'communes.php',
                            type: 'post',
                            data: {request: 3, regionId: regId},
                            dataType: 'json',
                            success: function(response){
                                $("#departement").click(function(){ 
                                    var len = response.length;
                                    for( var i = 0; i<len; i++){
                                        var departementId = response[i]['departementId'];
                                        var nomDepartement = response[i]['nomDepartement'];
                                        $("#departement").append("<option value='"+departementId+"'>"+nomDepartement+"</option>");
                                    }
                                });
                            }
                        }
                    });
                }
            }
        });
    });
});

0 commentaires

Articles qui pourrait vous intéresser :

Pourquoi est-ce que j'obtiens une erreur laravel lors de la création d'un nouveau projet?
Select2 ne s'affiche pas correctement dans le mode bootstrap
Laravel Echo n'écoute pas
La validation de la demande de formulaire ne fonctionne pas. Il charge juste la page d'accueil dans Postman