2010-08-02 3 views
1

Le code suivant ne fera pas ce que j'espérais, c'est-à-dire exécuter la fonction Ajax lorsque le div = "dist" li créé par le code PHP est cliqué.Corriger la syntaxe pour faire fonctionner ma fonction Ajax

Guide s'il vous plaît.

<?php 
    // ... 
    $result = mysql_query($sql); 
    echo "<div class=\"dist\">"; 
    echo "<ul>"; 

    while ($row = mysql_fetch_array($result)) { 
     echo "<li><a href=\"devplan.php?search-n=" . $row['NAME'] . 
      "&" . rawurlencode($row['PLAN']) . "\"" . ">" . 
      $row['PLAN'] . "</a></li>"; 
    }; 

    echo "</ul>"; 
    echo "</div>"; 
?> 

<script type="text/javascript"> 
// Code to fill center panels with data 
urlquery = location.search; 
urlparts = urlquery.split('&'); 
urlplan = urlparts[1]; 

$(document).ready(function() { 
    $('.dist a').click(function() { 
     $.ajax({ 
      url: 'php/dpdetails.php?q='+urlplan, 
      success: function (data) { 
       $('#Pinfo').html(data); 
      } 
     }); 
    }); 
}); 
</script> 

Répondre

0

Voici un démarreur pour dix - J'ai corrigé quelques accolades supplémentaires et ajouté la gestion des erreurs. Si vous avez toujours une erreur, vous pourrez au moins nous dire ce que c'est.

$.ajax({ 
    url: 'php/dpdetails.php?q='+urlplan, 
    success: function (data) { 
     $('#Pinfo').html(data); 
    }, 
    error: function (xhr, ajaxOptions, thrownError) { 
     alert(xhr.status); 
     alert(thrownError); 
    } 
}); 
+0

Je vous ai ajouté du code, mais il ne génère pas d'erreur. Un peu plus d'infos, Si je change le « .dist un » juste « a » l'Ajax fonctionne si je clique sur un élément avec un point d'ancrage sur la page. Je ne semble pas reconnaître la ".dist un" généré par PHP – Scott

+0

$ ("dist a. ") Css (" couleur", "Aqua"). ... Essayez ce code et voyez s'il change la couleur des liens qui devraient être ajax-ed! Si non, pouvez-vous poster le code HTML après qu'il a été rendu par PHP? – Fenton

0

Je voudrais ajouter un fichier console.log (urlplan) juste après le gestionnaire d'événements click. assurez-vous que la valeur retournée fonctionne si vous entrez manuellement

php/dpdetails.php?q=test&anotherVar=5 

dans la barre d'adresse.

Qu'est-ce que console.log (urlplan) retour?

0

Voici un morceau exemple de code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
    <title>What</title> 
</head> 
<body> 
<?php 
$anchorList = ""; 
$rows = array(
    array(
     'NAME' => 'me1' 
    , 'PLAN' => 'thePlan1' 
    ) 
, array(
     'NAME' => 'me2' 
    , 'PLAN' => 'thePlan2' 
    ) 
); 

$anchorList .= "<div class=\"dist\">"; 
$anchorList .= "<ul>"; 

foreach ($rows as $row) { 
    $anchorList .= "<li>"; 
    $anchorList .= createAnchorTag($row['NAME'], $row['PLAN']); 
    $anchorList .= "</li>"; 
} 

$anchorList .= "</ul>"; 
$anchorList .= "</div>"; 

echo $anchorList; 

function createAnchorTag($name, $plan) { 
    return "<a href=\"devplan.php?search-n=" . $name . "&" . rawurlencode($plan) . "\"" . ">" . $plan . "</a>"; 
} 

?> 

</body> 

</html> 
<script type="text/javascript" src="../scripts/jquery-1.4.2.modified.js"></script> 

<script type="text/javascript"> 
    // Code to fill center panels with data 
    urlquery = location.search; 
    urlparts = urlquery.split('&'); 
    urlplan = urlparts[1]; 

    $(document).ready(function() { 
     $('.dist a').click(function() { 
      $.ajax({ 
       url: 'php/dpdetails.php?q=' + urlplan, 
       success: function (data) { 
        $('#Pinfo').html(data); 
       } 
      }); 

      return false; 
     }); 
    }); 
</script> 

Dans votre fonction de clic vous devez return false afin de passer outre les balises d'ancrage qui veulent rediriger.

[EDIT]

Je crois que votre recherche pour analyser réellement l'attribut href de la balise d'ancrage et le transmettre à l'Ajax, à droite? Si oui, utilisez ce script:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.dist a').click(function() { 
      var urlquery = $(this).attr('href').val(); 
      // regex would be better than split, could create a more generic function 
      var urlparts = urlquery.split('&'); 
      var urlplan = urlparts[1]; 

      $.ajax({ 
       url: 'php/dpdetails.php?q=' + urlplan, 
       success: function (data) { 
        $('#Pinfo').html(data); 
       } 
      }); 

      return false; 
     }); 
    }); 
</script> 
Questions connexes