integrate OFBiz with Yui-Ext

[Jason.Wu]

Hi,

 I want to develop a stock analyst system based on OFBiz framework. But the
analysic panel (UI) is a bit complex, we need Drag and Drop, Editable Grid,
Resizable Windows.., so I want to use Yui-Ext to design page layout.
I'm not sure whether OFBiz + Yui-Ext is a good idea for this project. I'm
researching it.
So anybody has suggestion for this?
Or anybody know how to integrte OFBiz and Yui-Ext?

Thanks
Jason

[Krzysztof Podejma]

I have integrated ZK library with satisfying result
Maybe you should consider this lib.

Krzysztof Podejma

[Jason.Wu]

I have passed some simple Yui-Ext functions(like menu,grid) test in OFBiz.
My step is:
1. Download yui-ext and unzip to [OFBiz]\framework\images\webapp\images\ext-
1.0.1
2. Add JavaScript and CSS file in
[OFBiz]\framework\common\widget\CommonScreens.xml\<screen
name="GlobalDecorator">
                <set field="layoutSettings.styleSheets[+0]"
value="/images/ext-1.0.1/resources/css/ext-all.css" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/adapter/yui/yui-utilities.js" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/adapter/yui/ext-yui-adapter.js" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/ext-all-debug.js" global="true"/>
 3. Develop the JavaScript in freemarker file (ftl)
Below is my sample code:

<script type="text/javascript">
<#if partyList?has_content>
  Ext.onReady(function(){

   var myData = [
        <#list partyList as partyRow>
        ['${partyRow.partyId}','<#if partyRow.lastName?has_content>${
partyRow.lastName}<#if partyRow.firstName?has_content>,
${partyRow.firstName}</#if><#elseif
partyRow.groupName?has_content>${partyRow.groupName}<#else><#assign
partyName = Static["org.ofbiz.party.party.PartyHelper"].getPartyName(partyRow,
true)><#if partyName?has_content>${partyName}<#else>(${
uiLabelMap.PartyNoNameFound})</#if></#if>'],
        </#list>
        [' ',' ']
   ];

    var RecordDef = Ext.data.Record.create([
          {name: 'partyId'},
          {name: 'name'}
    ]);

    // create the Data Store
    var ds = new Ext.data.Store({
        // load using HTTP
        proxy: new Ext.data.MemoryProxy(myData),
        reader: new Ext.data.ArrayReader({id: 0}, RecordDef)
    });

    var cm = new Ext.grid.ColumnModel([
  {header: "ID", width: 200, dataIndex: 'partyId', sortable: true},
  {header: "Name", width: 200, dataIndex: 'name', sortable: true}
   ]);
    cm.defaultSortable = true;

    // create the grid
    var grid = new Ext.grid.Grid('grid-para', {
        ds: ds,
        cm: cm
    });
    grid.render();

    ds.load();
  });
 </#if>

</script>

  <div id="grid-para"></div>
Regards
Jason

2007/6/14, Krzysztof Podejma <[hidden email]>:
>
> I have integrated ZK library with satisfying result
> Maybe you should consider this lib.
>
> Krzysztof Podejma
>

[franklt69]

Hi Jason, very good to know about use Ext and OFBIZ, I am new in OFBIZ, I installed it and I am playing with this soft, but I don't have enough information to use it with Ext, so please could you tell me where I can get info about, using OFBIX with Ext Javascript framework for instance, or some link to begin to understand the ofbiz framework, and later to use it with ext, again Jason, this is my first post in this forums, and to me was good to know that Ext can use in OFBIZ, so any info how introduction to OFBIZ is welcome.

regards
Frank

Jason.Wu wrote

I have passed some simple Yui-Ext functions(like menu,grid) test in OFBiz.
My step is:
1. Download yui-ext and unzip to [OFBiz]\framework\images\webapp\images\ext-
1.0.1
2. Add JavaScript and CSS file in
[OFBiz]\framework\common\widget\CommonScreens.xml\<screen
name="GlobalDecorator">
                <set field="layoutSettings.styleSheets[+0]"
value="/images/ext-1.0.1/resources/css/ext-all.css" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/adapter/yui/yui-utilities.js" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/adapter/yui/ext-yui-adapter.js" global="true"/>
                <set field="layoutSettings.javaScripts[]"
value="/images/ext-1.0.1/ext-all-debug.js" global="true"/>
 3. Develop the JavaScript in freemarker file (ftl)
Below is my sample code:

<script type="text/javascript"> <#if partyList?has_content> Ext.onReady(function(){ var myData = [ <#list partyList as partyRow> ['${partyRow.partyId}','<#if partyRow.lastName?has_content>${ partyRow.lastName}<#if partyRow.firstName?has_content>, ${partyRow.firstName}</#if><#elseif partyRow.groupName?has_content>${partyRow.groupName}<#else><#assign partyName = Static["org.ofbiz.party.party.PartyHelper"].getPartyName(partyRow, true)><#if partyName?has_content>${partyName}<#else>(${ uiLabelMap.PartyNoNameFound})</#if></#if>'], </#list> [' ',' '] ]; var RecordDef = Ext.data.Record.create([ {name: 'partyId'}, {name: 'name'} ]); // create the Data Store var ds = new Ext.data.Store({ // load using HTTP proxy: new Ext.data.MemoryProxy(myData), reader: new Ext.data.ArrayReader({id: 0}, RecordDef) }); var cm = new Ext.grid.ColumnModel([ {header: "ID", width: 200, dataIndex: 'partyId', sortable: true}, {header: "Name", width: 200, dataIndex: 'name', sortable: true} ]); cm.defaultSortable = true; // create the grid var grid = new Ext.grid.Grid('grid-para', { ds: ds, cm: cm }); grid.render(); ds.load(); }); </#if> </script>
  <div id="grid-para"></div>
Regards
Jason

2007/6/14, Krzysztof Podejma <[e-mail]>:
>
> I have integrated ZK library with satisfying result
> Maybe you should consider this lib.
>
> Krzysztof Podejma
>