jQuery plugin for Uppercase, lowercase, title case and pascal case

Details
Category: Websites Development
Hits: 7162

The beauty of this plugin is that this plugin can be used to convert text to uppercase, lowercase, title case and pascal case. 

Features

  • It makes use of some of the jQuery/javascript methods to convert the text.
  • Option to change the cases on focus out. This is important as with keypress event, when you put cursor in between a word and start typing, character is being added at end.
  • Supports Uppercase, Lowercase, Titlecase and Pascalcase
  • Converts text to case as user types
  • Very lightweight and easy to configure.
  • Browser Independent

 

Demo

 

 

How to use it?

 

<script type="text/javascript"
src="https://jquery-blog-js.googlecode.com/files/SetCase.js">
</script>

This plugin can be used for textbox and you need to set the case which you want to implement on textbox. All you need to do is to set "caseValue" property value to one of the following value.

 

  • upper
  • lower
  • title
  • pascal

Note: All the values are in lower case. Upper case:

 
<script type="text/javascript"
src="https://jquery-blog-js.googlecode.com/files/SetCase.js"> 

</script>

 

Lower case:

 

$(function() {
    $("#txtLower").Setcase({caseValue : 'lower'});
});

 

Title case: First letter of entered text is capital and rest are in lower case.

 

$(function() {
    $("#txtTitle").Setcase({caseValue : 'title'});
});

 

Pascal case: Every first letter of the word is set to capital.

$(function() {
    $("#txtPascal").Setcase({caseValue : 'pascal'});
});
By default, this plugin changes the case as user types. There is an option "changeonFocusout", which allows to override default setting and changes case once the focus moves out of textbox.
$(function() {
    $("#txtUpper").Setcase({caseValue : 'upper', changeonFocusout: true});
});
See live Demo and Code
You can also download the plugin from below link.
Original Article