XUL: how to persist a value of a textbox? - firefox-addon

I have a Firefox extension that contains a textbox:
<textbox id="exclude-text" flex="1" rows="10" multiline="true" style="min-width: 25em;" wrap="off" value="0" persist="value"/>
A user enters some text in the text box. I need this text to persist across sessions.
I found this info on the "persist attribute", but in my case it does not work.
Is there any way to make it work or any simple workaround?
Thank you!

The persist attribute can only store attributes - yet the value attribute of a text field doesn't change when text is being entered, only the value property. As far as I know, the only work-around is keeping the value attribute in sync with the value property manually, something like this:
<textbox id="exclude-text" value="0" persist="value"
oninput="this.setAttribute('value', this.value);document.persist(this, 'value')"/>
Calling document.persist() is necessary unfortunately, changing attributes manually normally doesn't trigger persistance.
For reference: this is bug 111486, a XUL limitation first noted in 2001.

Related

How do you do <input type="number" /> in Native Base?

In HTML, you can use <input type='number' /> to restrict the user's input to numbers only. It also adds little increment/decrement numbers on the input field. Is there a way to do this in Native Base (v3.2.2)? What is the associated onChange property (onChange, onChangeText, onValueChange, etc.)?
I have scoured the official documentation and have found nothing.
I tried to find the issue and turned out that react-native-web ( one of NativeBase core dependencies) is not passing the props to the HTML Input.
I have created a PR for its fix.

Clear a field of an existing record while accessing the form

When accessing a form I need to add a field that has to be empty even if in the backend it has value. And when the user enters a value in this field, this newly entered value should replace the old one when the form is submitted.
The code below presents my best attempt, but onload doesn't do anything here for some reason. On the other hand if I use onclick the value is cleared as soon as the field is clicked. Could you please point me to right direction on what I am doing wrong with onload or if there's alternative solution to achieve the same need?
<g:textField
class="internal-text"
name="Internal__c"
value="${Instance?.Internal__c}"
onload="if (this.value != '') {this.value = '';}"
maxlength="20"/>
Thanks!
I'd suggest adding a hidden field and use a dummy text field to set it. The text field can be blank as desired, and when it changes you copy the value to the hidden field.
<g:hiddenField name="Internal__c" value="${Instance?.Internal__c}" />
<g:textField class="internal-text" name="Internal__c_dummy" onchange="this.form.elements['Internal__c'].value = this.value" maxlength="20" />

p:inputText does not remember values(autofill does not work)

How to make p:inputText remember values? I have autocomplete="on" in there but it doesnot work.
Please find the code below:
<p:inputText id="username_email" value="#{BsnsSgnupLgnBen.userName}" required="true" size="25" autocomplete="on" >
<f:validateLength minimum="0" maximum="50" />
</p:inputText>
Any clue?
Browser-builtin autocomplete/autofill is only triggered during synchronous page load. So, if you're loading your forms by ajax, then autocomplete/autofill is not triggered. Apparently that's what happening here. The solution is obvious: you need to load your forms on which you need autocomplete/autofill synchronously. E.g. by <h:link>, <h|p:button>, etc or a navigation with faces-redirect=true.
As the particular input field seems to be part of a login form, I just want to add for sake of completeness, another thing to take into account is that usernames/passwords of login forms (a form is considered a login form when it has at least one <input type="password"> field) are not remembered for autocomplete/autofill when the login itself is submitted by ajax. You should perform the actual login synchronously. You can use <p:commandButton ajax="false"> for this.
Please do note that the concrete problem has completely nothing to do with JSF. It's in the context of this question merely a HTML code generator. You'd have had exactly the same problem when using a different server side language generating the very same HTML output and even when using plain vanilla HTML.
I think you should use the autoComplete component from Primefaces http://www.primefaces.org/showcase/ui/autocompleteHome.jsf

inital value with setBooleanButton in primefaces

I'm using Primefaces and MyFaces. I would like to use the selectBooleanButton component, to control visibility of other components within a long and rather complex form.
simplified sample code:
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="#{not empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />
<h:panelGroup id="commentPanel"
style="display:#{empty myBean.comment ? 'none' : 'block'}">
<p:inputTextarea value="{myBean.comment}"/>
</h:panelGroup>
The javascript in the onchange attribute simply toggles the display style from none to block and vice-versa to hide or unhide the panel group. I want/need the components to remain in the view, I do not want to use rendered attributes to remove them completely.
Where I get into trouble is because of the EL construct used in the value attribute of the setBooleanButton component. I do realize that this EL statement is not compatible with the set operation, and this results in an exception.
What I want to be able to do is when the form is loaded, have the initial status of the selectBooleanButton components set to 'on' when the comment property has some existing text it, and 'off' when it is empty. I am looking for a way to work around this that would not require me to create a property in the model for each and every instance where I want to hide the panel, as that would result in dozens and dozens of properties because my real world form is very large with many of these comment sections.
I also posted this question on Primefaces forum, and did not receive any answers there either, so at this time there may not be a great solution to this problem, or at least not one that has been shared. What I ended up doing to work around this is to create two versions of the component, and use the rendered attribute to control which one is used, like this:
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="true" rendered="#{not empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />
<p:selectBooleanButton
onLabel="Comment" offLabel="Comment"
onIcon="ui-icon-check" offIcon="ui-icon-close"
value="false" rendered="#{empty myBean.comment}"
onchange="toggleDisplay(this.checked,'myForm:commentPanel');" />

Why use <g:textField /> in Grails?

What is the reason to use g:textField in Grails if you're already familiar with standard HTML form tags?
If I understand correctly the following two markup alternatives are equivalent:
<input type="text" name="name" value="${params.name}" id="name" />
<g:textField name="name" value="${params.name}" />
Are there any circumstances under which using g:textField would add value? Am I missing something?
The textField tag is provided as a convenience (slightly shorter than writing the HTML input) and is there to provide a full set of form tags. Personally I prefer to write as much plain HTML as possible in my Grails views and only tend to use the tags that really offer a benefit such as the form tag. I have not found an instance where using textField would have added any value outside of requiring a few less characters to type.
<g:textField /> is not shorter as plain text field tag, except id attribute will be attached automatically.
However, I recommend you to use customized tags associating the bean values with input fields. That shortens the code a lot. For more information you can read http://www.jtict.com/blog/shorter-grails-textfield/
Also you can find useful stuff in Form Helper Plugin

Resources