將窗體值從精美框彈出窗口傳遞到主窗口

我目前正在使用python和Django開發一個web應用程序，並且我有一個使用fancybox jquery插件的彈出窗口。將窗體值從精美框彈出窗口傳遞到主窗口

當鏈接被點擊時，它會在我的服務器上打開一個基本上是表單的url。

我想實現的是在彈出窗口關閉後，將表單輸入的值傳遞給主頁面的功能。

我有一個有趣的感覺是不可能的，我可能會更好地使用隱藏的div（隱藏命令）而不是彈出窗口。

我的測試頁面：

<div class='link'> 
    <a class='fancy' href='create/' > click me </a> 
</div

的JavaScript大氣壓：

$(function(){ 
    $('.fancy').fancybox(
    { 
    type:'ajax', 
    afterClose: function(){ 
     alert('done!'); 
    } 
    } 
});

主要思想是彈出了其具有將被添加到Django的數據庫值的形式，但有還在主窗口上顯示這些表格。我想讓主窗口成爲創建對象的主窗口，保存並將其加載到窗體中（這是從我使用ajax的API調用中處理的）

任何幫助都會是偉大的

來源

2013-01-31 Vade

以下是一個非常簡單的pub/sub創建一個存儲的對象和更新對象並使用change事件的表單輸入頁面元素

HTML：

<!-- table, match "data-bind" to form input name --> 
<td data-bind="fname" class="subscriber">Foo</td> 
<td data-bind="lname" class="subscriber">Bar</td> 
<!-- form --> 
<input type="text" name="fname" class="data_source" />

JS：

/* declare empty object */ 
var storedData = {}; 

var $subscribers=$('.subscriber'); 
/* this event triggered when input changes*/ 
$(document).on('upDataData', function(event, key, value){ 
    storedData[key]=value; 
    $subscribers.filter('[data-bind="'+key+'"]').text(value); 
}); 


/* change handler for form inputs*/ 
$(document).on('change', 'form input.data_source', inputChange); 

function inputChange(){  
    $(document).trigger('upDataData',[ this.name, this.value]); 
} 
/* populate storedData from table elements when page loads*/ 
function createInitialData(){ 
    $subscribers.each(function(){ 
     storedData[ $(this).data('bind')]= $(this).text(); 
    }); 
} 

createInitialData()

在你的fancybox代碼

然後發送對象到服務器並解析值到形式的服務器代碼：

$('.fancy').fancybox({ 
    type:'ajax', 
    /* same as "options" for "$.ajax"*/ 
    ajax: { data : storedData}, 
    afterClose: function(){ 
     alert('done!'); 
    }  
});

DEMO：http://jsfiddle.net/xg9ML/2/

來源

2013-01-31 14:23:44 charlietfl

將窗體值從精美框彈出窗口傳遞到主窗口

回答

相關問題