Как выполнить запрос jquery ajax в CakePHP? - PullRequest
Новая
       4

Как выполнить запрос jquery ajax в CakePHP?

2 голосов
/ 24 июля 2011

Я пытаюсь использовать Ajax в CakePHP, и никуда не денусь!

У меня есть страница с серией кнопок - нажатие одной из них должно отобразить определенный контент на текущей странице. Важно, чтобы страница не перезагружалась, потому что будет отображаться фильм, и я не хочу, чтобы фильм сбрасывался.

Есть несколько разных кнопок с различным содержанием для каждой; этот контент потенциально довольно большой, поэтому я не хочу загружать его, пока он не понадобится.

Обычно я делал бы это через jQuery, но я не могу заставить его работать в CakePHP.

Пока у меня есть:

На виде, кнопка управления выглядит следующим образом: 

$this->Html->link($this->Html->image('FilmViewer/notes_link.png', array('alt' =>  __('LinkNotes', true), 'onclick' => 'showNotebook("filmNotebook");')), array(), array('escape' => false));

Под этим есть div, называемый filmNotebook, где я хотел бы показать новый контент.

В моем файле functions.js (в webroot / scripts) у меня есть эта функция: 

function showNotebook(divId) {
 // Find div to load content to
 var bookDiv = document.getElementById(divId);
 if(!bookDiv) return false;
 $.ajax({ 
   url: "ajax/getgrammar",
   type: "POST",
   success: function(data) {
    bookDiv.innerHTML = data;
   }
  });
 return true;
}

Для генерации простого содержимого, которое будет показано в div, я установил следующее в route.php: 

 Router::connect('/ajax/getgrammar', array('controller' => 'films', 'action' => 'getgrammar'));

В films_controller.php функция getgrammar имеет вид: 

  function getgrammar() {
   $this->layout = 'ajax';
   $this->render('ajax');
  }

Файл макета просто имеет:

и в настоящее время ajax.ctp вида просто: 

<div id="grammarBook">
 Here's the result
</div>

Проблема в том, что когда я нажимаю кнопку, я получаю макет по умолчанию (так, как будто страница появляется на моей странице) с индексной страницей фильмов в ней. Это как если бы оно не находило правильное действие в films_controller.php

Я сделал все, что было предложено в руководстве CakePHP (http://book.cakephp.org/view/1594/Using-a-specific-Javascript-engine).

Что я делаю не так? Я открыт для предложений о лучших способах сделать это, но я также хотел бы знать, как должен работать Ajax, для дальнейшего использования.

Спасибо за любую помощь, которую может предложить каждый.

Ответы [ 3 ]

2 голосов
/ 24 июля 2011

все, что вы показываете, выглядит нормально.Дважды проверьте, что есть макет ajax, потому что, если его там нет, будет использован макет по умолчанию.Используйте Firebug и функцию log в торт, чтобы проверить, все ли идет по плану.

Еще несколько советов: зачем вам POST для «ajax / getgrammar», а затем перенаправить его на «films / getgrammar»?И затем сделать представление ajax.ctp?Это кажется излишним для меня.Вы можете сделать вызов ajax для «films / getgrammar», и вам не нужно правило Router.Вы можете изменить ajax.ctp на getgrammar.ctp, и вам не понадобится $this->render('ajax');

0 голосов
/ 04 мая 2017

Это функция, которую я использую для отправки форм в cakephp 3.x, она использует приятные оповещения, но ее можно изменить на обычное оповещение.Это очень переменная, просто поместите действие в ваш контроллер, чтобы поймать отправку формы.Также перезагрузка местоположения перезагрузит данные, чтобы дать пользователю немедленную обратную связь.Это можно убрать. 

$('#myForm').submit(function(e) {
    // Catch form submit
    e.preventDefault();

    $form = $(this);
    // console.log($form);
    // Get form data
    $form_data = $form.serialize();
    $form_action = $form.attr('action') + '.json';
    // Do ajax post to cake add function instead
    $.ajax({
        type   : "PUT",
        url    : $form_action,
        data   : $form_data,
        success: function(data) {
            swal({
                title: "Updated!", 
                text: "Your entity was updated successfully", 
                type: "success"
            },
            function(){
                    location.reload(true);
            });
        }
    });
});
0 голосов
/ 16 декабря 2013

это вызов ajax 

$(function() {
    $( "#element", this ).keyup(function( event ) {
        if( $(this).val().length >= 4 ) {
            $.ajax({                   
                url: '/clients/index/' + escape( $(this).val() ),
                cache: false,
                type: 'GET',
                dataType: 'HTML',
                success: function (clients) {
                    $('#clients').html(clients);
                }
            });
        }
    });
});

Это действие называется ajax 

public function index($searchterm=NULL) {

if ( $this->RequestHandler->isAjax() ) {

        $clients=$this->Client->find('list', array(
            'conditions'=>array('LOWER(Client.lname) LIKE \''.$searchterm.'%\''),
            'limit'=>500
        ));

        $this->set('clients', $clients);
}

}

...