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.
Related
I am passing a Python variable (x) storing a multi word value x="ABC DEF", to an html textbox as the default value. In the page, only the first word 'ABC' is displayed in the text box as the default value.
Here is the code snippet:
<td width="15%" bgcolor="WHITE" align="Left">
<input type="text" name=""",input_value,""" value=""",x,""" selected="selected">
</td>
How can I display the value 'ABC DEF' as default value in the text box?
I could suggest you the following bypass, since i'm no python expert, but it should work:
1. replace the space with some sign that there is no way you'll ever write on you own. for example: "!#R%33" (just an example yeah?. you can replace space with: "_" if it is ok with you).
capture that string you sent via php on server side and use str_replace from that sign to space again, and walla.. write the value inside the html.
Once again, that is a workaround. hope the idea would help.
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.
Im not sure on how to explain this but, what I want to know is there if there is any way to "lock" just one part of an text area in a html form. Example:
<input name="example" type="text" id="example" valeu="__this part cant be modified__, and here user insert aditional info" />
And then I get this field value as like: "this part cant be modified + what user typed"
Thank you
I don't think you can, your best bet would probably to just append your default value to their input upon submission.
No, there isn’t, not for input elements, not for textarea elements.
You can however create an impression of such behavior, e.g. having some text and an input element on the same line and setting their style as similar as possible (setting all text, background, and border properties). Of course, the form data would still consist of the input value. And prepending the fixed text to it in client-side JavaScript would be possible but normally pointless, since it would be inherently unreliable and since you can simply make the form handler behave as if it got that string (i.e., make it have it as built-in data).
My application has a form with 2 submit buttons:
<input name="rating" class="Show" type="submit" value="Show answer">
<input name="rating" class="Skip" type="submit" value="Skip">
However I noticed some errors in GAE logs:
ValueError: invalid literal for int() with base 10: 'Voir la r\xe9ponse'
ValueError: invalid literal for int() with base 10: 'Sauter'
Basically it's the value of the form buttons, in French, whereas my app is in English.
How can a user change the form submit values? For example with google translate etc?
How can I handle this?
Yeah, that'll be Google Translate. It translates the text on the buttons as well. If you really want to prevent this, you'll have to make sure Google can't translate the text on the button. Note: these answers are not semantic HTML. Not sure if there's a cleaner method, I hope so, but this is what first springs to mind:
Method 1: hidden inputs
Since you're using buttons anyway, you might as well have them submit something. Put each button in its own form, add a hidden field, and use the value of the hidden field to determine what page to load next.
Downside: a lot of extra html, not really maintenance-friendly
Method 2: numeric value
Change the value of the buttons into something numeric, like 0 and 1. Hide the button's value with CSS and give the button a background image that shows the text. Load the page based on the numeric value.
Downside: very bad accessibility (screen readers, etc.), text on button won't be translated.
I really do hope there's better alternatives I haven't thought of yet.
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.