Custom css class in form builder

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

Custom css class in form builder

vicaed
Hi Alex, i don´t know how css in form builder boxes works. Please see the
image below:
<http://discuss.orbeon.com/file/t375607/customCss.png>
If I write {color: red} I get an error "xpath syntax error" in orbeon.log.
If I write color:red i don´t get error but it has not effects.

How should be the syntaxis to write css in the form builder boxes?

Could I mix css and xpath conditions in these boxes?

I have read the documentation in
https://doc.orbeon.com/form-builder/section-settings.html#custom-css-classes,
but there are not explanations there.



--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
Ok, I think I've found out how it woks. You write only the class name from
the css you've referenced for the oxf.fr.css.custom.uri.*.* property. Then
this class is applaid to the form builder component, right?
But only to the component in form builder not to the form field when you run
it in form runner, that's right?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,

You're correct: what you specify in Form Builder is a class name, and then
in your own CSS you write a selector that uses that class. The class goes on
an element around the label, help, hint, and "field" (e.g. input). You'll
most likely want to use something like Chrome Dev Tools to see where the
class is in the HTML, and check that your CSS works. You'll let me know if
you manage to make this work.

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Vincente, checking on this, did you get a chance to try writing the CSS that
uses the class set in Form Builder to target the form field inside the
element with the class?

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
Hi Alex, sorry for my late answer, I was working on other things these days.
Yes I try it and it works, thanks you.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
By the way, I have another small problem, it is not very important but maybe
you there is an easy solution.
If I have in a section template:
row 1: always visible fields
row 2: condition in the visibility field
row 3: condition in the visibility field

The fields of row 1 are always visible and depending of the user selection
in a field of row 1, row 2 or row 3 will be visibles, never both, only one
of them.
And the problem is that when I print in pdf a small vertical space appers
between row1 and (row2 or row3), it is like if fields which are hidden by a
condition still take a little bit of space in the vertical aligment, at
least in pdf mode.
There would be some easy way to avoid hidden fields by conditions take these
vertical space in pdf mode?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,

What version of Orbeon Forms are you using? Empty rows not taking any space
in the PDF has been taken care of a while ago (since 4.7.1), and is this is
now also the case in the HTML (since 2017.1).

https://github.com/orbeon/orbeon-forms/issues/2414

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
Hi Alex,
I'am using the newest version it is 2017.2.1, but I think I found the
problem. We are using a library that was created  using orbeon 3.9.1 and in
order to migrate to the 2017.2.1 I did a copy and paste of the source code
of the library that was created with this old version to the new orbeon
version. Today I created a new section template directly with the 2017.2.1
version and as you say hidden fields don´t take space. Does it make sense?
Then it is not the new orbeon engine interprete but that the new orbeon
version generate a source code a little bit different and it is that fix
this problem?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
This post was updated on .
Hi Alex, I have a second question. It is in some way relationated with this issue. We have about 200 forms which were made using orbeon 3.9.1 and we are going to migrate all this forms to orbeon 2017.2. We are thinking about copy and paste the source code of the old forms in the source code editor of orbeon 2017.2, do you think it is the right way to do it? do you know or could advice us about what is the best way to do the migration?
One of the things we are thinking about is that if newest versions of orbeon generate a diferent code source, it is a good practice thinking in the future to be using source code generated for orbeon 3.21?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to orbeon+unsubscribe@googlegroups.com.
To post to this group, send email to orbeon@googlegroups.com.
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,

The section templates created with an "old version" taking space with a "new
version" of Orbeon Forms seem to indicate that there is a difference in what
is produced when those templates are created, embedded, or published, but it
is hard to say more without further investigation. In this case, are you
good recreating the templates, or are you still looking for a solution?

Regarding migrating forms from 3.9.1, are you talking about forms created
with Form Builder in 3.9.1? Why not just open them in Form Builder in
2017.2? When opening a form in the Form Builder of a newer version of Orbeon
Forms, the form definition will automatically be migrated if needed. And
there should be no difference there between doing this and pasting the
source. Does this make sense?

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
This post was updated on .
Hi Alex,
When you say recreating the template, do you mean to do a new section
template using form builder 2017.2? The problem if I do a totally new secion
template is that old forms don´t get automatically this new template, then I
would have to add the template form by form and they are about 200, that's
why I wanted to explore another possible solutio. This also drive me a new
question:
How are section template referenced in the enclosing form? I did read the
source code and I only found:
 <xh:body>
        <fr:view>
            <fr:body xmlns:p="http://www.orbeon.com/oxf/pipeline"
xmlns:xbl="http://www.w3.org/ns/xbl"
                     xmlns:oxf="http://www.orbeon.com/oxf/processors">
                <fr:section id="section-2-section" bind="section-2-bind">
                    <xf:label ref="$form-resources/section-2/label"/>
                    <component:seccion_datos_interesado
xmlns:component="http://orbeon.org/oxf/xml/form-builder/component/sede/library"
                                                       
xmlns="http://orbeon.org/oxf/xml/form-builder"
                                                       
xmlns:xxbl="http://orbeon.org/oxf/xml/xbl"
                                                       
xmlns:fbf="java:org.orbeon.oxf.fb.FormBuilderXPathApi"
                                                       
xmlns:frf="java:org.orbeon.oxf.fr.FormRunner"/>
                </fr:section>
                <fr:section id="section-1-section" bind="section-1-bind">
                    <xf:label ref="$form-resources/section-1/label"/>
                    <component:seccion_datos_representante
xmlns:component="http://orbeon.org/oxf/xml/form-builder/component/sede/library"
                                                         
xmlns="http://orbeon.org/oxf/xml/form-builder"
                                                         
xmlns:xxbl="http://orbeon.org/oxf/xml/xbl"
                                                         
xmlns:fbf="java:org.orbeon.oxf.fb.FormBuilderXPathApi"
                                                         
xmlns:frf="java:org.orbeon.oxf.fr.FormRunner"/>
                </fr:section>
            </fr:body>

But there isn't any identifier to reference the corresponding section
template in the library.

About the migration, yes I'am talking about forms created with Form Builder
in 3.9.1. My doubt is precisely that, do you think that if we open forms from
3.9.1 in 2017.2 we are not going to find more problems like this?
I will try to explain myself better: almost all our forms are made using sections templates, our first step have been copy and past the source code of the library from 3.9.1 to 2017.2, then the second step would be to do the same with all form definition. But due to the small problem we are talking about (hide fields take a little bit of space), we are thinking in renovate the library using the 2017.2 builder. Renovate the library is not too much work but I realized that if you do that when you copy a form from 3.9.1, this form does not load the sections templates of the new library (Even if they have the same name and fields than the old one), so we have to add the extra work of add again the section templates of the new library to every form.
Then my question is, do you think it would be a best practice to renovate the library?
Do you think the difference that you commented up " there is a difference in what
is produced when those templates are created, embedded, or published" is important enogh as to have to renovate it?
I ask that also thinking in the future, if after 3 or 4 years we migrate to another version and we don´t renovate the section templates then we would have still sections templates from 3.9.1.
What would be your advice?


--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to orbeon+unsubscribe@googlegroups.com.
To post to this group, send email to orbeon@googlegroups.com.
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,

The "best practice" is that you shouldn't need to do anything, and you
shouldn't see empty lines take space in the PDF ;). Now, if that doesn't
happen, it looks to me like something isn't working as expected. Can you
reproduce the problem by pasting some source in Form Builder, or does the
problem disappear when you do that? If you can, would you be able to
simplify that use case that fails, and share it with us?

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
This post was updated on .
Hi Alex,

The problem happens when you paste code that was created using form builder
3.9.1 in form builder 2017.2. That I discoved is that the problem is not
with section templates itself is with any block of code containing hidden
fields, is you generate the code with form builder 3.9.1 and paste this code
in form builder 2017.2 then hidden fields take a little bit of vertical space
in pdf.
Being like that it is not a problem at all, I don´t need to use new section
templates, simply delete and recreate the fieds again, the advantage of this
is that old forms load the section template.
What is a pity is that section templates does not keep the formulas neither
the names that you write in the library, for instance I need the formula
@readonly = 'true' in 3 sections and I will have to write it form by form,
also I will have to change the section template names. Some chance to
improve this in future versions?

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to orbeon+unsubscribe@googlegroups.com.
To post to this group, send email to orbeon@googlegroups.com.
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,


vicaed wrote
> What is a pity is that section templates does not keep the formulas
> neither
> the names that you write in the library, for instance I need the formula
> @readonly = 'true' in 3 sections and I will have to write it form by form,
> also I will have to change the section template names. Some chance to
> improve this in future versions?

Sorry, I am not following you here: could you describe that use case in more
details?

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
Hi Alex,
The use case is like that:
1)You create a section template in the library. You give a name to this
section template and write one formula. See the attached picture:
<http://discuss.orbeon.com/file/t375607/section_template.png>

2)You create a new form. Drag and drop the section template from the library
to this new form.

3)Check the name and the formula of this section template. Both have been
missed.



--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

Alessandro  Vernet
Administrator
Hi Vincente,

I see: right now, everything you set in the Section Settings dialog is
considered to be "owned" by the form using the section template,, and not
the section template itself. We have a Request for Enhancement to improve
this, and I added a +1 from you:

https://github.com/orbeon/orbeon-forms/issues/3495

Alex

-----
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @avernet
Reply | Threaded
Open this post in threaded view
|

Re: Custom css class in form builder

vicaed
Ok, Alex, thanks you.

--
Sent from: http://discuss.orbeon.com/

--
You received this message because you are subscribed to the Google Groups "Orbeon Forms" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].