Правильно отправлять входные значения из главного окна в fancybox iframe - PullRequest
Новая
       15

Правильно отправлять входные значения из главного окна в fancybox iframe

1 голос
/ 12 января 2011

Мне было интересно, может ли кто-нибудь мне помочь. Я сделал простой Плагин для Wordpress с использованием PHP. Это галерея, которая позволяет пользователю добавить подписи и настраиваемые поля для изображений .. Формы отображается с помощью Fancybox, который открывается нажатием кнопки ввода кнопки ...

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

$(".edit").click(function() {
    var formData = $(this).closest('form').serializeArray();
    formData.push({ name: this.name, value: this.value }); //this is
to get the submit-buttons value

    $.fancybox.showActivity();

    $.ajax({
        type        : "POST",
        cache       : false,
        url         : "<?php echo plugins_url(); ?>/upload/
editImageForm.php",
        data        : formData,
        success: function(data) {
            $.fancybox(data);
        }
    });
    return false;

});

Так как форме редактирования требуется imageID для редактирования нужного изображения, информацию, которую я сейчас отправляю через скрытое поле.

Моя проблема в том, что я хочу, чтобы форма редактирования отображалась внутри Iframe, так что при отправке формы редактирования страницы формы действия появляется внутри фрейма. В настоящее время страница формы действия загружается в Главное окно .. и выход из админ-области WordPress .. Как использовать iframe для формы редактирования и как отправить входные значения из формы в главном окне, в fancybox-iframe (с формой редактирования внутри)

HTML-код для формы, которая открывает fancybox, выглядит следующим образом, он отображается рядом с каждым изображением на странице обзора: 

<form method='post' action='' class="imageform">
    <input type='submit' value='Edit' name='edit' class="edit imageButton" />
    <input type='submit' value='Delete' name='delete' class="delete imageButton" onClick="return delete('<?php echo $image->name; ?>', '<?php echo $image->id; ?>')"/>
    <input name='imageID' type='hidden' value='<?php echo $image->id; ?>' class="imageID" />
    <input name='imageNavn' type='hidden' value='<?php echo $image->name; ?>' class="imageNavn" />
</form>

(Функция удаления на кнопке удаления отображает только окно подтверждения в javascript, спрашивая, уверен ли пользователь, что хочет удалить изображение ..)

Форма добавления изображения немного проще работает как надо, и iframe отображается правильно: 

$("#upload").click(function() {
    $.fancybox.showActivity();

    $.fancybox({
        'type'              : 'iframe',
        'width'             : '50%',
        'height'            : '75%',
        'href'              : '<?php echo plugins_url(); ?>/upload/
addImage.php'
    });

});

Надеюсь, вы понимаете мою проблему и сможете мне помочь;)

Заранее спасибо!

Ответы [ 2 ]

1 голос
/ 08 марта 2011

Похоже, нет способа задать имя создаваемого iframe.

Вот код, который генерирует iframe fancybox, и, как видно, требуется всего лишь текущее время, чтобы сделать созданные iframe уникальными. 

case 'iframe' :
    $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + 
      '" frameborder="0" hspace="0" scrolling="' + selectedOpts.scrolling + 
      '" src="' + selectedOpts.href + '"></iframe>').appendTo(tmp);

Мне нужно написать патч (возможно, тривиальный) в fancybox, чтобы наша система поддерживала это. Надеюсь, что кто-то сделает то же самое с главной строкой fancybox.

Мне нужна была эта функция, потому что я выполняю загрузку файлов в fancybox, а в среде тестирования Selenium необходимо знать имя iframe, чтобы можно было перемещаться в окно и автоматически вводить данные теста.

0 голосов
/ 12 января 2011

Избегайте использования iframe, потому что это не проблема (...), поэтому вместо этого просто используйте ajax, и json, если возможно, может получить лучший результат.

почему?

  1. iframes могут быть отключены некоторыми пользователями
  2. может быть трудно работать с кросс-браузером
  3. будет тратить много времени на переключение назад и вперед при отладке или разработке.

если вам абсолютно необходимо хорошо работать с iframe $('iframe').attr('src',url); изменит URL-адрес iframe.Другой способ - использовать <a target="frame_name">, когда <iframe name="frame_name">

Тогда на самом iframe вам нужно использовать top.window или window.top, не слишком уверенный :), но он получает самое верхнее окно в DOM и используетself.window для ссылки на сам iframe.

надеюсь, что это как-то поможет

...