2011-03-02 68 views
0

我用它在這裏演示了儀表板插件開始 - http://www.gxdeveloperweb.com/dashboardplugin/demo/dashboard.html的jQuery插件儀表板 - 如何保存狀態變化

我與文檔掙扎。主要介紹如何保存由最終用戶更改的儀表板配置。

在本文檔中,它會告訴你如何做一個「dashboardStateChange」:

dashboard.element.trigger("dashboardStateChange",{"stateChange":"widgetAdded","widget":widget}); 

但我真的不明白的地方,這是在儀表板上設置中去,以及如何使用它來保存變化。我想我可以在發生某些事情時從DOM內部訪問dashboardStateChange,但即使不理解如何完成。

有沒有人在保存儀表板狀態發生變化時有任何提示?我希望它能與保存儀表板設置的php腳本進行交流。

不幸的是,在這類功能上沒有任何優秀的教程。

謝謝!

+0

你有沒有在這方面取得進展? – 2011-09-15 19:05:06

回答

1

我不知道這個問題是否仍然有趣,但我一直在使用這個插件很長一段時間,它實際上很容易使用。 幾乎所有的答案都可以在插件自帶的例子中找到,爲了解決您的問題,您可能需要查看以下用於使儀表板的當前佈局在服務器上保持不變的示例代碼。

請注意,「saveID」是保存按鈕的ID,「saveConfiguration」是將佈局保存在服務器上的URL。

// binding for saving the current configuration 
$("#saveID").bind("click", function() { 
    var conf = $.parseJSON(dashboard.serialize()), 
     // get the serialized configuration 
     len = conf.data.length, 
     // generate the new parameter to submit 
     para = "lay=" + conf.layout + "&len=" + len, 
     i = 0; 
    for (i = 0; i < len; i += 1) { 
     para = para + "&pid" + i + "=" + conf.data[i].id + "&col" + i + "=" + conf.data[i].column; 
    } 

    // Invoke the "saveConfiguration" on the server via AJAX 
    $.ajax({ 
     url: "saveConfiguration", 
     data: para, 
     dataType: "json", 
     success: function (jsonResponse) { 
      if (jsonResponse.valid === true) { 
       alert("Configuration has been saved"); 
      } else { 
       alert("Error when trying to save the configuration\n" + jsonResponse.error); 
      } 
     }, 
     error: function (jqXHR, textStatus, errorThrown) { 
      alert(textStatus + " - " + errorThrown); 
     } 
    }); 
    return false; 
}); 
0

您可以使用內置儀表板功能保存快速&容易。你在哪裏初始化儀表盤的頁面,把這個initDashboard()功能之後,但在dashboard.init()前:

$("#savebutton_id").bind("click", function() { 
    dashboard.element.trigger("dashboardStateChange",{"stateChange":"widgetMoved","widget":"w"}); 
    alert("Saved"); 
}); 

然後在你的HTML代碼把一個按鈕或鏈接id爲savebutton_id地方。當您點擊它時,儀表板會將串行配置發送到您的預定義stateChangeUrl