hey, I trying to enter the text in lowercase letter but when it comes to textbox it must be in uppercase if anyone can do this.
You can do this with CSS, no need for JavaScript or PHP
text-transform:uppercase
text-transform:lowercase
Add these to the style of each element class.
Or if you are resorting to inline styling, do this.
<input type="text" style="text-transform:uppercase;" />
String to uppercase with PHP (php.net doc):
strtoupper("Hello")
Output: HELLO
String to uppercase with JavaScript (java2s.com):
var s = new String("Hello")
s.toUpperCase()
Output: HELLO
Your options are:
As Raoul said, use CSS. If you possibly can, this is your best bet.
Let the user type in lower case, then transform it when they leave the field (blur, etc.) or when you save/process the text (e.g., on the server, whatever). Here's a blur example:
document.getElementById('theIDOfTheTextArea').onblur = function() {
this.value = this.value.toUpperCase();
};
Live example
Do it with JavaScript in the keydown or keypress event. Despite the various attempts intermittently posted here, doing this with JavaScript not trivial. It's trivial to identify the keypresses you want to handle and to cancel the event to prevent that keypress being added; but then inserting the character you do want is non-trivial. (Sadly, the keyboard events don't just let you substitute a different character; that would be nice, but they don't.) It unfortunately requires that you use text ranges / selections and gets you into areas that vary cross-browser. You'd probably need to leverage a library like Rangy to do it. I'd Just Say No and go the CSS / post-processing route.
The answer to this post will solve your problem.
Get the textbox element by id
Set an onBlur listener and convert its value using string.toUpperCase()
Have you check this
Upper
$("#idoftextbox").blur(function(){$(this).val($(this).val().toUpperCase())});
Put this in an onload event
Easy:
textareaElement.onkeydown = function(e) {
//make sure IE gets it
e = e || event;
//don't insert
e.preventDefault();
//catch the ASCII key code, and convert it to uppercase letter
this.value += String.fromCharCode(e.keyCode).toUpperCase();
}
Related
How can I list all available keyboard characters with JavaScript or|and PHP?
Lets say that user doesn't have access to the keyboard and can only fill a form with the mouse. I want to list all available keyboard characters to bind them to the mouse click event.
EDIT:
I don't care what kind of keyboard user has. What I know is that Alt + 0246 gets ö as #Barney sad. Where is that ö stored so that some keyboards access that character from a key and others with ALT + 0246? Isn't that location like an array accessible by PHP|JavaScript?
You may need to look into these
JS Based on-screen keyboard for browser, like on cellphones and tablets
http://jquerybyexample.blogspot.com/2012/04/jquery-ui-virtual-keyboard-plugin.html
Impossible to detect what keyboard the user has from within the browser context — this is the cause of a whole host of problems, as helpfully described here — which means we can't tell what characters are directly inputtable by the user.
As an example, German and Turkish users probably have ö readily available. I had to hold Alt and hit 0246 in sequence on my number pad to produce it. The end result is the same.
The other thing to bear in mind is that, even if you can determine exactly which key was hit, what it means and does is another thing entirely. The user could have rebound their commands at many junctures, or may be using a regional emulator.
Try something like this:
var container = $('#container');
for ( var i = 0; i < 26; i++ ) {
var chr = $('<div>' + String.fromCharCode(97 + i) + '</div>');
container.append(chr);
chr.click(function() {
console.log($(this).text());
});
}
The following script has been created to test if the value of a db field has changed and if so then reload the page and if not, alert the user that the change has not happened.
The alert is just to see what is being returned by the .post function.
The auto_refresh works fine as i need it to check every 5 seconds, when the if() condition is set to '==' the page alert shows and if it is set to '!=' the page continually reloads.
jQuery.post is getting the db field data but it doesn't seem to be able to compare the 2 values correctly.
any help would be greatly appreciated, thanks
var auto_refresh = setInterval(function(){
$.post("/index.php/listen", function(data) {
if($('#slide').html() != data)
{
window.location.reload()
}
else
{
alert('its the same'+ data);
}
});
}, 5000);
EDITED
Rather than trying to parse raw data, why not pass HTML from the $.post() like:
<p>4</p>
Then the jQuery inserts the the replaces the p tag with the new version from the $.post()
because the html is passed on there is no white space and the comparison can be made correctly.
I don't think it is very safe to compare the new value with an html. Some browsers might add spaces or unwanted chars. I'd try to save the old value in an input of type hidden and use the .val() or, event better, in a variable. It depends of your scenario.
If $('#slide').html() == data
then that means that the conditional failed, it was not equal, so it showed the alert.
The problem is that the data variable might come back with a few extra white spaces. If I were you, I'd try to parse a small section of the data variable, and a small section of the html in slider and compare those values.
Like if slider has something within a p tag or an input value, compare it to the data to see if it has that same value returned in that p tag or input value, then replace all the whitespaces with an empty string just to be safe.
Btw, try not to use alerts since you can't really know for sure if there is an extra whitespace. Try to use something like "debugger" if using IE with visual studios, or console.log when using chrome or firefox.
You are comparing two html strings: one is serialized from the DOM, and another is from a server response.
There's no guarantee that the two strings will ever be the same! Think about it: the same rendered html can have many string differences. E.g. click and click are both the same HTML, but different strings.
You can take two different approaches here:
You can create some kind of canonicalization routine that guarantees that two html fragments you consider "the same" will have the same string form. Run both html fragments through this routine, then compare.
You can manage versions more explicitly.
Include some kind of version indicator:
You can use the ETAG header (which means you can take advantage of http caching mechanisms).
You can include some kind of version number in the html itself (maybe in a data-version attribute), and compare those.
You can keep the html string from your server separately and compare against that.
What I want to do is so that when word riches the end of the line to divide word into two words and insert hyphen before line-break. It's similar to <wbr> tag but it doesn't inserts anything.
Examples:
Java- <--- I want to insert this hyphen before line-break
Script
or
Ja- <---- Same here
vaScript
Is there anyway of doing it? I don't mind using php, javaScript but jQuery would preferable and if I can achieve it using CSS or HTML that would be great.
Thnx in advance!
If you want to do it client-side, you will need a hyphenation plugin. Reason being, there needs to be a dictionary of hyphenation rules to follow, and that's something that's not simply included in the browser. [update: although, that statement is partially false already! Chris's link shows limited (very limited, but still... promising!) support.]
Here's one jQuery plugin I found: http://archive.plugins.jquery.com/plugin-tags/hyphenation and I know I've used one in a project before (may have been this one even). It will of course insert the hyphen into the node's contents, but the content doesn't need to have it included, the hyphenation is calculated by the function after DOM ready.
Whether or not the rules are extensive enough to break up words outside of the 'norm' is another question.
Side note: JavaScript is a proper noun, which should be excluded from hyphenation. I imagine that was just an example off the top of your head, though. ;-)
It looks like there is some limited browser support for CSS hyphenation. Does that work for you?
This function should solve your problem. It insert Soft Hyphen | $shy; into "long" words.
pText = Your string
pMax = Every X Char in a word insert a Soft Hyphen;
function hyphen(pText, pMax){
var t = pText.split(" ");
for(i=0; i<t.length; i++){
if(t[i].length<pMax){
var w = t[i]
var re = new RegExp("(.{"+pMax+"})","g");
if(w.length<pMax+3){
var pos = t[i].length - 3;
re = new RegExp("(.{"+ pos +"})","g");
}
t[i] = w.replace(re,"$1"+);
}
}
return t.join(" ");
}
*UPDATE:*I've already answered my question. But you can still give me advise and i'll take your answer as selected
NOTE: If you don't need to know what I want to do with the codes, just skip the first several paragraphs and directly see the codes and tell me why they doesn't work without error.
I want to make something like stackoverflow's similar title search when you enter your title in the ask page.
I need to split words to make regex and then search in the database. Since my application is in Chinese(no spaces between each words) and I think splitting chinese into meaningful phrases using PHP is too hard. I have an idea splitting it in the client side using javascript according to chinese IME's characteristic that, for example, if you want to type the word "你好中国" in chinese, people usually type "nihao[space]zhongguo" in IME(note where the space bar is), since '你好'(nihao - hello) is a phrase and '中国'(zhongguo - china) is another. So when people press space bar i record the word he entered before the space and start a timer of 2 seconds , if he or she enters another words clear the timer and continue to record if he or she doesn't, send each words recorded to the server.
Qustion is, is this a good idea? Are there any other convenient way to do this? And why these lines i wrote to test won't work without error.
script:
$(function(){
var i=0;
$('#t').keyup(function(e){
if(e.keyCode==32)
{
eval("a"+i+"=$(this).val()");
i++;
var timer=setTimeout("for(b=0;b<i;b++){alert(eval('a'+b));}",1000);
if($("#t").keydown())
{
clearTimeout(timer);
}
}
})
})
html:
<input id="t"/>
I think i know why it won't work now:
First, i should be a global variable;
Second, the keydown() function should be outside of the keyup(). modified js:
$(function(){
i=0;
timer=null;
$('#t').keyup(function(e){
if(e.keyCode==32)
{
eval("a"+i+"=$(this).val()");
i++;
timer=setTimeout("for(b=0;b<i;b++){alert(eval('a'+b));}",1000)
}
})
if($("#t").keydown())
{
clearTimeout(timer);
}
})
If you have other suggestions on my idea or codes you can still answer this question or i'll select this one after some time.
dear all..i want my input form automatically make all character become big size..
and also without press a capslock button...i want all data which have been input into DB in capital format..what's code to make it?
One simple way in jQuery is to convert the the value to uppercase after every keyup event:
$(document).ready(function(){
$('#myfield').keyup(function() {
var t = $(this);
t.val(t.val().toUpperCase());
});
});
Remember that this only changes the value in the UI on the client. When the user submits the form, it will send this uppercased value, but a malicious user could send data that was not uppercased, so you probably want to use an upcase method on your server, either in your CGI code (PHP, Perl, Java or whatever you're using), or in your SQL insert statement.
As Matthew said, strtoupper() will work.
$str = "Mary Had A Little Lamb and She LOVED It So";
$str = strtoupper($str);
echo $str; // Prints MARY HAD A LITTLE LAMB AND SHE LOVED IT SO
Using Javascript to filter something that is going into a database, is bad. What if the user decides to turn of Javascript? You can do it, but it will have to be done again when in the backend code, so it's a waste of time for something like this :)
You can use the PHP function strtoupper.