0

我尝试在面板的南部区域制作一个带有一个主网格和子网格的 Netzke 组件。When a row in the maingrid is selected then should the subgrids be filtered with records related to the record in maingrid - like described here for an old netzke version:

https://groups.google.com/forum/#!searchin/netzke/tabpanel/netzke/PFAQ-wYyNog/2RJgRLzh80oJ

我知道 netzke 没有进一步开发，但我在项目中使用它。

  • 红宝石 2.1.2 (Mac OSX rbenv)

  • 导轨 4.0.10

  • netzke-core v0.10.1

  • netzke-basepack v0.10.1

这是我的代码：

楷模：

class MbOrganisation < ActiveRecord::Base

  has_many :mb_contacts

  def customer_name
    "#{orga_customer} - #{orga_name1}"
  end

end



class MbContact < ActiveRecord::Base

   belongs_to :mb_organisation

end

这是中心组件 app/components/organisation_multitab.rb

class OrganisationMultitab < Netzke::Base

  component :organisation_organisations

  component :organisation_tabpanel do |c|
    c.klass = MblixBaseTabpanel
    c.items = [:organisation_contacts]
  end

  js_configure do |c|
    c.layout = :border
    c.border = false

    c.init_component = <<-JS
      function(){
        // calling superclass's initComponent
        this.callParent();

        // setting the 'rowclick' event
        var view = this.netzkeGetComponent('organisation_organisations').getView();
        view.on('itemclick', function(view, record){
            // The beauty of using Ext.Direct: calling 3 endpoints in a row, which results in a single call to the server!
          this.selectItem({item_id: record.get('id')});
        }, this);
      }
    JS

  end

  def configure(c)
    super
    c.items = [
        { items: [:organisation_organisations], region: :center },
        { items: [:organisation_tabpanel], region: :south, height: 200, split: true }
]
  end

  endpoint :select_item do |params, this|
   # store selected id in the session for this component's instance
    component_session[:selected_item_id] = params[:item_id]
  end

end

这些组件额外使用 Maingrid - organization_organisations.rb

class OrganisationOrganisations < Netzke::Basepack::Grid

  def configure(c)
    super
    c.model = "MbOrganisation"
    c.columns = [:orga_customer, :orga_name1, :orga_name2, :orga_street, :orga_zip, :orga_city, :orga_tel, :orga_email]
    c.force_fit = true
  end
end

带有 Tabpanel-base_tabpanel.rb 的组件：

class BaseTabpanel < Netzke::Basepack::TabPanel

  component :organisation_contacts do |c|
    c.data_store = {auto_load: false}
    c.scope = {:mb_organisation_id => component_session[:selected_item_id]}
    c.strong_default_attrs = {:mb_organisation_id => component_session[:selected_item_id]}
  end

  def configure(c)
    super
    c.active_tab = 0
    c.prevent_header = true
  end

end

联系人的网格组件：

class OrganisationContacts < Netzke::Basepack::Grid

  def configure(c)
    super
    c.model = "MbContact"
    c.columns = [{ :name => :mb_organisation__customer_name,
                   :header => "Organisation"
                 }, :cont_salutation, :cont_title, :cont_lastname, :cont_firstname, :cont_email, :cont_tel, :cont_mobile, :cont_birthday]
    c.force_fit = true
  end

end

该函数this.selectItem(...)被正确触发并调用 OrganisationMultitab 中的端点。

我有两个问题/疑问

首先 - 如何在选项卡面板中自动重新加载子网格的存储？

链接的谷歌群组文章中描述的方式：https : //groups.google.com/forum/#!searchin/netzke/tabpanel/netzke/PFAQ-wYyNog/2RJgRLzh80oJ 已过时（适用于 netzke v0.5 - 我使用 netzke v0.10.1):

{
        :south => {

          :item0 => {:load_store_data => aggregatee_instance(:south__item0).get_data},
          :item1 => {:load_store_data => aggregatee_instance(:south__item1).get_data}
        }
}

第二个问题：我收到一个错误 - 当我手动刷新子网格时：

ActiveModel::ForbiddenAttributesError in NetzkeController#direct

更新

由ActiveModel::ForbiddenAttributesError我自己解决。netzke-basepack gem 中有一个错误：

Netzke::Basepack::Grid当组件（如上所述）配置了范围时，在 ActiveModel::ForbiddenAttributesError（rails 4 个强参数）中运行。（config[:scope] 稍后将被合并到作为 ActionController::Parameters 对象的 params 对象。 - 由于范围与数据库相关，这将被拒绝ActiveModel::ForbiddenAttributesError） 我的解决方案：在endpoint.rbActionController::Parameters 中将被转换为一个哈希 - 然后错误就消失了。

我在 github 中为这个 gem 做了一个 fork 和一个 pull request。

但

第二个问题没有解决。

第二个问题：现在可以手动刷新子网格而不会出错，但它们始终为空。

我猜子组件中的范围

  component :organisation_contacts do |c|
    c.data_store = {auto_load: false}
    c.scope = {:mb_organisation_id => component_session[:selected_item_id]}
    c. strong_default_attrs = {:mb_organisation_id => component_session[:selected_item_id]}
  end

无法访问的值

component_session[:selected_item_id]

组织 MultiTab 父组件？

但有必要拆分组件 - 如此处所述：https ://groups.google.com/forum/#!searchin/netzke/tabpanel/netzke/sDrU7NZIlqg/-2wGmed7fjcJ

希望有人可以帮助我。:-)

谢谢

此致

4

2 回答 2

0

所以我自己找到了解决方案。

第一个问题 -在选项卡中重新加载网格

Ext 网格组件的存储也可以在 Javascript 中访问。所以我用这部分扩展了 OrganisationMulitab 的 Javascript 配置：

Ext.each(this.netzkeGetComponent('organisation_tabpanel').items.items, function(item, index) {
     item.getStore().load();
});

第二个问题 -将选定的 id 发送到子组件中的范围

该值必须发送到子组件的会话 - 所以这可以完成工作：

 component_instance(:organisation_tabpanel).component_session[:selected_item_id] = params[:item_id]

代替

component_session[:selected_item_id] = params[:item_id]

（问题ActiveModel::ForbiddenAttributesError是 gem 中的一个错误 - 解决方案在我对问题的更新中 - 我制作了 gem 的一个分支https://github.com/tomg65/netzke-basepack/tree/master-fixes-changes和向原始https://github.com/netzke/netzke-basepack/pull/158发送拉取请求）

所以最终的代码看起来像这样，一切正常：

class OrganisationMultitab < Netzke::Base

  component :organisation_organisations

  component :organisation_tabpanel do |c|
    c.klass = MblixBaseTabpanel
    c.items = [:organisation_contacts]
  end

  js_configure do |c|
    c.layout = :border
    c.border = false

    c.init_component = <<-JS
      function(){
        // calling superclass's initComponent
        this.callParent();

        // setting the 'rowclick' event
        var view = this.netzkeGetComponent('organisation_organisations').getView();
        view.on('itemclick', function(view, record){
          // The beauty of using Ext.Direct: calling 3 endpoints in a row, which results in a single call to the server!
          this.selectItem({item_id: record.get('id')});
          Ext.each(this.netzkeGetComponent('organisation_tabpanel').items.items, function(item, index) {
            item.getStore().load();
          });
        }, this);
      }
    JS

  end

  def configure(c)
    super
    c.items = [
        { items: [:organisation_organisations], region: :center },
        { items: [:organisation_tabpanel], region: :south, height: 200, split: true }
    ]
  end

  endpoint :select_item do |params, this|
    # store selected id in the session for child component's instance
    component_instance(:organisation_tabpanel).component_session[:selected_item_id] = params[:item_id]

  end

end

希望这对其他人也有帮助。

此致

托马斯

于 2015-01-16T14:18:31.137 回答
0

你得到了，ActiveModel::ForbiddenAttributesError因为你没有permit从控制器中获取属性。Rails 现在使用strong_parameters而不是attr_accessible（就像在 Rails 3 中一样）。

于 2015-01-16T05:13:22.463 回答