Creating JSON Parser Using JQuery

Author posted by Jitendra on Posted on under category Categories Web Technology and tagged as Tags , with 2 Comments on Creating JSON Parser Using JQuery

JQuery JSON Tutorial – Creating JSON Parser Using JQuery with Source code and live demo

JSON stands for “Javascript Object Notation” and often used to interchange the data between servers. Its use is increased in web development because of its flexibility and data support.

I have created Online JSON parser using JQuery library.

 

JSON Parser Using JQuery Tutorial
JSON Parser Using JQuery Tutorial

Live Demo – Online JSON Parser

Continue reading “Creating JSON Parser Using JQuery”

Servlet, Hibernate, jQuery and Ajax based google like chat

Servlet, Hibernate, jQuery and Ajax based google like chat with source code

Hi, In this article, my aim is to create an application which uses the concept of Hibernate in Servlet with Ajax support of Jquery.
Below figure can give you the idea of final look and feel of the complete application:

Servlet, Hibernate, jQuery and Ajax based google like chat
Servlet, Hibernate, jQuery and Ajax based google like chat

Continue reading “Servlet, Hibernate, jQuery and Ajax based google like chat”

JavaScript Error “˜expected identifier, string or number’ in Internet Explorer (IE)

Solution of expected identifier, string or number’ in Internet Explorer (IE) – javascript

Yesterday my friend come across a javascript error “expected identifier, string or number” in internet explorer (IE). The same code was running great in Mozilla and chrome. here the snap of code causing an error:

Continue reading “JavaScript Error “˜expected identifier, string or number’ in Internet Explorer (IE)”

Difference between $find and $get Methods

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags , , with Leave a comment on Difference between $find and $get Methods

What is Difference between $find() and $get() Methods in ASP.NET

$get is used to get a reference to a DOM element. It is an alias for Sys.UI.DomElement.getElementById:

var myLabel = $get(‘myLabel’);

$find is an alias for Sys.Application.findComponent() and it’s used to get a reference to a particular component, given its id.

How to get DOM element using $find

var lnkAddNew = $find("CntrlID");
if(lnkAddNew)
{
    lnkAddNew.get_element().style.display = '';
}

Get Mouse Position in JavaScript for all browsers

Author posted by Jitendra on Posted on under category Categories Tech Tips and tagged as Tags with Leave a comment on Get Mouse Position in JavaScript for all browsers

 

Get Mouse Movement in Javascript
Get Mouse Movement in Javascript
function mouseXPos(evt) {
if (evt.pageX) return evt.pageX;
else if (evt.clientX)
return evt.clientX + (document.documentElement.scrollLeft ?
document.documentElement.scrollLeft :
document.body.scrollLeft);
else return null;
}

function mouseYPos(evt) {
if (evt.pageY) return evt.pageY;
else if (evt.clientY)
return evt.clientY + (document.documentElement.scrollTop ?
document.documentElement.scrollTop :
document.body.scrollTop);
else return null;
}

To use above function, just pass the mouse event.

Live Demo

Why Style.left does not work in Firefox, chrome and safari ?

Author posted by Jitendra on Posted on under category Categories HTML and tagged as Tags , with 3 Comments on Why Style.left does not work in Firefox, chrome and safari ?

During working on one of my project, i found that style.left does not work with Mozilla, chrome and safari but nicely works on internet explorer.

The code was :

var docStyle = document.getElementById("divAddPartnerAndProjectEntities").style;
docStyle.top = e.clientY;
docStyle.left = e.clientX-5;
docStyle .style.display = "";
And the simple solution is, append “px” at the end to work with other browsers.
and final code is:
var docStyle = document.getElementById("divAddPartnerAndProjectEntities").style;
docStyle.top = e.clientY+"px";
docStyle.left = e.clientX-5+"px";
docStyle .style.display = "";

Very Simple right ? 🙂

Highlight Current field using JQuery

Author posted by Jitendra on Posted on under category Categories HTML and tagged as Tags , , , with 1 Comment on Highlight Current field using JQuery

Write below HTML code :

This will create two text boxes.

<form>
	<div>
		<label for="Name">Name:</label>
		<input name="Name" type="text"></input>
	</div>
	<div>
		<label for="Email">Email:</label>
		<input name="Email" type="text"></input>
	</div>
</form>

Using jQuery, we can watch for an event where an input form comes into focus:

Add link to JQuery file in script tag as shown in below line:

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" />

Now, add below CSS in document.

div.curFocus {
background: #fdecb2;
}

Then at last write JQuery / javascript code on focus event and blur event (opposite of focus event in javascript ) .

$(document).ready(function(){

$("input").focus(function() {

$(this).parent().addClass("curFocus")

});

$("input").blur(function() {

$(this).parent().removeClass("curFocus")

});

});

We are using the advantage of jquery of adding and removing the CSS class. we cannot left blank to CSS class, as it may remove the existing other class from the tag.

$(document).ready(function(){

This line causes the execution of jquery after complete loading of page.

Output:

Selecting field using jquery
Selecting field using jquery

View Demo