OFBiz › OFBiz - Dev

Embed Javascript in screens rendered using Screen/Form Widgets

_‹ Previous Topic Next Topic _›

Classic

List

Threaded

6 messages Options

Anil Patel

Embed Javascript in screens rendered using Screen/Form Widgets

Hi,
I am looking into using Ajax/JSON for moving data between UI and Server. If
the Screen uses form widgets then how/where do we put the javascript code
that needs to go with html form. I know we can do this in forms done in ftl,
but that needs lot of coding.

Any Ideas on what my options are here.

What If I create a file that has all the javascript that form will need and
add it to screen like in this example. But this breaks some basic design
rules.

<screen name="EditGlJournalEntry">
<section>
<actions>
<set field="targetAction"
value="lightCreateGlJournalEntry"/>
<set field="titleProperty" value="AcctgEditGlJournalEntry"/>
<set field="tabButtonItem" value="EditGlJournalEntry"/>
<set field="labelTitleProperty"
value="AcctgEditGlJournalEntry"/>
<entity-condition entity-name="GlAccount"
list-name="entityList" use-cache="true" >
<condition-expr field-name="glAccountId"
operator="greater" value="0" />
</entity-condition>
</actions>
<widgets>
<container>
<platform-specific>
<html><html-template
location="component://accounting/webapp/accounting/chartofaccounts/GlAccountForms.js.ftl"/></html>
</platform-specific>
<include-form name="EditGlJournalEntry"
location="component://accounting/webapp/accounting/chartofaccounts/GlAccountForms.xml"/>
</container>
</widgets>
</section>
</screen>

Regards
Anil Patel

David E Jones

Re: Embed Javascript in screens rendered using Screen/Form Widgets

What basic design rule does it break?

IMO this is fine, we have to keep the javascript somewhere, and an
ftl file like that is probably as good as any place.

-David

On Mar 20, 2007, at 12:55 PM, Anil Patel wrote:

> Hi,
> I am looking into using Ajax/JSON for moving data between UI and
> Server. If
> the Screen uses form widgets then how/where do we put the
> javascript code
> that needs to go with html form. I know we can do this in forms
> done in ftl,
> but that needs lot of coding.
>
> Any Ideas on what my options are here.
>
> What If I create a file that has all the javascript that form will
> need and
> add it to screen like in this example. But this breaks some basic
> design
> rules.
>
> <screen name="EditGlJournalEntry">
> <section>
> <actions>
> <set field="targetAction"
> value="lightCreateGlJournalEntry"/>
> <set field="titleProperty"
> value="AcctgEditGlJournalEntry"/>
> <set field="tabButtonItem" value="EditGlJournalEntry"/>
> <set field="labelTitleProperty"
> value="AcctgEditGlJournalEntry"/>
> <entity-condition entity-name="GlAccount"
> list-name="entityList" use-cache="true" >
> <condition-expr field-name="glAccountId"
> operator="greater" value="0" />
> </entity-condition>
> </actions>
> <widgets>
> <container>
> <platform-specific>
> <html><html-template
> location="component://accounting/webapp/accounting/chartofaccounts/
> GlAccountForms.js.ftl"/></html>
> </platform-specific>
> <include-form name="EditGlJournalEntry"
> location="component://accounting/webapp/accounting/chartofaccounts/
> GlAccountForms.xml"/>
> </container>
> </widgets>
> </section>
> </screen>
>
>
>
> Regards
> Anil Patel

smime.p7s (3K) Download Attachment

Anil Patel

Re: Embed Javascript in screens rendered using Screen/Form Widgets

I am worried about adding dependency on a External file,
GlAccountForms.xmlwill depend on
GlAccountForms.js.ftl in order to work. Code in GlAccountForms.js.ftl will
have to know and depend on field and form name defined GlAccountForms.xmlfile.

If this type of dependency is ok then I'll take this route.

Regards
Anil Patel

On 3/20/07, David E. Jones <[hidden email]> wrote:

>
>
> What basic design rule does it break?
>
> IMO this is fine, we have to keep the javascript somewhere, and an
> ftl file like that is probably as good as any place.
>
> -David
>
>
> On Mar 20, 2007, at 12:55 PM, Anil Patel wrote:
>
> > Hi,
> > I am looking into using Ajax/JSON for moving data between UI and
> > Server. If
> > the Screen uses form widgets then how/where do we put the
> > javascript code
> > that needs to go with html form. I know we can do this in forms
> > done in ftl,
> > but that needs lot of coding.
> >
> > Any Ideas on what my options are here.
> >
> > What If I create a file that has all the javascript that form will
> > need and
> > add it to screen like in this example. But this breaks some basic
> > design
> > rules.
> >
> > <screen name="EditGlJournalEntry">
> > <section>
> > <actions>
> > <set field="targetAction"
> > value="lightCreateGlJournalEntry"/>
> > <set field="titleProperty"
> > value="AcctgEditGlJournalEntry"/>
> > <set field="tabButtonItem" value="EditGlJournalEntry"/>
> > <set field="labelTitleProperty"
> > value="AcctgEditGlJournalEntry"/>
> > <entity-condition entity-name="GlAccount"
> > list-name="entityList" use-cache="true" >
> > <condition-expr field-name="glAccountId"
> > operator="greater" value="0" />
> > </entity-condition>
> > </actions>
> > <widgets>
> > <container>
> > <platform-specific>
> > <html><html-template
> > location="component://accounting/webapp/accounting/chartofaccounts/
> > GlAccountForms.js.ftl"/></html>
> > </platform-specific>
> > <include-form name="EditGlJournalEntry"
> > location="component://accounting/webapp/accounting/chartofaccounts/
> > GlAccountForms.xml"/>
> > </container>
> > </widgets>
> > </section>
> > </screen>
> >
> >
> >
> > Regards
> > Anil Patel
>
>
>

Adrian Crum

Re: Embed Javascript in screens rendered using Screen/Form Widgets

In reply to this post by David E Jones

Why not put the javascript in a separate file and load it via
layoutSettings.javaScripts[] in the <actions> section?

David E. Jones wrote:

>
> What basic design rule does it break?
>
> IMO this is fine, we have to keep the javascript somewhere, and an ftl
> file like that is probably as good as any place.
>
> -David
>
>
> On Mar 20, 2007, at 12:55 PM, Anil Patel wrote:
>
>> Hi,
>> I am looking into using Ajax/JSON for moving data between UI and
>> Server. If
>> the Screen uses form widgets then how/where do we put the javascript
>> code
>> that needs to go with html form. I know we can do this in forms done
>> in ftl,
>> but that needs lot of coding.
>>
>> Any Ideas on what my options are here.
>>
>> What If I create a file that has all the javascript that form will
>> need and
>> add it to screen like in this example. But this breaks some basic design
>> rules.
>>
>> <screen name="EditGlJournalEntry">
>> <section>
>> <actions>
>> <set field="targetAction"
>> value="lightCreateGlJournalEntry"/>
>> <set field="titleProperty"
>> value="AcctgEditGlJournalEntry"/>
>> <set field="tabButtonItem" value="EditGlJournalEntry"/>
>> <set field="labelTitleProperty"
>> value="AcctgEditGlJournalEntry"/>
>> <entity-condition entity-name="GlAccount"
>> list-name="entityList" use-cache="true" >
>> <condition-expr field-name="glAccountId"
>> operator="greater" value="0" />
>> </entity-condition>
>> </actions>
>> <widgets>
>> <container>
>> <platform-specific>
>> <html><html-template
>> location="component://accounting/webapp/accounting/chartofaccounts/
>> GlAccountForms.js.ftl"/></html>
>> </platform-specific>
>> <include-form name="EditGlJournalEntry"
>> location="component://accounting/webapp/accounting/chartofaccounts/
>> GlAccountForms.xml"/>
>> </container>
>> </widgets>
>> </section>
>> </screen>
>>
>>
>>
>> Regards
>> Anil Patel
>
>

jonwimp

Re: Embed Javascript in screens rendered using Screen/Form Widgets

In reply to this post by Anil Patel

Anil,

That's certainly how I do it. Some javascript functions are tightly coupled to a particular form
widget, so unless you can embed the javascript into the form widget itself, the next best thing
would be to place it in the screen widget (via a reference to an FTL file) like what you did.

Jonathon

Anil Patel wrote:

> I am worried about adding dependency on a External file,
> GlAccountForms.xmlwill depend on
> GlAccountForms.js.ftl in order to work. Code in GlAccountForms.js.ftl will
> have to know and depend on field and form name defined
> GlAccountForms.xmlfile.
>
> If this type of dependency is ok then I'll take this route.
>
> Regards
> Anil Patel
>
>
> On 3/20/07, David E. Jones <[hidden email]> wrote:
>>
>>
>> What basic design rule does it break?
>>
>> IMO this is fine, we have to keep the javascript somewhere, and an
>> ftl file like that is probably as good as any place.
>>
>> -David
>>
>>
>> On Mar 20, 2007, at 12:55 PM, Anil Patel wrote:
>>
>> > Hi,
>> > I am looking into using Ajax/JSON for moving data between UI and
>> > Server. If
>> > the Screen uses form widgets then how/where do we put the
>> > javascript code
>> > that needs to go with html form. I know we can do this in forms
>> > done in ftl,
>> > but that needs lot of coding.
>> >
>> > Any Ideas on what my options are here.
>> >
>> > What If I create a file that has all the javascript that form will
>> > need and
>> > add it to screen like in this example. But this breaks some basic
>> > design
>> > rules.
>> >
>> > <screen name="EditGlJournalEntry">
>> > <section>
>> > <actions>
>> > <set field="targetAction"
>> > value="lightCreateGlJournalEntry"/>
>> > <set field="titleProperty"
>> > value="AcctgEditGlJournalEntry"/>
>> > <set field="tabButtonItem" value="EditGlJournalEntry"/>
>> > <set field="labelTitleProperty"
>> > value="AcctgEditGlJournalEntry"/>
>> > <entity-condition entity-name="GlAccount"
>> > list-name="entityList" use-cache="true" >
>> > <condition-expr field-name="glAccountId"
>> > operator="greater" value="0" />
>> > </entity-condition>
>> > </actions>
>> > <widgets>
>> > <container>
>> > <platform-specific>
>> > <html><html-template
>> > location="component://accounting/webapp/accounting/chartofaccounts/
>> > GlAccountForms.js.ftl"/></html>
>> > </platform-specific>
>> > <include-form name="EditGlJournalEntry"
>> > location="component://accounting/webapp/accounting/chartofaccounts/
>> > GlAccountForms.xml"/>
>> > </container>
>> > </widgets>
>> > </section>
>> > </screen>
>> >
>> >
>> >
>> > Regards
>> > Anil Patel
>>
>>
>>
>
>
> ------------------------------------------------------------------------
>
> No virus found in this incoming message.
> Checked by AVG Free Edition.
> Version: 7.5.446 / Virus Database: 268.18.15/728 - Release Date: 3/20/2007 8:07 AM

jonwimp

Re: Embed Javascript in screens rendered using Screen/Form Widgets

In reply to this post by Adrian Crum

Adrian,

+1

Yes, this should be better.

Jonathon

Adrian Crum wrote:

> Why not put the javascript in a separate file and load it via
> layoutSettings.javaScripts[] in the <actions> section?
>
>
> David E. Jones wrote:
>
>>
>> What basic design rule does it break?
>>
>> IMO this is fine, we have to keep the javascript somewhere, and an
>> ftl file like that is probably as good as any place.
>>
>> -David
>>
>>
>> On Mar 20, 2007, at 12:55 PM, Anil Patel wrote:
>>
>>> Hi,
>>> I am looking into using Ajax/JSON for moving data between UI and
>>> Server. If
>>> the Screen uses form widgets then how/where do we put the javascript
>>> code
>>> that needs to go with html form. I know we can do this in forms done
>>> in ftl,
>>> but that needs lot of coding.
>>>
>>> Any Ideas on what my options are here.
>>>
>>> What If I create a file that has all the javascript that form will
>>> need and
>>> add it to screen like in this example. But this breaks some basic
>>> design
>>> rules.
>>>
>>> <screen name="EditGlJournalEntry">
>>> <section>
>>> <actions>
>>> <set field="targetAction"
>>> value="lightCreateGlJournalEntry"/>
>>> <set field="titleProperty"
>>> value="AcctgEditGlJournalEntry"/>
>>> <set field="tabButtonItem" value="EditGlJournalEntry"/>
>>> <set field="labelTitleProperty"
>>> value="AcctgEditGlJournalEntry"/>
>>> <entity-condition entity-name="GlAccount"
>>> list-name="entityList" use-cache="true" >
>>> <condition-expr field-name="glAccountId"
>>> operator="greater" value="0" />
>>> </entity-condition>
>>> </actions>
>>> <widgets>
>>> <container>
>>> <platform-specific>
>>> <html><html-template
>>> location="component://accounting/webapp/accounting/chartofaccounts/
>>> GlAccountForms.js.ftl"/></html>
>>> </platform-specific>
>>> <include-form name="EditGlJournalEntry"
>>> location="component://accounting/webapp/accounting/chartofaccounts/
>>> GlAccountForms.xml"/>
>>> </container>
>>> </widgets>
>>> </section>
>>> </screen>
>>>
>>>
>>>
>>> Regards
>>> Anil Patel
>>
>>
>
>