create placeholder in contenteditable div

HTML

<div class="test" placeholder="Type something..." contenteditable="true"></div>


Jquery

jQuery(function($){
    $(".test").focusout(function(){
        var element = $(this);      
        if (!element.text().replace(" ", "").length) {
            element.empty();
        }
    });
});


CSS

.test {
    width: 500px;
    height: 70px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    padding: 5px;
}

.test[placeholder]:empty:before {
    content: attr(placeholder);
   
}

.test[placeholder]:empty:focus:before {
    content: "";
}

http://jsfiddle.net/RZZ6X/9/

jquery datatables pass server parameters

  $('#tbldetail').dataTable({
                "aLengthMenu": [[10, 25, 50,100, -1], [10, 25, 50,100,"All"]],
                "bFilter": false,
                "bProcessing":true,
                "bServerSide":true,
                "bDestroy": true,
                "bSort": false,
                "sAjaxSource":'/detail',
                "fnServerParams":function (aoData) {

                   aoData.push({"name":"starttime1","value":searchdata.starttime1});
                   aoData.push({"name":"starttime2","value":searchdata.starttime2});
           
                 
                },
                "aoColumnDefs": [
                                 { "sType": "date", "aTargets":[0]},
                                 { "sWidth": "60px", "aTargets":[1] }
                               
                ],
                "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
             
                   
                 },
                "columns":[
                    { "data":"starttime1"},
                    { "data":"starttime2" }
                ]
           });

Get TimeZone in javascript

Intl.DateTimeFormat().resolvedOptions().timeZone

How to stop script execution in Developers console

if (window.webkitURL) {
    var ish, _call = Function.prototype.call;
    Function.prototype.call = function () { 

       //Could be wrapped in a setter for _commandLineAPI, to redefine only when the user started typing.
        if (arguments.length > 0 && this.name === "evaluate" && arguments [0].constructor.name === "InjectedScriptHost") { //If thisArg is the evaluate function and the arg0 is the ISH
            ish = arguments[0];
            ish.evaluate = function (e) { //Redefine the evaluation behaviour
                throw new Error ('Rejected evaluation of: \n\'' + e.split ('\n').slice(1,-1).join ("\n") + '\'');
            };
            Function.prototype.call = _call; //Reset the Function.prototype.call
            return _call.apply(this, arguments);  
        }
    };
}

css vertical text

CSS

.vertical-text {
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-ms-transform-origin: left top 0;
-moz-transform-origin: left top 0;
-webkit-transform-origin: left top 0;
transform-origin: left top 0;
background: #E23737;
color: #fff;
margin-left: 40px;
padding: 10px;
border: 1px solid #ccc;
text-transform: uppercase;
border: 1px solid #B52C2C;
text-transform: 1px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 2px -2px 0px rgba(0, 0, 0, 0.1);
float: left;
}

HTML

<div class="verticle-text">pranaysonisoft.blogspot.com</div>

jquery create elements on the fly

$("<div/>",{
    "class" : "someelement",
    // .. you can go on and add properties
    "css" : {
        "color" : "red"
    },
    "click" : function(){
        alert("you just clicked me!!");
    },
    "data" : {
       "foo" : "bar"
    }
}).appendTo("#container");

create div and set id ,class,css ,event on the fly

This is the way to go if youre setting multiple properties. Much cleaner than passing in a long string.

I would like to have feedback from my blog readers. 

Your valuable feedback, question, or comments about this article 

are always welcome.

private in javascript

var CONFIG = (function() { var privates = { 'MY_CONST': '1', 'ANOTHER_CONST': '2' }; return { get: function(name) { return privates[name]; } }; })(); alert('MY_CONST: ' + CONFIG.get('MY_CONST')); // 1 CONFIG.MY_CONST = '2'; alert('MY_CONST: ' + CONFIG.get('MY_CONST')); // 1 CONFIG.privates.MY_CONST = '2'; // error alert('MY_CONST: ' + CONFIG.get('MY_CONST')); // 1





I would like to have feedback from my blog readers. Your valuable feedback, question,
or comments about this article are always welcome.

using selector cache to avoid requery

 <script>

    /* Title: selector cache

        Description: using selector cache to avoid requery

   */


    // antipattern

    $('.list-item').click(function () {

        $('.photo').hide();

    });


    // preferred

    var $photo;

    // prefix the cache with $ to help identify it as a selector cache later

    $('.list-item').click(function () {

        $photo = $photo || $('.photo');

        $photo.hide();

    });
</script>










I hope you will enjoy the tips while playing with JavaScript.I would like to have feedback from my blog readers. Your valuable feedback, question, or comments about this article 
are always welcome.

jquery patterns $.data

<script>
    /* Title: data

     * Description: pattern and antipattern of using data

    */


    // antipattern

    $(elem).data(key, value);



    // preferred

    $.data(elem, key, value);
</script>





I hope you will enjoy the tips while playing with JavaScript.I would like to have feedbackfrom my blog readers. Your valuable feedback, question, or comments about this article 

are always welcome.

jquery patterns append

<script>
    /* Title: append

    * Description: use string concatenate and set innerHTML

    */

    // antipattern

    // appending inside

    $.each(reallyLongArray, function (count, item) {

        var newLI = '<li>' + item + '</li>';

        $('#ballers').append(newLI);

    });



    // documentFragment off-DOM

    var frag = document.createDocumentFragment();

    $.each(reallyLongArray, function (count, item) {

        var newLI = $('<li>' + item + '</li>');

        frag.appendChild(newLI[0]);

    });

    $('#ballers')[0].appendChild(frag);



    // string concatenate and set innerHTML

    var myhtml = '';

    $.each(reallyLongArray, function (count, item) {

        myhtml += '<li>' + item + '</li>';

    });

    $('#ballers').html(myhtml);
</script>




I hope you will enjoy the tips while playing with JavaScript. I would like to have feedbackfrom my blog readers. Your valuable feedback, question, or comments about this article 

are always welcome.