Wednesday, 26 July 2017

Prevent Bootstrap Modal from disappearing when clicking outside or pressing escape?

If using JavaScript then:
<script>
$('#myModal').modal({
    backdrop: 'static',
    keyboard: false
})
</script>
and if HTML:

<a data-controls-modal="your_div_id" data-backdrop="static" data-keyboard="false" href="#">

Monday, 10 July 2017

short code for js in netbeans shortcut

Code 1:  

Type sc and press enter for script code 

Output:

<script type="text/javascript">      </script>

Code 2: 

Type d and press enter for document ready 

Output: 

<script type="text/javascript">
     $(document).ready(function(e) {   

       });
 </script>

Code 3: 

Type p and press enter for ajax post 

Output:

<script type="text/javascript">    
 $(document).ready(function (e) {  
       var post_data = {};       
        $.post("", post_data, function (res) {   
       });  
   }); 
</script>

Monday, 3 July 2017

Click button copy to clipboard using jQuery

 

// html code here 


<div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
                <br/>
                <h3 class="text-center">Capture Feedback</h3>
                <br/>
                <div class="col-md-8 col-sm-8 col-xs-12 col-md-offset-2 col-sm-offset-2">
                    <div class="col-md-8 col-sm-8 col-xs-12">
                        <input type="text" class="custom-url" placeholder="company rating link" value="https://www.google.co.in/" name="" id="copyTarget">
                    </div>
                    <div class="col-md-4 col-sm-4 col-xs-12">
                        <button class="custom-url color-red" id="copyButton">Copy URL</button>
                    </div>

                </div>
            </div>

        </div>

// Script code here 


<script type="text/javascript">
 document.getElementById("copyButton").addEventListener("click", function() {
    copyToClipboard(document.getElementById("copyTarget"));
    alert("Text copied");
});

function copyToClipboard(elem) {
 // create hidden text element, if it doesn't already exist
    var targetId = "_hiddenCopyText_";
    var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
    var origSelectionStart, origSelectionEnd;
    if (isInput) {
        // can just use the original source element for the selection and copy
        target = elem;
        origSelectionStart = elem.selectionStart;
        origSelectionEnd = elem.selectionEnd;
    } else {
        // must use a temporary form element for the selection and copy
        target = document.getElementById(targetId);
        if (!target) {
            var target = document.createElement("textarea");
            target.style.position = "absolute";
            target.style.left = "-9999px";
            target.style.top = "0";
            target.id = targetId;
            document.body.appendChild(target);
        }
        target.textContent = elem.textContent;
    }
    // select the content
    var currentFocus = document.activeElement;
    target.focus();
    target.setSelectionRange(0, target.value.length);
   
    // copy the selection
    var succeed;
    try {
     succeed = document.execCommand("copy");
    } catch(e) {
        succeed = false;
    }
    // restore original focus
    if (currentFocus && typeof currentFocus.focus === "function") {
        currentFocus.focus();
    }
   
    if (isInput) {
        // restore prior selection
        elem.setSelectionRange(origSelectionStart, origSelectionEnd);
    } else {
        // clear temporary content
        target.textContent = "";
    }
    return succeed;
}
</script>

Friday, 30 June 2017

Client Side Validation in Ckeditor or CKeditor Validation

Note: include JQuery  file and JQuery validation files

STEP NO : 1

<form action="#" method="post" id="formId">
<label>Description</label><textarea name="blog_description" class="required" id="editor1"></textarea>
            <script>
                CKEDITOR.replace('editor1');
            </script>

<input name="submit" type="submit" value="Submit Job" class="button" id="job-submit"/>
<input name="clear" type="reset" value="Clear Form"  class="button"/>
</form>

Thursday, 22 June 2017

How to get post image in worpdress or How to get post thumbnail in wordpress

//Default WordPress


// Thumbnail (150 x 150 hard cropped)


<?php    the_post_thumbnail( 'thumbnail' );       ?>

// Medium resolution (300 x 300 max height 300px)  
<?php the_post_thumbnail( 'medium' ); ?>  

 // Medium Large (added in WP 4.4) resolution (768 x 0 infinite height)    
<?php the_post_thumbnail( 'medium_large' ); ?> 

// Large resolution (1024 x 1024 max height 1024px)
<?php the_post_thumbnail( 'large' );  ?>    

// Full resolution (original size uploaded)
<?php the_post_thumbnail( 'full' );  ?>      


//With WooCommerce


// Shop thumbnail (180 x 180 hard cropped)


<?php the_post_thumbnail( 'shop_thumbnail' ); ?>  

// Shop catalog (300 x 300 hard cropped)
<?php the_post_thumbnail( 'shop_catalog' );  ?>   

 // Shop single (600 x 600 hard cropped)
<?php the_post_thumbnail( 'shop_single' ); ?>    

Tuesday, 20 June 2017

How to change dynamic background color

Script for change background color : Dynamic color 


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
    jQuery(function ($) {
        function changeColor(selector, colors, time) {
            var curCol = 0,
                    timer = setInterval(function () {
                        if (curCol === colors.length)
                            curCol = 0;
                        $(selector).css("background", colors[curCol]);
                        curCol++;
                    }, time);
        }
        $(window).load(function () {
            changeColor("#wrap", ["linear-gradient(to right, rgb(241, 242, 181), rgb(19, 80, 88))", "linear-gradient(to right, rgb(209, 145, 60), rgb(255, 209, 148))", "linear-gradient(to right, rgb(254, 172, 94), rgb(199, 121, 208), rgb(75, 192, 200))", "linear-gradient(to right, rgb(123, 67, 151), rgb(220, 36, 48))","linear-gradient(to right, rgb(112, 225, 245), rgb(255, 209, 148))","linear-gradient(to right, rgb(64, 59, 74), rgb(231, 233, 187))","linear-gradient(to right, rgb(58, 28, 113), rgb(215, 109, 119), rgb(255, 175, 123))","url('https://www.planwallpaper.com/static/images/Seamless-Polygon-Backgrounds-Vol2-full_Kfb2t3Q.jpg')"], 3000);
        });
    });
</script>