Question

我在CakePHP控制器类中创建一个函数来处理AJAX请求。但是当我使用CakePHP函数和简单（非MVC）PHP代码时，我发现了不同的结果。我的问题是什么时候进入提交（）进程。使用CakePHP函数时，它返回空白页面。

以下是我使用的AJAX请求代码：

var userdata = {username : $("#UserUsername").val()};
        $.ajax({
            type:'POST',
            url: 'http://localhost/mycakephp/users/login',
            data: userdata,                     
            success: function(data){                                    
                if(data==0){
                    alert("empty");                 
                } else {
                    $("#UserLoginForm").submit();                       
                }
            }               
        });

但是当我将网址指向外部网站时：

url：'http：//localhost/test/test.php'

哪个 test.php 是一个处理请求的简单PHP代码，提交过程正常。

Answer 1

很抱歉，但你的代码对我来说很奇怪：你有一个登录表单，你使用ajax发送你的用户名调用Controller“UsersController”/ function“login”，当你有这个函数的答案时，那么你再次提交另一个表单（“＃UserLoginForm”）并再次发送给控制器？你发送两个表格！很可能这不是你想要的。如果我错了，请纠正我。

我想你想要的只是提交UserLoginForm并等待答案，无论它是OK还是NotOK，最后显示这个结果。

你有两个选择：使用CakePHP方式或使用JQuery自己的ajax代码。我喜欢使用两者，具体取决于我想要的用户体验。

1。 CakePHP方式

使用public $helpers = array('Js');在控制器中包含JS Helper，然后使用JsHelper中的提交在视图中创建一个Form。

视图

 <?php  
  echo $this->Form->create();
  echo $this->Form->input('username');
  echo $this->Form->input('whatever'); 

  // use the Js submit from JsHelper
  echo $this->Js->submit('Send', array(
        'url'=> array('controller' => 'users', 'action' => 'login'),
        'update' => '#update_ajax_div',
  ));
  echo $this->Form->end();
      // Next line is actually very important in order 
      //   to print the automatically created ajax code from JsHelper.
  echo $this->Js->writeBuffer();
 ?>

 <div id="update_ajax_div">
this will be overwritten after submit.
 </div>

控制器

在控制器中，表单中的所有数据都将在$this->data[]数组中发送。例如 $this->data['Users'] ，如果这是在Form-＆gt; create（）中使用的模型。

代码非常标准，除了布局，必须设置为ajax。

public function login(){

       // print the data being sent 
   $dataFromAjaxLink = $this->data[];
   $v = var_export($dataFromAjaxLink, true);
   $this->log("Ajax log:  ".$v, 'debug');

   if(isset($this->data['User'])){
       $user_name = $this->data['User']['username'];
        ...
       // do your stuff

   }
   // the answer must be ajax layout
   $this->layout = "ajax";
       // I like to use elements when using ajax, it keeps the folders clean
       //        in this example /app/View/Elements/display_ajax_result.ctp
   $this->render('/elements/display_ajax_result');

}

此元素的内容将打印在div“update_ajax_div”

中

2。纯粹的Ajax方式

第二个版本是通过在<script>标记中手动输入ajax代码来完成的。这个解决方案为您提供了更多的自由，允许您做更复杂的事情，但代码不是那么干净！

以下JQuery代码必须位于某个button / div /无论什么事件......

$(document).ready(function(){

 $(".someButton").click(function() {


      // create the json data to be sent
   var username = $(....).val();
   var dataString = ...

      // call ajax      
   $.ajax({
          type: "POST",
      // never type full paths as in your example. They are sources of errors!
      url: "<?php echo $this->Html->url(array(
            "controller" => "users", 
            "action" => "login")); ?>,
      data: dataString,
      cache: false,
      success: function(html){
             $("#update_ajax_div").html(html);
      } 
   });

 ...

控制器与CakePHP方式相同。请记住添加ajax布局。

我希望它可以帮到你。

Answer 2

根据您的评论，如果您使用SecurityComponent，则可以在登录操作上禁用POST验证。在您的UsersController中，添加：

function beforeFilter()
{
    parent :: beforeFilter();

    switch($this->request->params['action'])
    {
        case 'login':
            $this->Security->validatePost = false;
            $this->Security->csrfCheck    = false;
            break;
    }
}

但是当然你放弃了SecurityComponent在登录操作上添加的值。

CakePHP：JQuery submit（）返回一个空白页面

2 个答案:

1。 CakePHP方式

视图

控制器

2。纯粹的Ajax方式