Input fields being hidden with .xforms-disabled

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

Input fields being hidden with .xforms-disabled

Hoi Chong
Hi,
I am having a weird problem with an xform that I have done up, a similar form like this work nicely.
The problem is that all the xforms input fields (text, textarea, select) are hidden with this .xforms-disabled  CSS.

Below is the xhtml content with all the models, view, css styles etc.

<html xmlns:xxforms="http://orbeon.org/oxf/xml/xforms"
        xmlns:xs="http://www.w3.org/2001/XMLSchema"
        xmlns:xforms="http://www.w3.org/2002/xforms"
        xmlns:xhtml="http://www.w3.org/1999/xhtml"
        xmlns:ev="http://www.w3.org/2001/xml-events"
        xmlns="http://www.w3.org/1999/xhtml">
<head>
        <title>Society Registration Form - Registry of Society</title>
        <xforms:model>
                <xforms:instance id="societies-instance">
                        <societies xmlns="">
                                <society>
                                        <soc_name/><soc_objective/><soc_addx/><num_proposed_members/><soc_type/><soc_extlink/><regn_date/><president/><secretary/><treasurer/>
                                </society>
                        </societies>
                </xforms:instance>

                <xforms:bind nodeset="instance('societies-instance')/society">
                        <xforms:bind nodeset="soc_name" required="true()"/>
                        <xforms:bind nodeset="soc_objective" required="true()"/>
                        <xforms:bind nodeset="regn_date" type="xs:date" constraint="if (. castable as xs:date)
                                                                  then current-date() + xdt:dayTimeDuration('P1D') >= xs:date(.)
                                                                  else false()"
                                                                  readonly="false()"
                                                                  calculate="if (. = '') then adjust-date-to-timezone(current-date(), ()) else ."/>
                </xforms:bind>

                <xforms:instance id="soctypes-instance">
                        <soctypes xmlns="">
                                <soctype><name>Religious</name><value>religious</value></soctype>
                                <soctype><name>Sports</name><value>sports</value></soctype>
                                <soctype><name>Political</name><value>political</value></soctype>
                                <soctype><name>Ethnic</name><value>ethnic</value></soctype>
                        </soctypes>
                </xforms:instance>

                <xforms:submission id="save-submission" ref="instance('societies-instance')" resource="/exist/rest/db/orbeon/society-registration/society.xml" method="put" replace="none">
                        <xforms:message ev:event="xforms-submit-error" level="modal">An error occurred while saving!</xforms:message>
                </xforms:submission>

                <xforms:submission id="list-submission" serialization="none" method="get" resource="/exist/rest/db/orbeon/society-registration/society.xml" replace="instance" instance="societies-instance"/>
               

        </xforms:model>

        <style type="text/css"> @page { size: 20.999cm 29.699cm; margin-top: 2cm; margin-bottom: 2cm; margin-left: 2cm; margin-right: 2cm } table { border-collapse:collapse; border-spacing:0; empty-cells:show } td, th { vertical-align:top; } h1, h2, h3, h4, h5, h6 { clear:both } ol, ul { padding:0; } * { margin:0; } *.fr1 { vertical-align:top; } *.Graphics { vertical-align:top; text-align:center; } *.HorizontalLine { color:#000000; font-family:'Times New Roman'; font-size:6pt; margin-top:0cm; margin-bottom:0.499cm; padding:0cm; border-left-style:none; border-right-style:none; border-top-style:none; border-bottom-width:0.0399cm; border-bottom-style:double; border-bottom-color:#808080; } *.P1 { color:#000000; font-family:Arial; font-size:10pt; } *.P2 { color:#000000; font-family:Arial; font-size:10pt; text-align:right ! important; } *.P3 { color:#000000; font-family:Arial; font-size:10pt; text-align:center ! important; } *.P4 { color:#000000; font-family:Arial; font-size:10pt; text-align:center ! important; font-weight:bold; } *.P5 { color:#000000; font-family:Arial; font-size:10pt; } *.P6 { color:#000000; font-family:Arial; font-size:10pt; } *.P7 { color:#000000; font-family:Arial; font-size:10pt; } *.Standard { color:#000000; font-family:'Times New Roman'; font-size:12pt; } *.TableContents { color:#000000; font-family:'Times New Roman'; font-size:12pt; } *.Textbody { color:#000000; font-family:'Times New Roman'; font-size:12pt; margin-top:0cm; margin-bottom:0.212cm; } *.Table1 { width:16.999cm; float:none; margin: 0 auto} *.Table1A1 { padding:0.097cm; border-width:0.0133cm; border-style:solid; border-color:#000000; } *.Table1A2 { padding:0.097cm; border-left-width:0.0133cm; border-left-style:solid; border-left-color:#000000; border-right-width:0.0133cm; border-right-style:solid; border-right-color:#000000; border-top-style:none; border-bottom-width:0.0133cm; border-bottom-style:solid; border-bottom-color:#000000; } *.Table1A3 { padding:0.097cm; border-left-width:0.0133cm; border-left-style:solid; border-left-color:#000000; border-right-style:none; border-top-style:none; border-bottom-width:0.0133cm; border-bottom-style:solid; border-bottom-color:#000000; } *.Table1A { width:8.498cm; } *.Table1B { width:8.5cm; } <!-- Orbeon related CSS declaration here --> .xforms-label { font-family:Arial; font-size:10pt; } .societies-label { display: -moz-inline-box; display: inline-block; width: expression('9em'); min-width: 9em; } .xforms-textarea-appearance-xxforms-autosize { width: 50em; margin-bottom: 2px } .xforms-input input { width: 20em; margin-bottom: 2px } .xforms-select1 { margin-bottom: 2px } .xforms-select1 input { width: 20em; margin-bottom: 2px } .societies-table { background-color: #fce5b6 } .societies-table .add-td { width: 33em } .societies-table .form-td { width: 33em; background: white; padding: .5em } .xforms-repeat-selected-item-1 .form-td { background: #ffc } .societies-action-table { width:16.999cm; float:none; margin: 0 auto; margin-top: 1em } .societies-action-table td { white-space: nowrap; vertical-align: middle; padding-right: 1em } .societies-action-table .xforms-submit img { vertical-align: middle } .societies-action-table .xforms-trigger-appearance-minimal img { margin-right: 1em; vertical-align: middle } .soc_name_field input { width: 50em; margin-bottom: 2px } .soc_addx_field { height: 8em; width: 30em; } .num_proposed_field input { width: 10em; margin-bottom: 2px } </style>
</head>
<body dir="ltr">
        <div style="text-align:left">
                                                                                                                               
                                <p class="fr1">Logo</p>
                       
                                <p class="P2"> </p>
                                <p class="P2">PENDAFTAR PERTUBUHAN <br/>
                                PENDAFTAR PERTUBUHAN <br/>
                                PENDAFTAR PERTUBUHAN <br/>
                                PENDAFTAR PERTUBUHAN <br/>
                                PENDAFTAR PERTUBUHAN <br/>
                                PENDAFTAR PERTUBUHAN </p>
                                <p class="P1"> </p>
                       
        </div>
        <div style="text-align:left">
                <p class="P1"> </p>
                <p class="P4">PERINTAH PERTUBUHAN, 2005 </p>
                <p class="P3">(Bab 8) </p>
                <p class="P4">PERMOHONAN BAGI PENDAFTARAN PERTUBUHAN </p>
                <p class="P1"> </p>
        </div>
        <div style="text-align:left">

                                        <colgroup><col width="371" /><col width="371" /></colgroup>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
                                <p class="P1">Nama penuh pertubuhan (jika nama dalam bahasa Cina, sila tulis juga dalam huruf Cina) </p>
                                <p class="P1">
                                <xforms:input ref="soc_name" class="soc_name_field">
                                        <xforms:label/>
                                </xforms:input>
                                </p>
                                <p class="P1"> </p>

                       
                                <p class="P1">Tujuan / matlamat pertubuhan ditubuhkan </p>
                                <p class="P1">
                                <xforms:textarea ref="soc_objective" appearance="xxforms:autosize">
                                        <xforms:label/>
                                </xforms:textarea>
                                </p>
                                <p class="P1"> </p>
                       
                                <p class="P1">Tempat kegiatan pertubuhan dijalankan </p>
                                <p class="P1">
                                <xforms:textarea class="soc_addx_field" ref="soc_addx">
                                        <xforms:label/>
                                </xforms:textarea>
                                </p>

                       
                                <p class="P5">Bilangan ahli pertubuhan yang dicadangkan </p>
                                <xforms:input ref="num_proposed_members" class="num_proposed_field">
                                        <xforms:label/>
                                </xforms:input>
                       
                                <p class="P1">Kami mengakui bahawa sejauh yang kami ketahui dan percayai, maklumat yang diberikan di dalam Borang Permohonan dan Borang Maklumat yang telah sempurna diisi oleh ahli-ahli yang dicadangkan bagi pertubuhan ini adalah benar dan betul dalam semua aspek. </p>
                                <p class="P1"> </p>
                       
                                <p class="P1">Butir ringkas pertubuhan </p>
                                <p class="P1"> </p>
                                <p class="P1">Jenis Pertubuhan: </p>
                                <p class="P1">
                                <xforms:select1 ref="soc_type">
                                        <xforms:label/>
                                        <xforms:item>
                                                <xforms:label>Choose One......</xforms:label><xforms:value/>
                                        </xforms:item>
                                        <xforms:itemset nodeset="instance('soctypes-instance')/soctype">
                                                <xforms:label ref="name"/><xforms:value ref="value"/>
                                        </xforms:itemset>
                                </xforms:select1>
                                </p>
                                <p class="P1"> </p>
                                <p class="P1">Cawangan untuk Pertubuhan yang di luar negeri: </p>
                                <p class="P1">
                                <xforms:input ref="soc_extlink">
                                        <xforms:label/>
                                </xforms:input>
                                </p>
                                <p class="P1"> </p>
                       
                                <p class="P5">Tandatangan / Nama </p>
                                <p class="P5">
                                <xforms:input ref="president">
                                        <xforms:label/>
                                </xforms:input>
                                </p>
                                <p class="P5"> </p>
                                <p class="P5">Presiden </p>
                       
                                <p class="P5">Tandatangan / Nama </p>
                                <p class="P5">
                                <xforms:input ref="secretary">
                                        <xforms:label/>
                                </xforms:input>
                                </p>
                                <p class="P5"> </p>
                                <p class="P5">Setiausaha </p>
                       
                                <p class="P1">Tarikh Permohonan </p>
                                <p class="P1">
                    <xforms:input ref="regn_date" navindex="4" class="datafield">
                        <xforms:label/>
                    </xforms:input>
                                </p>
                                <p class="P1"> </p>
                                <p class="P1"> </p>
                       
                                <p class="P5">Tandatangan / Nama </p>
                                <p class="P5">
                                <xforms:input ref="treasurer">
                                        <xforms:label/>
                                </xforms:input>
                                </p>
                                <p class="P5"> </p>
                                <p class="P5">Bendahari </p>
                       

                                                                               
                                <xforms:submit submission="save-submission" appearance="minimal">
                                        <xforms:label>SaveSave</xforms:label>
                                </xforms:submit>
                       
                                <xforms:submit submission="list-submission" appearance="minimal">
                                        <xforms:label>RevertRevert</xforms:label>
                                </xforms:submit>
                       

        </div>

        <p class="P1"> </p>
</body>
</html>

Anyone knows what are the problems that cause this weird issue?

Thank you in advance.

Regards
Reply | Threaded
Open this post in threaded view
|

Re: Input fields being hidden with .xforms-disabled

Alessandro Vernet
Administrator
On Oct 19, 2008, at 9:05 AM, hoichong wrote:

> I am having a weird problem with an xform that I have done up, a  
> similar
> form like this work nicely.
> The problem is that all the xforms input fields (text, textarea,  
> select) are
> hidden with this .xforms-disabled  CSS.

This is because the binding expressions (ref="...") don't point to a  
node in the instance. For instance you have:

<xforms:input ref="soc_name" class="soc_name_field">

But <soc_name/> is inside <society>, which is inside <societies> (the  
root element). The context is the root element if your instance  
(<societies>), so you need to write:

<xforms:input ref="society/soc_name" class="soc_name_field">

Alex
--
Orbeon Forms - Web 2.0 Forms, open-source, for the Enterprise
Orbeon's Blog: http://www.orbeon.com/blog/
Personal Blog: http://avernet.blogspot.com/
Twitter - http://twitter.com/avernet



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Reply | Threaded
Open this post in threaded view
|

Re: Re: Input fields being hidden with .xforms-disabled

Hoi Chong
Hi Alex,
Thanks for pointing this out. My mistake.

I use the  <xforms:group ref="society">  to group the xforms controls
together, thereby getting the right ref.

Regards.
Hoi Chong


Alessandro Vernet wrote:

> On Oct 19, 2008, at 9:05 AM, hoichong wrote:
>
>> I am having a weird problem with an xform that I have done up, a similar
>> form like this work nicely.
>> The problem is that all the xforms input fields (text, textarea,
>> select) are
>> hidden with this .xforms-disabled  CSS.
>
> This is because the binding expressions (ref="...") don't point to a
> node in the instance. For instance you have:
>
> <xforms:input ref="soc_name" class="soc_name_field">
>
> But <soc_name/> is inside <society>, which is inside <societies> (the
> root element). The context is the root element if your instance
> (<societies>), so you need to write:
>
> <xforms:input ref="society/soc_name" class="soc_name_field">
>
> Alex
> --
> Orbeon Forms - Web 2.0 Forms, open-source, for the Enterprise
> Orbeon's Blog: http://www.orbeon.com/blog/
> Personal Blog: http://avernet.blogspot.com/
> Twitter - http://twitter.com/avernet
>


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws