How do I get these grayed out words that appear in input texts and indicate what is this input text for? I am using JSF 2 and I need it for my login's username and password widgets, so that the words "username" and "password" would appear inside the inputText before the user clicks in them to type his information.
If what I'm asking isn't clear you can look for example at this site. When you hit the "ask question" button and get the question's dialog you can see in the Title the gray words "what's your programming question? be specific." How is this done?
It's called WaterMark
You need jquery watermark plugin , or use some library like primefaces that got it out of the box
here is the jquery plugin usage
jquery-watermark
just add it in ready finction of jquery:
$("#idOfTheInputPassword").watermark('Type Your Password');
and here an example of primefaces watermark (which use jquery plugin behind the scenes)
Watermark
Related
I have created two custom fields on a JIRA story that I need rich text entry. The problem is that one is rendering correctly and the other isn't as can be see by the following images.
Both as can be seen are setup 'Text Field Multi-line' - exhausted all other lines of enquiry
The field has probably not the correct field renderer configured.
Settings --> Issues --> Field Configurations --> Your used field configuration
Now look for your field and click the "Renderers" link to select the "Wiki Style Renderer".
You need to create a Text Field, and convert it to WIKI style text field. This way you will be able to post URL.
Here is 5 minute video which I have created on how to do this.
https://youtu.be/QCNHPy88iKA
I hope it helps.
We have a MVC textbox(orignal textbox) in our form that expects time formatted string(eg:10:30), and we have provided a normal button next to it that opens a pop-up and user can see another textbox inside that which can be used for entering time in decimal format(eg:10.5)
then the pop-up shows the converted decimal to time format ie; 10:30. If user clicks OK then we takes the accepted value from the popup to orignal text box in the form.
The above user actions are done via jquery, we shows up jquery poupup and normal html input text box and takes the value back to original ASP.net MVC text box control.
All is fine, even jquery works fine. we have even checked the value of the original text box in javascript from DOM in Developer tool, But the value property of the original text is still the old value what we received when we opened our form - but when we checked the value using javascript in developer tool watch- its our new value.
Looks like our update in the value on the textbox is not posting to server.
Do anyone have any idea to make this working?
I try to write a web-component to create a simple login menu. it has paper-inputs for name and password and a button which fires a script to check the data.
the right data redirect to the next page while false credentials should open a toast element right above the button with an error message, siimilar to this one:
http://www.polymer-project.org/tools/designer/#6f21f8d26e14d614c9cb
Select the paper-toast-element in the tree-view and check the 'opened'-checkbox get get a vision what I try to do and please excuse the strange style.
The problem:
I included this element in my main page, but the toast element is always visible right from the start. and it doesn't react to the button click if I move the toast away with css.
I don't wanna spam this page with my code, so I uploaded it here:
https://gist.github.com/Gemoron/6b8f41d1bb6ff522e23c
I appreciate any suggestion on how to fix the problem.
You cannot access the hidden shadow DOM of an element directly with jQuery's $ function, nor with document.querySelector. Also jQuery is not needed anyway. Use Polymer's automatic node finding utility instead: this.$.paper_toast.
You can access the paper-input values with this.$.name.inputValue. But i would prefer to use data-binding instead: <paper-input value={{name}}>. Then you can access the input value in your JavaScript with this.name.
The function to display the toast is show().
I'm unable to reproduce the issue that the toast is visible right after the page has loaded. On my computer the toast is initially hidden and displayed when i click on the button (Chrome 37, Polymer 0.3.3).
In line 76 you try to use an "open()" method, which does not exist on paper-toast. It should be "show()". You can find paper-toasr API here: http://www.polymer-project.org/docs/elements/paper-elements.html#paper-toast
Also, because the ids in shadow dom are encapsulated, you should be using the id selection mechanism from Polymer instead of jquery-style selector
this.$.paper_toast.show();
More on automatic node finding in Polymer: http://www.polymer-project.org/docs/polymer/polymer.html#automatic-node-finding
Here's jsbin (you might need to refresh as jsbin sometimes breaks with Polymer imports)
http://jsbin.com/fened/1/edit
I have a select option list and im using jQuery Mobile. My list is very long so Id like to give users the option of searching the list by typing in text.
Is there some native / jQuery Mobile way of adding a text search when you focus on the list? If not I guess instead on an input ill need to create a link to a new page with a filter list, and use javascript to populate the 'input' with the value selected.
http://jquerymobile.com/test/docs/lists/lists-search.html
The short answer is no, unless you want to go nuts editing the JQM code to add that feature to the select box. That being said, I also had this problem (with the select menus being way too long), and here's what I did:
For one scenario, I used an autocomplete search box (that had results drop down: http://jqueryui.com/demos/autocomplete/) in addition to the select menu, populated with the data in the select menu. That way the user could choose whether to use the select menu or search.
For a second scenario, I allowed the user to search for something, then brought up a menu (really a dialog plugin) with only the results that matched what they searched for.
Hope this helps.
Personally, I could not get the jqueryui autocomplete to work well with jQuery Mobile. But this autocomplete code from Andy Matthews worked well:
http://www.andymatthews.net/code/autocomplete/
Used in conjection with an input text field, it provides a way for users to type in a few characters and see a list of choices to select.
We are using the FreeTextBox 3.1.6 on an intranet. The control appears on an ASP.Net project built in Visual Studio 2008.
When clients enter tabs in the text box, those tabs do not get preserved at postback. Rather, the tabs are lost. Other text formatting, like bold, italics, or font size are preserved.
Even when the postback event that occurs on the web page does not save anything to a database we are loosing the tabs. According to http://wiki.freetextbox.com/default.aspx/FreeTextBoxWiki.Installation the JavaScript and XML used by FreeTextBox are stored in a dll. So I cannot edit the contents of those files.
Has anyone encountered this issue with FreeTextBox? If so, how did you resolve it?
Here is the behavior that occurs. Enter text with tabs in the FreeTextBox control.
alt text http://img132.imageshack.us/img132/4826/ftb1postcz4.gif
Then select the "Save" button. This is a command button that posts back the page. In my test scenario nothing gets saved and loaded from a database. The FreeTextBox control is strictly displaying text that was posted. My guess is that the mechanism handling that is in ViewState, but I'm not sure about that.
alt text http://img132.imageshack.us/img132/175/ftb2postbd6.gif
As you can see, all of the tabs are gone. Even the tabs inserted between words are gone.
Thanks for your help.
Ken
Setting TabMode to "InsertSpaces" did not resolve this. My source code for instantiating the control is below. Pictures I posted didn't previously show up. Visit these links to see them.
http://img132.imageshack.us/img132/4826/ftb1postcz4.gif
http://img132.imageshack.us/img132/175/ftb2postbd6.gif
<FTB:FREETEXTBOX id="txtDocument" EnableHtmlMode="False" Width="100%" runat="server" AllowHtmlMode="True"
StripAllScripting="True" Height="400px" FormatHtmlTagsToXhtml="False"
AutoGenerateToolbarsFromString="true"
ToolbarLayout="ParagraphMenu, FontFacesMenu, FontSizesMenu, FontForeColorsMenu, FontForeColorPicker| Bold, Italic, Underline, Strikethrough; Superscript, Subscript, RemoveFormat| JustifyLeft, JustifyRight, JustifyCenter, JustifyFull; BulletedList, NumberedList, Indent, Outdent; CreateLink, Unlink, InsertImage, InsertRule| Cut, Copy, Paste; Undo, Redo, Print"
TabMode="InsertSpaces"
>
I found the answer. The original programmer had code that intercepted the contents of the textbox when it was submitted. That code reformatted the text for special currency characters like the Yen, Euro, and Pound.
Here is what the code looked like.
Dim hstrg As String = txtDocument.Text
Dim f As New FreeTextBoxControls.Support.Formatter
hstrg = f.HtmlToXhtml(hstrg)
What fixed the issue was commenting out that HtmlToXhtml() method. We don't need the contents to be Xhtml compatible, so this was a viable option for us.
i've been using free text box in some of my former development, but it had some quirks and wouldn't work right in IE.
try moving to FCKEditor, or TinyMCE. they seem like much better experience than FTB. i've chosen FCK, and i think WordPress uses TinyMCE. try them if a switch of editor is an option.