Hi I have a model variable "name", which is binded to a span like
<input type="text" ng-model="name">
<span ng-bind="name"></span>
What my requirement is that to show up the text that are entered in the input field without eliminating any spaces.
I find a way to achive that by writing a css property
.allow-spaces{
white-space:pre;
}
so now if I enter a value "hello ooo buddy" it will show up exactly same in the span as well, but it will not show spaces at the begining like " hello buddy" is shown as "hello buddy". Please suggest me a solution for this.
ngModel by default trims beginning and trailing white spaces in input[type=text]. To disable this behavior write ng-trim=false in the input element.
Reference
Related
I have problem with the form filling. Already tried using following methods:
driver.FindElementByXPath("//div[#id='s_dane_dokumentu-section?grid-1-grid?c_nr_lrn_komunikatu-control?xforms-input-1']").sendkeys "21123456"
and
driver.FindElementByXPath("//div[#id='s_dane_dokumentu-section?grid-1-grid?c_nr_lrn_komunikatu-control?xforms-input-1']").value = "21123456"
I noticed that ☰ character was displayed in VBA as "?". The full XPath also gives an error. Entire form have a lot of fields, I'm stuck on the first one...
HTML:
<input id="s_dane_dokumentu-section☰grid-1-grid☰c_nr_lrn_komunikatu-control☰xforms-input-1" type="text" name="s_dane_dokumentu-section☰grid-1-grid☰c_nr_lrn_komunikatu-control☰xforms-input-1" value="" class="xforms-input-input" aria-required="true" aria-invalid="true">
I might by inclined to use a substring match for the id via css attribute = value selector with $ ends with operator. In addition, add in the class and the type selector for the shown input element for extra specification.
driver.FindElementByCss("input.xforms-input-input[id$=xforms-input-1]").sendkeys "21123456"
You could also just use a single quote enclosed (for the value) attribute = value selector for the id. The prevents the WebDriver being thrown by the special characters.
driver.FindElementByCss("[id='s_dane_dokumentu-section☰grid-1-grid☰c_nr_lrn_komunikatu-control☰xforms-input-1']").sendkeys "21123456"
I'm aware that parsing numbers with pure CSS is impossible. But as in my case I know for certain that the input will always be in a specific way, is it possible to change the display of an input field based on the count of characters in it?
e.G. I want '123450' to be displayed as '1,234.50' - or if it were 'abcdef' it should become 'a,bcd.ef'.
So, I would like a rule that says: from right to left: after the second char display a dot, after the fifth and eight char display a comma.
Is that possible?
Example:
<input type="text" class="unformatted" value="123456" />
Should display like
<input type="text" class="formatted" vaulue="1,234.56" />
while still retaining its original value 123456.
What you're asking is not possible with pure CSS. The smallest you can go with CSS is the single HTML tag, you cannot go deeper than that.
Individual lines of text cannot be selected or altered, as they are seen as a whole by CSS engine.
With a little help from JavaScript, however, this can be easily done.
I have a Textbox:
Now i want to highlight specific characters in this textbox with a colour. (for example "Text")
Is this possible?
Use ajax/jQuery for highlighting particular selected words in a textarea while writing words.
Check this link- http://bytes.com/topic/javascript/answers/820173-highlighting-searched-word-text-area
There is another way without using Javascript to place a text on a textbox. But the text will be ash all the time. There is a tag name "placeholder" on HTML. That may help
<input type="text" placeholder="text" name="inputbox">
I am applying some formatting to input made inside a text box in a web page.
<input style="text-transform: uppercase"
type="text"
class="textbox"
id="code"
name="code"
D_LABEL="code"
beanProperty="code"
value=""
D_MANDATORY="true"
maxlength="10"/>
This works fine. I am saving the value in a database. However the value saved is not in upper case. How do save the same value as it appears on the text box at the time of capture?
It will not be uppercase, the text is lowercase, or case-dependent on how it is entered, CSS simply manipulates the visual layer, not the data.
The above answers point you in the right direction . You can simply convert the input box text to uppercase in javascript before sending the data to server. Use <string>.toUpperCase() method to achieve the conversion
There is no way to guarantee this on the client side. You need to perform string manipulation on the server side.
PHP Example:
$input = $_POST["code"];
$val = strtoupper($input);
There is a difference between 'value' and 'presentation'. The value stays as it was – it is only presented by CSS in uppercase. If you need an uppercase value, you'll need to transform it after transferring to the server.
Is there a way to get an <input />-field in HTML to wrap lines if the text is longer than the field using CSS? I don't want to use <textarea /> as I want to avoid users entering hard line-breaks by pressing enter.
No, sorry. <input type=text> is single line by definition. See the W3C document Forms in HTML Documents:
text
Creates a single-line text input control.
Using Dojo's Dijit TextArea form control, based off TextArea, you can have an input field which begins as a single line and expands as the user adds to it.
See its documentation.
You can't do what you want with CSS alone, but you could use JavaScript to prevent the user from entering line breaks in a <textarea> field.
Look at this,
http://www.echoecho.com/htmlforms08.htm
The wrap options are the most tricky part of text areas.
If you turn wrap off the text is handled as one long sequence of text without linebreaks.
If you set it to virtual the text appears on your page as if it recognized linebreaks - but when the form is submitted the linebreaks are turned off.
If you set it to physical the text is submitted exactly as it appears on the screen - linebreaks included.
Your best bet is use a textarea (with autogrow capabilities if you like), and then strip out the new lines when the form is submitted. Using php it would be something like this:
$text = str_replace(array("\n","\r"),'',$_POST['text_field']);
This would have the desired effect of blocking newline characters. As others have pointed out it's not really possible to get multi-line input in an input field.