Comment transmettre des données à JQuery AJAX dans CAKEPHP

Question

J'apprends à utiliser JQuery pour vérifier la disponibilité des données.
Pour commencer, j'ai écrit quelques lignes de codes en utilisant cakePHP.

J'ai écrit une fonction dans un contrôleur pour le contrôle de la saisie des données,
et l'URL est comme ceci: http://www.mywebsite.com/controllers/action/avariable
je tentais de passer la valeur dans un champ de texte d'entrée en utilisant l'JQuery Ajax à l'URL ci-dessus,
mais je ne sais pas pourquoi cela ne fonctionne pas en passant une variable à l'action du contrôleur.
Pourriez-vous m'aider s'il vous plait?

<Script language="javascript"> 
//<!-- 
$(document).ready(function(){ 
$(document).change(function() { 
var usr = $("#data\\[User\\]\\[name\\]").val(); 
if(usr.length >= 3){ 
$("#username").append('<span><img align="absmiddle" src="loader.gif" />Checking</span>'); 

$.ajax({ 
type: "POST", 
url: "http://www.mywebsite.com/controllers/action/", 
data: usr, 
success: function(msg){ 

    if(msg == 'OK') 
    { 
    $("#username").append('<span><img align="absmiddle" src="accepted.png"/></span>'); 
     } 
    else 
    { 
    $("#username").append('<span>'+msg+'</span>'); 
    } 
     } 
    }); 
     } 
else 
{ 
$("#username").append('<span>The username should have at least 3 characters.</span>'); 
} 

}); 
}); 
//--> 
</Script> 

<form name="adduser" id="adduser" method="post" action="/controllers/action2"> 
<table border=0 width="100%"> 
<tr> 
<td>Username</td> 
<td>  
     <div id="username"> 
<input type=text name="data[User][name]" id="data[User][name]"> 
</div>  
     </td> 
</tr> 
<tr> 
<td> 
<input type="submit" value="Send"> 
</td> 
</tr> 
</table> 
</form> 

Voici le code de l'action:

function action($uname=null){ 
       $result2=$this->__avail($uname);   
        if($result2==1) 
        {return "OK";} 
        else 
        {return "NOT";}   
      } 

Answer 1

bien pour que vous assignons un événement de changement à l'objet du document qui ne va rien faire. Ce que vous voulez sans doute est:

(function($) { 
    var timeout; 
    var $user = $("#data\\[User\\]\\[name\\]").bind("keyup keydown keypress", function() { 
     window.clearTimeout(timeout); 
     // Give it a delay since the end user is probably still typing 
     timeout = setTimeout(function() { 
      ... your ajax logic and length check ... 
      ... can use $user here to access the textfield ... 
     }, 500); 
    }); 
)(jQuery); 

Answer 2

Pourquoi ne pas utiliser le compliment Data- * attributs HTML

<Script language="javascript"> 
//<!-- 
$(document).ready(function(){ 
    $('input[rel*=ajax_check]').change(function(){ 
    if(this.val().lengh > 4) 
    { 
     var action = $(this).attr('data-action'); 
     $(this).parent().append('<span><img align="absmiddle" src="loader.gif" />Checking</span>'); 
     $.ajax({ 
      type: "POST", 
      url: "http://www.mywebsite.com/controllers/" + action, 
      data: $(this).val(), 
      success : function(return) 
      { 
      if(return.toLower() == 'ok') 
      { 
       $("#username").append('<span><img align="absmiddle" src="accepted.png"/></span>'); 
      }else 
      { 
       $("#username").append('<span>'+retrun+'</span>'); 
      } 
      } 
     }) 
    } 
    }) 
}); 
//--> 
</Script> 

<form name="adduser" id="adduser" method="post" action="/controllers/action2"> 
<table border=0 width="100%"> 
<tr> 
    <td>Username</td> 
    <td>  
     <div id="username"> 
    <input type=text name="data[User][name]" data-action="action" rel="ajax_check"> 
    </div>  
     </td> 
</tr> 
<tr> 
    <td> 
    <input type="submit" value="Send"> 
    </td> 
</tr> 
</table> 
</form> 

avis que j'ai ajouté à l'attribut data action l'action de ce qui doit être vérifier Par exemple, si l'action était un nom d'utilisateur, changez simplement cela en nom d'utilisateur.

En outre, tout élément que vous souhaitez vérifier dynamiquement avec ajax suffit d'ajouter l'action de données et de rel à l'entrée.

Espérons que cela aide