htmlentities() and html_entity_decode() in JQuery

htmlentities() and html_entity_decode() in JQuery :


We are all know about use of htmlentities() in PHP. This function is used to convert all character to HTML entities. both function are used to treat string as a html and HTML as a string.
  
    For Example :
  
              
            echo htmlentities("TechniqZone");
          
         ?>
      
        Output :
      
            &lt ;a href=&#39 ;techniqzone.blogspot.in'&#39 ;&gt ;TechniqZone&lt ;/a&gt ; 
 // here semicolons (;) are placed with spaces for display here.
           
        This is very usefull in many places in php files to display html tags in website. But in javascript/JQuery, pre-defined encode decode function is not available.
      
        I hereby explained how to use encode and decode of HTML tags in JQuery. Before that need to know the diifference between JQuery.html() and JQuery.text().
      
            JQuery.html() - Treat string as HTML.
            JQuery.html() - Treat HTML as string.
          
        For Example :
      
            $("#techZone").html("<a href=''></a>");
            $("#techZone").text("<a href=''></a>");

Okay, now we create encode/decode custom function using JQuery.
  
        function htmlentities(str)
        {
            if(str) // check str is empty or not.
                return $("<div />").text(str).html();
            else
                return 'Argument mis-matched';
        }
      
        htmlentities("TechniqZone");
      
     Here create dummy <div> tag and append given string as text, after that take that dummy div text as html content.
  
     For decode,
  
        function html_entity_decode(str)
        {
            if(str) // check str is empty or not.
                return $("<div />").html(str).text();
            else
                return 'Argument mis-matched';
        }
  
        html_entity_decode("&lt ;a href=&#39 ;techniqzone.blogspot.in&#39 ;&gt ;TechniqZone&lt ;/a&gt ;");
// here semicolons (;) are placed with spaces for display here.

Note : htmlentities and html_entity_decode function are only working with jquery plugin files.

Read More

Email validation using JavaScript and Jquery

Email validation using JavaScript and Jquery :

 Here i will explain how to validate email id with JQuery. In JavaScript we can check the email id format only. but in jquery we can check whether we allow or not some of domain names also. First i will explain basic javascript method to validate email id.

Here is Javascript method :

function validateEmail(emailId)
{
var condition = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
return condition.test(emailId);
}

In this javascript method only validate the given email id has alphabets and numeric. Here the variable "condition" has the email conditions. that is

([a-zA-Z0-9_.+-]) - is to allow email id username with  alphabets and numeric and also _.
@(([a-zA-Z0-9-]) - is to allow domail name with alphabets and numeric . and
([a-zA-Z0-9]{2,4}) - is to allow last part of the email id i.e., com, in, .. with alphabets and numeric and also                                   it's length should be 2 to 4.

Now i will explain how to validate email id with JQuery.

Here is JQuery Method :

$(document).ready(function() {

  $('#submitButton').click(function() {

    var emailCon = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    var emailblockCon =/^([\w-\.]+@(?!gmail.com)(?!yahoo.com)([\w-]+\.)+[\w-]{2,4})?$/;

    var emailId = $("#mailId").val();
    if(emailId == '') {
      $("#mailId").val('Email id is Blank.');
      error = true
    }

    else if(!emailCon.test(emailId)) {
      $("#mailId").val('Check Your Email id.');
      error = true
    }

    else if(!emailblockCon.test(emailId)) {
      $("#mailId").val('gmail and yahoo mail ids not accept.');
      error = true
    }

    if(error == true) {
           return false;
    }

    });
}); 

In this JQuery method you can check the email format like in javascript . In jquery we validate extra one condition. here we validate the email id domain name also. because some of the website doesnt allow some free email providers domain. so we can also validate it here.

Read More

Get cursor position in a textarea - Jquery

Get cursor position in a textarea - Jquery:

The following code is used to get the cursor point in textarea. if you change the id of textarea with particular div id then you can get the cursor points within the div.


(function ($, undefined) {
    $.fn.getCursorPosition = function() {
        var el = $(this).get(0);
        var pos = 0;
        if('selectionStart' in el) {
            pos = el.selectionStart;
        } else if('selection' in document) {
            el.focus();
            var Sel = document.selection.createRange();
            var SelLength = document.selection.createRange().text.length;
            Sel.moveStart('character', -el.value.length);
            pos = Sel.text.length - SelLength;
        }
        return pos;
    }
})(jQuery);

the bellow code is for set textarea id to call the above function.

$("#myTextBoxSelector").getCursorPosition();

Read More

JQuery to get Current Date

JQuery to get Current Date:

 The following code is used to get current date and time by using jquery.

 Before that, Date() function is not the part of JQuery. it is one of JavaScript's features.

var date = new Date();

var month = date.getMonth()+1;
var day = date.getDate();
var output = date.getFullYear() + '-' + (month<10 :="" day="" font="" month="">

Read More

JQuery to Find window Height

JQuery to set div in center of screen:

 The following code is used to find the center position of the any size of the screen. here i set the div in center of the screen using jquery.

  "$(window).height()" this function is used to get hight of the window(Screen).


var divCenter= $('#div_id');
divCenter.css("top", ($(window).height() - divCenter.height())/2  + 'px');

You can change this code whatever you find like screen height, width etc.

Read More