Jquery fundas

This week was all about Jquery...!

Though I've been using it in bits and pieces, did not get a chance to do something so exhaustive in jquery till now. 

So here are few things, which I learned this week..I'll keep updating this post every now and then..
To add a new element into an existing DIV, use append/ prepend:

To Make AJAX calls :
    type : "POST",
    url : '/sticky',
    dataType : "html", //Can be txt/json
    data: {contentToSave: event.currentTarget.innerHTML,contentToSaveId: event.currentTarget.id},
    success: function(data) {
        //Do Something
    error : function() {
            alert("Oops, No donuts!");

To make an editable DIV using HTML5:

To make all DIVs editable that start with a pattern using regex:
Note: In this case, all DIVs that starts with id "note_" will be made editable

To add a DIV dynamically into another DIV:
", {"class": "someClassName",
           text: "someText",

To make a DIV draggable/Droppable:
 $("#someDIV").draggable({ cursor: "move"});   

 $( "#droppable").droppable({
    drop: function( event, ui ) {               
        //Some operation when dropping the DIV

To get the object content on mouseleave/ mouse out event:
$("."+className).mouseleave(function(event) {       
    event.currentTarget.innerHTML // Gives the innerHTML of the DIV, in this case
    event.currentTarget.id //Gives the Id of the element

To add a CSS dynamically:
$("#someObject").css( {
    position: 'absolute',
    zIndex: 5000,
    left: topVal,
    top: leftVal

No comments:

Tired of seeing that 500 Bad gateway error while deploying a Springboot application in AWS...?

By default, Spring Boot applications will listen on port 8080. Elastic Beanstalk assumes that the application will listen on port 5000. Th...