Параметры jquery.ui.dialog не устанавливаются - PullRequest
Новая
       6

Параметры jquery.ui.dialog не устанавливаются

1 голос
/ 04 февраля 2011

Я не могу понять, как получить параметры для перетаскивания и изменения размера для jquery.ui.dialog. У меня есть файл JS, который вызывается с главной страницы:

/ JS / проката / add.js: 

var additempopup = null;     
$(document).ready(function() {
        var $dialog = $('#adddialog').load('additem')
            .dialog({
                autoOpen: false,
                title: 'Add Item',
                width: 'auto',
                position: 'center', 
                resizeable: true,
                modal: true,
                draggable: true,
                closeOnEscape: true,
                closeText: 'close'
            });

        $('.jsAddItemPopup').click(function() {

            $dialog.dialog('open');
            return false;
        });
        $('#modalclose').click(function() {
            $dialog.dialog('close');
            return false;
        });
        additempopup = $dialog;
     } );

Вызывается с главной страницы, которая представляет собой торт CakePHP.

выдержка из /views/rentals/add.ctp:

<?php
    $javascript->link('jquery/js/jquery-1.4.4.min', false);
    $javascript->link('jquery/ui/jquery.ui.core', false);
    $javascript->link('jquery/ui/jquery.ui.widget', false);
    $javascript->link('jquery/ui/jquery.ui.dialog', false);
    $javascript->link('jquery/rentals/add.js', false);
       echo $html->css('ui-lightness/jquery-ui-1.8.9.custom');

?>
<?php
echo $html->link(
'Add Item', '#', array('title' => 'Add Item', 'class' => 'jsAddItemPopup'));
?>
<div id="adddialog" class="adddialog" style="display: none;"></div>

всплывающее окно загружает следующий вид.

выдержка из /views/rentals/additem.ctp:

  <div id='ajax-content'>
<?php   
 echo $ajax->form('edit', 'post', array(
                        'model'    => 'RentalLineitem',
                        'url'      => array( 'controller' => 'rentals', 'action' => 'additem')
));   ?>

<table>

    <tr>
        <td style="text-align: left;">
             <?php  echo $this->Form->submit('Cancel', 
                array('name' => 'cancel', 
               'onclick' => "additempopup.dialog('close'); return false;")); ?>
        </td>
        <td style="text-align: right;">
             <?php  echo $this->Form->submit('Add Item', array('name' => 'Save')); ?>
        </td>
    </tr>
    </table>

    <?php   echo $this->Form->end();   ?>
    </div>

Все работает, ссылка «Добавить элемент» вызывает модальное диалоговое окно, «Отмена» в модальном диалоговом окне закрывает окно, «Добавить элемент» вызывает корректное возвращение сообщения Ajax, но оно всплывает в правом верхнем углу экран, а не в центре, а перетаскивание и изменение размера не работает. и я немного расстраиваюсь, пытаясь заставить это работать. Я некоторое время пытался бездельничать, но безрезультатно.

ОБНОВЛЕНИЕ: Согласно предложенному решению, мне не хватало зависимостей, я добавил их на главную страницу /view/rentals/add.ctp:

<?php
    $javascript->link('jquery/js/jquery-1.4.4.min', false);
    $javascript->link('jquery/ui/jquery.ui.core', false);
    $javascript->link('jquery/ui/jquery.ui.widget', false);
    $javascript->link('jquery/ui/jquery.ui.mouse', false);
    $javascript->link('jquery/ui/jquery.ui.draggable', false);
    $javascript->link('jquery/ui/jquery.ui.resizable', false);
    $javascript->link('jquery/ui/jquery.ui.position', false);
    $javascript->link('jquery/ui/jquery.ui.dialog', false);
    $javascript->link('jquery/rentals/add.js', false);
       echo $html->css('ui-lightness/jquery-ui-1.8.9.custom');

?>

Ответы [ 2 ]

2 голосов
/ 04 февраля 2011

Вероятно, вам не хватает зависимостей ui.mouse, ui.draggable и ui.resizeable.http://jqueryui.com/demos/dialog/

0 голосов
/ 04 февраля 2011

В приведенном выше примере вы пишете resizable неправильно.Бросьте e перед able

...