Размещать данные в Colorbox iframe?

Question

Вот код, с которым я работаю.Из других примеров, которые я видел, это должно работать, но это не так.И уже убедились, что я использую последнюю версию colorbox.

function updateFolderCate(ID,Type){
    $.colorbox({
        iframe:true,
        scrolling: false,
        innerWidth:'100',
        innerHeight:'100',
        href:"page.php",
        data:{LinkID:ID,itemType:Type},
        onClosed:function(){
            //Do something on close.
        }
    });
}

Answer 1

Вы устанавливаете для iframe значение true.То, что это делает, открывает colorbox, создает iframe и устанавливает атрибут src iframe в местоположение, указанное в href.Так что логически это не может делать запросы POST.Это может выполнить то, что вы хотите, но я не уверен.

function updateFolderCate(ID,Type){
    $.colorbox({
        open: true,
        scrolling: false,
        innerWidth:'100',
        innerHeight:'100',
        href:"page.php",
        data:{LinkID:ID,itemType:Type},
        onClosed:function(){
            //Do something on close.
        }
    });
}

Это не будет вести себя точно так же, как метод iframe, возможно, вам придется переделать конечную точку.Если ваша конечная точка НЕ ​​ДОЛЖНА принимать только POST-запросы, тогда ответьте на ответ earlonrails.

РЕДАКТИРОВАТЬ: я пришел к этому после погружения исходного кода: Source

Соответствующие строки - строка 800 и строка 856. iframe и href не совместимы, поэтому я проверил элемент, который был загружен в Firebug, и заметил, что это был iframe с атрибутом src, установленным в переменную href.

Answer 2

В нем говорится: «.load (url [, data] [, complete (responseText, textStatus, XMLHttpRequest)]) urlA строка, содержащая URL, на который отправляется запрос. DataA map или строка, отправляемая на серверс запросом. "

И у вас есть объект href, но я не думаю, что они используются вместе в этом случае.Чтобы использовать .load или в этом случае данные, я думаю, вам нужно будет указать URL.Я думаю, что любой из этих способов мог бы работать.

   function updateFolderCate(ID,Type){
        $.colorbox({
            iframe:true,
            scrolling: false,
            innerWidth:'100',
            innerHeight:'100',
            href:"page.php?LinkID=" + ID + "&itemType=" + Type,
            // or data : { "page.php", { LinkID:ID,itemType:Type } } 
            onClosed:function(){
                //Do something on close.
            }
        });
    }

http://www.codingforums.com/showthread.php?t=158713

http://api.jquery.com/load/

Answer 3

Вы можете открыть пустую страницу в iframe, которая получает данные с верхней страницы и публикует сообщения сама по себе так:

var postData = window.top.getDataToPost()
$.post(postUrl,postData)

На странице, которая открывает colorbox, создайте функцию для предоставления значения

function getDataToPost() {
   return { param1 = value1 }
}

Answer 4

Я решил эту проблему, переместив цветовое окно в about: blank, а затем в обратном вызове onComplete отрисовал форму со скрытыми полями, которая передается с данными POST.Отлично работает для этой цели.

function createFormInputsFromObject(data, prefix) {
  prefix = prefix || '';
  var inputs = '';

  jQuery.each(data, function(name, value){
    if (prefix !== '') name = prefix + '[' + name + ']';
    if (Array.isArray(value) || value instanceof Object) {
      inputs += createFormInputsFromObject(value, name);
    }
    else {
      inputs += jQuery('<input>').attr({type: 'hidden', name: name, value: value}).prop('outerHTML');
    }
  });

  return inputs;
}

function showPdf(url, postData) {
  jQuery.colorbox({
    iframe: true,
    href: 'about:blank',
    width: '90%',
    height: '90%',
    onComplete: function() {
      var iframe = jQuery('#cboxLoadedContent iframe');
      var form = jQuery('<form>').attr({action: url, method: 'POST', target: iframe.attr('name')});
      if (!jQuery.isEmptyObject(postData)) {
        jQuery(createFormInputsFromObject(postData)).appendTo(form);
      }
      form.appendTo(iframe)
          .submit()
          .remove();
    }
  });
}


showPdf('/source/url', {sitName: 'sitka', items: [2, 4, 5, 6], extended: {i1: [10, 20], i2: {a: 0, b:1}}});

Answer 5

В вашем примере кода data - это объект.В данном случае он создается с помощью буквального синтаксиса объекта.

Что именно происходит?

1. В каких браузерах (включая номер версии) вы его пробовали?

2. Какую версию jQuery вы используете?

3. Вы получаете какие-либо ошибки в консоли?

4. Вы просматривали запрос на вкладке сети Firebug (или других инструментов разработчика / Fiddler / и т. Д.), Чтобы точно узнать, что находится в запросе (например, метод запроса) и ответ сервера?

5. Вы пытались запросить напрямую, используя jQuery.load(), чтобы увидеть, что происходит?