php - 使用ajax填充2个输入

Question

首先让我为我糟糕的英语道歉(我只学习了 6 个月的英语)。

我正在做一个使用 mysql 数据库的网站，由于某些原因我必须使用需要数据库干预的表单，所以我检查了一个使用 ajax 来执行操作的脚本自动完成输入类型文本，用于在数据库中进行研究，以免显示超过数千个条目的选择。

所以我有这个脚本:

在 nouveau dossier.php 页面上

  <?php $monfichier = fopen('liste_clients.txt', 'w');

// 2 : on lit la première ligne du fichier
$ligne = fgets($monfichier);
ftruncate($monfichier,0);
$sql2 = "SELECT code_client, nom_commercial FROM client";
$re2 = mysql_query($sql2) or die(__LINE__.mysql_error().$sql2); 
while($d2 = mysql_fetch_assoc($re2)) {
fputs($monfichier, $d2['nom_commercial'].' '.$d2['code_client'].'|');
fputs($monfichier, $d2['code_client'].' '.$d2['nom_commercial'].'|');
         }
// 3 : quand on a fini de l'utiliser, on ferme le fichier
fclose($monfichier);
?> 

此脚本必须将我的数据库的所有条目保存在文件文本中。

之后我有这个ajax脚本:

<div id="results"></div>
<script language="JavaScript">
(function() {
var searchElement = document.getElementById('search'),
results = document.getElementById('results'),
selectedResult = -1, // Permet de savoir quel résultat est sélectionné : -1 signifie «             aucune sélection »
previousRequest, // On stocke notre précédente requête dans cette variable
previousValue = searchElement.value; // On fait de même avec la précédente valeur



function getResults(keywords) { // Effectue une requête et récupère les résultats

var xhr = new XMLHttpRequest();
xhr.open('GET', 'autocomplete.php?s='+ encodeURIComponent(keywords));

xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {

displayResults(xhr.responseText);

}
};

xhr.send(null);

return xhr;

}

function displayResults(response) { // Affiche les résultats d'une requête

results.style.display = response.length ? 'block' : 'none'; // On cache le conteneur si on n'a pas de résultats

if (response.length) { // On ne modifie les résultats que si on en a obtenu

response = response.split('|');
var responseLen = response.length;

results.innerHTML = ''; // On vide les résultats

for (var i = 0, div ; i < responseLen ; i++) {

div = results.appendChild(document.createElement('div'));
div.innerHTML = response[i];

div.onclick = function() {
chooseResult(this);
};

}

}

}

function chooseResult(result) { // Choisit un des résultats d'une requête et gère tout ce qui y est attaché

searchElement.value = previousValue = result.innerHTML; // On change le contenu du champ de recherche et on enregistre en tant que précédente valeur
results.style.display = 'none'; // On cache les résultats
result.className = ''; // On supprime l'effet de focus
selectedResult = -1; // On remet la sélection à zéro
searchElement.focus(); // Si le résultat a été choisi par le biais d'un clic, alors le focus est perdu, donc on le réattribue

}



searchElement.onkeyup = function(e) {

e = e || window.event; // On n'oublie pas la compatibilité pour IE

var divs = results.getElementsByTagName('div');

if (e.keyCode == 38 && selectedResult > -1) { // Si la touche pressée est la flèche « haut »

divs[selectedResult--].className = '';

if (selectedResult > -1) { // Cette condition évite une modification de childNodes[-1], qui n'existe pas, bien entendu
divs[selectedResult].className = 'result_focus';
}

}

else if (e.keyCode == 40 && selectedResult < divs.length - 1) { // Si la touche pressée est la flèche « bas »

        results.style.display = 'block'; // On affiche les résultats

        if (selectedResult > -1) { // Cette condition évite une modification de childNodes[-1], qui n'existe pas, bien entendu
            divs[selectedResult].className = '';
        }

        divs[++selectedResult].className = 'result_focus';

    }

    else if (e.keyCode == 13 && selectedResult > -1) { // Si la touche pressée est « Entrée »

        chooseResult(divs[selectedResult]);

    }

    else if (searchElement.value != previousValue) { // Si le contenu du champ de recherche a changé

        previousValue = searchElement.value;

        if (previousRequest && previousRequest.readyState < 4) {
            previousRequest.abort(); // Si on a toujours une requête en cours, on l'arrête
        }

        previousRequest = getResults(previousValue); // On stocke la nouvelle requête

        selectedResult = -1; // On remet la sélection à zéro à chaque caractère écrit

    }

};

})();

在页面 autocomplete.php 我有:

<?php
 $data = ((file_get_contents('liste_clients.txt'))); // Récupération de la liste complète des villes
    $dataLen = count($data);

    sort($data); // On trie les villes dans l'ordre alphabétique

    $results = array(); // Le tableau où seront stockés les résultats de la recherche

    // La boucle ci-dessous parcourt tout le tableau $data, jusqu'à un maximum de 10 résultats

        for ($i = 0 ; $i < $dataLen && count($results) < 10 ; $i++) {
            if (stripos($data[$i], $_GET['s']) === 0) { // Si la valeur commence par les mêmes caractères que la recherche

                array_push($results, $data[$i]); // On ajoute alors le résultat à la liste à retourner

            }
        }

    echo implode('|', $results); // Et on affiche les résultats séparés par une barre verticale |

    ?>

问题是当我使用脚本时它显示此错误: 警告:sort() 期望参数 1 为数组，第 5 行 C:\wamp\www\NEOGETCASH\GESTIONNAIRE\autocomplete.php 中给出的字符串

我不知道如何解决这个问题。

另一件事是，使用输入中选择的条目的结果，因为它必须显示字段“code_client”，我想显示另一个字段，其中出现字段“numero_dossier”。

所以我有这个脚本，我想用 2 个输入类型文本来填充。

例如，如果我的用户搜索 Ecf，在第一个输入类型文本中将出现 code_client '1566'，第二个输入类型文本中将出现 n_doss '110015666223'

信息像我的数据库中的模式一样注册

表:客户端 字段:

id code_client n_dosss 地址 zip_code 国家 电话 传真 gsm 电子邮件

等等。

非常感谢您提前提供的帮助。

Answer 1

为什么不使用 jQuery AJAX？它很简单并且兼容所有浏览器。

$.ajax({
    url: 'ajax/test.html',
    success: function(data) {
        $('.result').html(data);
        alert('Load was performed.');
    }
});

因此，您可以使用 jQuery 浏览正确的元素并使用函数 .html() 更新内部 HTML。希望这对您有所帮助。