[英]Ajax success data called twice
我不明白为什么我的数据被调用两次。 我尝试替换了append,但是不起作用。 我认为是因为我的控制器。
这是我的Ajax电话:
jQuery(document).ready(function($) {
$('#referenceProduit').change(function(){
// On recupere la valeur de l'attribut value pour afficher tel ou tel resultat
var req=$('#referenceProduit').val();
// Requête ajax, appel du fichier function.php
$.ajax({
type: "post",
url: "index.php?uc=gererReclamation&action=saisirReclamation",
data: "referenceProduit="+req,
dataType : "html",
//affichage de l'erreur en cas de problème
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest + '--' + textStatus + '--' + errorThrown);
},
// Function s'il n'y a pas de probleme
success:function(data){
//On affiche la réponse du serveur
$('.result').empty();
$('.result').prepend(data);
}
});
});
HTML代码:
<div class="form-group">
<label for="referenceProduit" class="col-sm-1 control-label">Reference</label>
<div class="col-sm-2">
<select class="form-control" name="referenceProduit" id="referenceProduit">
<option selected="selected" disabled="disabled">Choisir</option>
<?php foreach($lesProduits as $unProduit){?>
<option name="<?php echo $unProduit['id'];?>" value="<?php echo $unProduit['id'];?>"><?php echo $unProduit['reference']?></option>
<?php } ?>
</select>
</div>
<div class="result"></div>
</div>
控制者
<?php
$action = $_REQUEST['action'];
switch($action){
case 'accueil':{
include("vue/v_accueil.php");
break;
}
case 'saisirReclamation':{
$lesSites = $pdo->getLesSites();
$lesProduits = $pdo->getLesProduits();
$lesClients = $pdo->getLesClients();
$lesNatures = $pdo-> getLesNatures();
$lesActivites = $pdo->getLesActivites();
if(isset($_REQUEST['referenceProduit'])){
$leProduit = $pdo->getLeProduit();
foreach ($leProduit as $key => $value) {
echo '<input type="text" name="'.$key.'" value="'.$value.'"/>';
}
}
include_once("vue/v_saisirReclamation.php");
break;
}
}
?>
success:function(data){
// On affiche la réponse du serveur
$('.result').empty();
$('.result').prepend(data);
}
代替上面的代码,使用下面的代码
success:function(data){
// On affiche la réponse du serveur
$('.result').html(data);
}
让我们看看您的代码:
jQuery(document).ready(function($) {
$('#referenceProduit').change(function(){
//on recupere la valeur de l'attribut value pour afficher tel ou tel resultat
var req=$('#referenceProduit').val();
//requête ajax, appel du fichier function.php
$.ajax({
type: "post",
url: "index.php?uc=gererReclamation&action=saisirReclamation",
data: "referenceProduit="+req,
dataType : "html",
//affichage de l'erreur en cas de problème
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest + '--' + textStatus + '--' + errorThrown);
},
//function s'il n'y a pas de probleme
success:function(data){
//On affiche la réponse du serveur
$('.result').empty();
$('.result').prepend(data);
}
});
});
您的内容触发change
事件。 您需要确保您的响应不会触发change
。 这是使用标志的简单解决方案:
jQuery(document).ready(function($) {
var shouldChange = true;
$('#referenceProduit').change(function(){
if (!shouldChange) {
return;
}
//on recupere la valeur de l'attribut value pour afficher tel ou tel resultat
var req=$('#referenceProduit').val();
//requête ajax, appel du fichier function.php
$.ajax({
type: "post",
url: "index.php?uc=gererReclamation&action=saisirReclamation",
data: "referenceProduit="+req,
dataType : "html",
//affichage de l'erreur en cas de problème
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest + '--' + textStatus + '--' + errorThrown);
},
//function s'il n'y a pas de probleme
success:function(data){
//On affiche la réponse du serveur
shouldChange = false;
$('.result').empty();
$('.result').prepend(data);
shouldChange = true;
}
});
});
更改此行
$('.result').empty();
至
$('.result').html(' ');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.