jquery.simplyCountable.js
(function($){
$.fn.simplyCountable = function(options){
options = $.extend({
counter: '#counter',
countType: 'characters',
wordSeparator: ' ',
maxCount: 256,
strictMax: false,
countDirection: 'down',
safeClass: 'safe',
overClass: 'over',
thousandSeparator: ',',
onOverCount: function(){},
onSafeCount: function(){},
onMaxCount: function(){}
}, options);
var countable = this;
var counter = $(options.counter);
if (!counter.length) { return false; }
var regex = new RegExp('['+options.wordSeparator+']+');
var countCheck = function(){
var count;
var revCount;
var reverseCount = function(ct){
return ct - (ct*2) + options.maxCount;
}
var countInt = function(){
var text = countable.val();
for (var i = 0; i < text.length; i++) {
var charCode = text.charCodeAt(i);
//utf-8 character count
if (charCode == 10 || charCode == 13) {
if ($.browser.msie) {
count -= 1;
}
}
else if (charCode > 127 && charCode < 2048) {
count -= 2;
} else if (charCode > 2047 && charCode < 65536) {
count -= 3;
} else if (charCode > 65535 && charCode < 1114112) {
count -= 4;
}
}
return (options.countDirection === 'up') ? revCount : count;
}
var numberFormat = function(ct){
if (options.thousandSeparator){
ct = ct.toString();
for (var i = ct.length-3; i > 0; i -= 3){
if((ct.length%4)==0 && ct.charAt(0)=='-'){
ct = ct;
} else {
ct = ct.substr(0,i) + options.thousandSeparator + ct.substr(i);
}
}
}
return ct;
}
/* Calculates count for either words or characters */
if (options.countType === 'words'){
count = options.maxCount - $.trim(countable.val()).split(regex).length;
if (countable.val() === ''){ count += 1; }
}
else { count = options.maxCount - countable.val().length; }
revCount = reverseCount(count);
/* If strictMax set restrict further characters */
if (options.strictMax && count <= 0){
var content = countable.val();
if (count < 0 || content.match(new RegExp('['+options.wordSeparator+']$'))) {
options.onMaxCount(countInt(), countable, counter);
}
if (options.countType === 'words'){
countable.val(content.split(regex).slice(0, options.maxCount).join(options.wordSeparator));
}
else { countable.val(content.substring(0, options.maxCount)); }
count = 0, revCount = options.maxCount;
}
counter.text(numberFormat(countInt()));
/* Set CSS class rules and API callbacks */
if (!counter.hasClass(options.safeClass) && !counter.hasClass(options.overClass)){
if (count < 0){ counter.addClass(options.overClass); }
else { counter.addClass(options.safeClass); }
}
else if (count < 0 && counter.hasClass(options.safeClass)){
counter.removeClass(options.safeClass).addClass(options.overClass);
options.onOverCount(countInt(), countable, counter);
}
else if (count >= 0 && counter.hasClass(options.overClass)){
counter.removeClass(options.overClass).addClass(options.safeClass);
options.onSafeCount(countInt(), countable, counter);
}
};
countCheck();
countable.keyup(countCheck);
countable.keypress(countCheck);
countable.click(countCheck);
countable.mouseover(countCheck);
};
})(jQuery);
main.gsp(for layout)
<g:javascript library="jquery" plugin="jquery"/>
<script type="text/javascript" src="${resource(dir: 'js', file: 'jquery.simplyCountable.js')}"></script>
<head>
…..............
…........
<style type="text/css" media="screen">
.safe {
color: green;
}
.over {
color: red;
}
</style>
<script>
jQuery.noConflict();
jQuery(document).ready(function () {
jQuery('textarea').map(function() {
if (jQuery(this).attr("floor") == 1) {
var id = jQuery(this).attr("id");
jQuery('#' + id).live('keydown',ND.utils.textCounter);
jQuery('#' + id).live('keyup',ND.utils.textCounter);
jQuery('#' + id).live('focus',ND.utils.textCounter);
}
});
});
</script>
….......
….........
</head>
For textarea in any .gsp
<g:countableTextArea name="medicalInfo" id="medicalInfo_countable" class="field" cols="25" rows="4" floor="1"
length="3000" value="${ifspTypeInfoInstance?.medicalInfo}"/>
NB:
1. floor means active for textarea countable...............
2. length means max length.
Taglib......
def countableTextArea = { attrs, body ->
def escapeHtml = true
if (attrs.escapeHtml) escapeHtml = Boolean.valueOf(attrs.remove('escapeHtml'))
// Pull out the value to use as content not attrib
def value = attrs.remove('value')
if (!value) {
value = body()
}
out << """<textarea """
attrs.each { k, v ->
out << "$k=\"${v.encodeAsHTML()}\" "
}
out << """ >""" <<"""${escapeHtml ? value.encodeAsHTML() :value}</textarea>"""
def check = Integer.valueOf(attrs.remove('floor'))
if (check == 1) {
out << """<p style="margin: 0;"> <span id="${attrs.id}-counter"> </span> </p>"""
}
}
এতে সদস্যতা:
মন্তব্যগুলি পোস্ট করুন (Atom)
কোন মন্তব্য নেই:
একটি মন্তব্য পোস্ট করুন