Отображение сообщения в диалоговом окне с использованием AJAX, jQuery и CakePHP

Question

У меня есть форма, и когда пользователи отправляют эту форму, она должна передать данные в функцию, используя AJAX.Затем результат этого отображается для пользователя в диалоговом окне.Я использую CakePHP (1.3) и jQuery, чтобы попытаться сделать это, но мне кажется, что я бегу в землю.

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

Форма:

<?php                                                                                                                                                                                                                                                                             
  echo $this->Form->create('Image', array('type' => 'file', 'controller' => 'images', 
                           'action' =>   'upload', 'method' => 'post'));
  echo $this->Form->input('Wallpaper', array('type' => 'file'));
  echo $this->Form->input('Tags');
  echo $this->Form->end('Upload!');
?>

AJAX:

$(document).ready(function() {
  $("#ImageUploadForm").submit(function() {                                                                                                                                                                                                                                   
    $.ajax({
      type: "POST", url: "/images/upload/",
      data: $(this).serialize(),
      async: false,
      success: function(html){
        $("#dialog-modal").dialog({
          $("#dialog-modal").append("<p>"+html+"</p>");
          height: 140,
          modal: true,
          buttons: {
            Ok: function() {
              $(this).dialog('close');
            }
          }
        })
      }
    });
    return false;
  });
});

ПРИМЕЧАНИЕ: если я поставлю $("#dialog-modal").dialog({ height: 140, modal: true });ВНЕ $.ajax, но внутри $("#ImageUploadForm").submit(function() { и закомментируйте материал $.ajax, Я УВИДЮ, что появится диалоговое окно, а затем я должен щелкнуть по нему, чтобы оно исчезло.После этого он не будет перенаправлять в местоположение /images/upload/

Метод, который вызывает AJAX:

  public function upload()
  {
    $this->autoRender = false;

    if ($this->RequestHandler->isAjax())
    {   
      echo 'Hi!';
      exit();
    }   
  }

$ this-> RequestHandler-> isAjax (), по-видимому, ничего не делаетили всегда возвращается false.Я никогда не вводил оператор if с этим условием.

Спасибо за помощь, если вам нужна дополнительная информация, дайте мне знать.

Answer 1

Попробуйте:

$(document).ready(function(){
 $.ajax({
  type: "POST", url: "/images/upload/",
  data: $(this).serialize(),
  async: false,
  success: function(html){
    //First you must append to div:
$("#dialog-modal").append("<p>"+html+"</p>");
    $("#dialog-modal").dialog({         
      height: 140,
      modal: true,
      buttons: {
        Ok: function() {
          $(this).dialog('close');
        }
      }
    }); //dialog
  }//success
});//ajax

Обратите внимание на первое предложение:

 $("#dialog-modal").append("<p>"+html+"</p>");

это не может быть собственностью.Вы должны передать объект в качестве параметра функции dialog (), чтобы свойства или член объекта выглядели следующим образом:

 {
 height:140,
 buttons:{},
 anotherPropertie: 'value'
 }

Если вы вызываете функцию dialog () после ajax (), диалоговое окно будет пустымпотому что будет выполняться перед функцией success (), объявленной внутри ajax ().