Posts

Showing posts with the label JQuery

Asynchronous Javascript & jQuery Deferred Why?

Using jQuery Deferred In this post I'll try to cover an overview of promises and deferred. Further how to use them in nodejs. Define Deferred? Google Define: Put off (an action or event) to a later time; postpone Deferred in javascript? Javsacript being an event driven scripting [and a developing programming] language, there is obvious need for developers to defer things awaiting events. For ex: window.addEventListner("load", function () { console.log("Defer my execution till window load"); }, false); $.ajax({ url: 'data.html', success: function () { console.log("Defer my execution till ajax load is successful") }, error: function () { console.log("Defer my execution till ajax load fails") } }); So? This is nothing unusual!!! Ya, obviously it is nothing unusual and obviously a beginner level fact. Deferred: As a programming paradigm, is a design pattern which solves the problem of code nea...

Interesting Javascript Facts

Wishes to the web development world :) In the past 2 to 3 months I had chance to know about loads & loads of innovative JS Libraries All of them made me wonder "Is there a thing that we can't do in JS?" I wish to share some facts which got me mad in to this language & very beginnerish ;) What is {} + []? As soon as I saw this question my reply was "[object Object]" But the real answer was 0 :O Couldn't get any good guess on this, so posted @stackoverflow And I myself couldn't believe I missed it :P {} => Empty Block Scope & +[] => 0 So, cometh thy answer :) Some more of the same kind {} + {} = NaN [] + [] = "" [] + {} = "[object Object]" Why obj === +obj? I found this @ the source of Backbone.js I was wondering why should they check JS number type in such a way? Once again I got back to Stackoverflow The reply once again stunned me up :D It was to save the...

HTML Input Place Holder

A Simple way to implement placeholder in a Input Field. Although HTML 5 by default provides placeholders[placeholder attribute], it falls short in Cross Browser Compatibility Construct A Simple Form Username: Let's Implement Placeholders Now [With jQuery] Change the HTML To HTML: Username Result Username Apply CSS and Overlay placeholder over Input Element CSS: .place-holder { position:relative; left:-245px; color:#AAA; z-index:1; } .name-field { width:250px; background:#FFF; z-index:0; } Result Username Handle Focus and Blur Event :) jQuery: $().ready(function () { function hideHolder() { $('.place-holder').hide(); } function showHolder() { if($('.name-field').val() == '') { $('.place-holder').show() } } $('.name-field').focus(hideHolder); $('.name-field').blur(showHolder); $('.place-holder').click(function () { $('.name-field').trigger('focus'); }); }); ...

Abt jquery drilldown

It was a boring weekend once again and I wished to author a jquery plugin for drilldown operation. Atlast I did it and commited in GIT Link to Git Repo Really awesome job by jquery team. I never felt that it is difficult to create a plugin. It was full of fun and my day passed by in a useful way :) Abt my plugin, This is a plugin which helps to implement drill down in jquery. To start working on it u need jquery latest version U need to include either jquery.drilldown.min.js/jquery.drilldown.js in your javascript src Usage: $(selector).drillDown({ animate: true; // Default 'true' *Not required container : ".divname|#spanName" //No Default values *Required listParam : "list" // Default 'list', see the demo for explanation direction : 0 // Default 0->vertical, 1->horizontal callBack : test // Default 'null', Call back function to be used on selection }); Styles: Elements inside Drill Down are li elements with c...