ThinkPHP Ajax for JQuery-CFANZ编程社区

ThinkPHP Ajax for JQuery
A:
-------------------------------
1. html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>留言板</title>
  <load href="__PUBLIC__/css/site.css"/>
  <load href="__PUBLIC__/js/jquery-1.3.2.js"/>
  <load href="__PUBLIC__/js/jquery.form.js"/>
  <load href="__PUBLIC__/js/ajaxText.js"/>
</head>
<body>
  <div>
    <form id="myForm" action="" method="post">
      <p>
        Title:<input type="text" name="title" id="title" maxlength="20" value="%a%">
      </p>
      <p>
        <input type="button" name="submit" value="Call Ajax" onclick="callAjax('__URL__/checkName')">
      </p>
    </form>
  </div>
  <div id="fromServerdiv"></div>
</body>
</html>

ajaxText.js:

-----------------------------------

callAjax = function(url){
/*    
   $.post(url, { 'username': $('#username').val() }, function(obj,status){
        alert(obj.data);
      alert(obj.info);
      alert(status);
      $("#fromServerdiv").html(obj.info);
    }, 'json');

    或者*/
    $.ajax({
       type: "POST",
       url: url,
       data:   "name=John&location=Boston",
       dataType: 'json',
       success: function(obj){
          alert( "Data Saved: " + obj.data ); 
          alert( "Data Saved: " + obj.info );
        } 

   })
}

AjaxAction.class.php

--------------------

public function checkName(){
        header("Content-type:text/html; charset=utf-8");
        $this->ajaxReturn("abc","测试数据A",'用户名正确~',0);
    }

HTML

---------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>留言板</title>
  <load href="__PUBLIC__/css/site.css"/>
  <load href="__PUBLIC__/js/jquery-1.3.2.js"/>
  <load href="__PUBLIC__/js/jquery.form.js"/>
  <load href="__PUBLIC__/js/ajaxText.js"/>
</head>
<body>
  <div>
    <form id="myForm" action="__URL__/fromAjaxServer" method="post">
      <p>
        Title:<input type="text" name="title" id="title" maxlength="20" value="%a%">
      </p>
      <p>
        <input type="submit" name="submit" value="Submit Ajax">
      </p>
    </form>
  </div>
  <div id="fromServerdiv"></div>
</body>
</html>

JS:

-----------------------

checkForm = function(){
    alert("checkForm");
}
complete = function(obj,status){
    alert(obj.data);
    alert(obj.info);
    alert(status);
    $("#fromServerdiv").html(obj.info);
}

$(document).ready(function(){
    $('#myForm').ajaxForm({
        beforeSubmit: checkForm, // pre-submit callback
        success: complete, // post-submit callback
        dataType: 'json'
    });
})

Action:

--------------------

public function fromAjaxServer(){
        header("Content-type:text/html; charset=utf-8");
        $this->ajaxReturn("abc","测试数据B",'用户名正确~',0);
    }