Preview an image before it is uploaded.

manjeet is id input type image , you want to show "image"

onchange="document.getElementById('manjeet').src = window.URL.createObjectURL(this.files[0])"

How to integration Razorpay paymet method .

<button id="rzp-button1"><p>Pay with Razorpay</p>
</style>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
</script>
<script>
var options = {
    "key": "rzp_live_dk2jtJQUNH81P5",
    "amount": "10000", //  = INR 1
    "name": "Manjeet Kashyap",
    "description": "A Wild Sheep Chase is the third novel by Japanese author Haruki Murakami",
    "image": "https://cdn.razorpay.com/logos/7K3b6d18wHwKzL_medium.png",
    "handler": function (response){
        alert(response.razorpay_payment_id);
    },
    "prefill": {
        "name": "Gaurav Kumar",
        "email": "gaurav.kumar@razorpay.com"
    },
    "notes": {
        "address": "note value"
    },
    "theme": {
        "color": "#6A59CE"
    }
};
var rzp1 = new Razorpay(options);
document.getElementById('rzp-button1').onclick = function(e){
    rzp1.open();
    e.preventDefault();
}
</script>

Round off decimal values in jquery using toFixed funtion.

Round off decimal values in jquery : 

Before Output : 10

  var total = 10;

  var total = total.toFixed(2);

After useing function :  10.00 

Javascript function to convert color names to hex codes

convert hex codes to color name : 

Step: 1 create manjeet.js file

var ntc = {

  init: function() {

    var color, rgb, hsl;

    for(var i = 0; i < ntc.names.length; i++)

    {

      color = "#" + ntc.names[i][0];

      rgb = ntc.rgb(color);

      hsl = ntc.hsl(color);

      ntc.names[i].push(rgb[0], rgb[1], rgb[2], hsl[0], hsl[1], hsl[2]);

    }

  },

  name: function(color) {

    color = color.toUpperCase();

    if(color.length < 3 || color.length > 7)

      return ["#000000", "Invalid Color: " + color, false];

    if(color.length % 3 == 0)

      color = "#" + color;

    if(color.length == 4)

      color = "#" + color.substr(1, 1) + color.substr(1, 1) + color.substr(2, 1) + color.substr(2, 1) + color.substr(3, 1) + color.substr(3, 1);

    var rgb = ntc.rgb(color);

    var r = rgb[0], g = rgb[1], b = rgb[2];

    var hsl = ntc.hsl(color);

    var h = hsl[0], s = hsl[1], l = hsl[2];

    var ndf1 = 0; ndf2 = 0; ndf = 0;

    var cl = -1, df = -1;

    for(var i = 0; i < ntc.names.length; i++)

    {

      if(color == "#" + ntc.names[i][0])

        return ["#" + ntc.names[i][0], ntc.names[i][1], true];

      ndf1 = Math.pow(r - ntc.names[i][2], 2) + Math.pow(g - ntc.names[i][3], 2) + Math.pow(b - ntc.names[i][4], 2);

      ndf2 = Math.pow(h - ntc.names[i][5], 2) + Math.pow(s - ntc.names[i][6], 2) + Math.pow(l - ntc.names[i][7], 2);

      ndf = ndf1 + ndf2 * 2;

      if(df < 0 || df > ndf)

      {

        df = ndf;

        cl = i;

      }

    }

    return (cl < 0 ? ["#000000", "Invalid Color: " + color, false] : ["#" + ntc.names[cl][0], ntc.names[cl][1], false]);

  },

  // adopted from: Farbtastic 1.2

  // http://acko.net/dev/farbtastic

  hsl: function (color) {

    var rgb = [parseInt('0x' + color.substring(1, 3)) / 255, parseInt('0x' + color.substring(3, 5)) / 255, parseInt('0x' + color.substring(5, 7)) / 255];

    var min, max, delta, h, s, l;

    var r = rgb[0], g = rgb[1], b = rgb[2];

    min = Math.min(r, Math.min(g, b));

    max = Math.max(r, Math.max(g, b));

    delta = max - min;

    l = (min + max) / 2;

    s = 0;

    if(l > 0 && l < 1)

      s = delta / (l < 0.5 ? (2 * l) : (2 - 2 * l));

    h = 0;

    if(delta > 0)

    {

      if (max == r && max != g) h += (g - b) / delta;

      if (max == g && max != b) h += (2 + (b - r) / delta);

      if (max == b && max != r) h += (4 + (r - g) / delta);

      h /= 6;

    }

    return [parseInt(h * 255), parseInt(s * 255), parseInt(l * 255)];

  },

  // adopted from: Farbtastic 1.2

  // http://acko.net/dev/farbtastic

  rgb: function(color) {

    return [parseInt('0x' + color.substring(1, 3)), parseInt('0x' + color.substring(3, 5)),  parseInt('0x' + color.substring(5, 7))];

  },

  names: [

["000000", "Black"],

["000080", "Navy Blue"],

["0000C8", "Dark Blue"],

["0000FF", "Blue"],

["000741", "Stratos"],

["EB9373", "Apricot"],

["EBC2AF", "Zinnwaldite"],

["ECA927", "Fuel Yellow"],

["FFFFFF", "White"]

]

}

ntc.init();

    /* you can use following code in js */

 

    var n_match  = ntc.name("#6195ED");

    n_name       = n_match[1]; // This is the text string for the name of the match

    alert(n_name);

Load more button in jquery (listing)

Load more button in jquery (listing)

$rowperpage = 6;

$allcount = $allcount_fetch['allcount'];   // all record

 <div class="post" id="post_(parameter)">

content here 

</div>

            <input type="hidden" id="row" value="0">
            <input type="hidden" id="all" value="<?php echo $allcount; ?>">

<section class="blog_posts_view">
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<button type="button" class="btn hvr-bounce-to-right load-more">view more</button>
</div>
</div>
</div>
</section>

<script>
$(document).ready(function(){
    $('.load-more').click(function(){
        var row = Number($('#row').val());
        var allcount = Number($('#all').val());
        row = row + 6;
        if(row <= allcount){
            $("#row").val(row);
            $.ajax({
                url: 'getData.php',
                type: 'post',
                data: {row:row},
                beforeSend:function(){
                    $(".load-more").text("Loading...");
                },
                success: function(response){
                    setTimeout(function() {
                        $(".post:last").after(response).show().fadeIn("slow");
                        var rowno = row + 6;
                        if(rowno > allcount){
$('.load-more').css("display","none");
                            //$('.load-more').text("Hide Post");
                           // $('.load-more').css("background","darkorchid");
                        }else{
                            $(".load-more").text("View more");
                        }
                    }, 2000);
                }
            });
        }else{
            $('.load-more').text("Loading...");
            setTimeout(function() {
                $('.post:nth-child(6)').nextAll('.post').remove().fadeIn("slow");
                $("#row").val(0);
                $('.load-more').text("View more");
                $('.load-more').css("background","#15a9ce");
            }, 2000);
        }
    });
});

</script>

Jquery POST fetching data on keyup

Jquery POST fetching data on keyup :


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

<input type="text" name="search" id="search"/>
<br />
<div class="result"></div>

<script>
    $(document).ready(function() {
        $(document).on('keyup', 'input#search', function() {
            if($(this).val().length > 0) {
                $.post('gettest.php', {"search":$(this).val()}, function(data) {
                    $('div.result').html(data);
                });
            }
        });
    });

</script>

Data table search in laravel

<script src="<a href="https://code.jquery.com/jquery-3.3.1.js">https://code.jquery.com/jquery-3.3.1.js</a>" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>

 <script> $("#search").keyup(function(){ _this = this; $.each($(".table1 tbody tr"), function() { if($(this).text().toLowerCase().indexOf($(_this).val().toLowerCase()) === -1) $(this).hide(); else $(this).show(); }); }); </script>


<input type="text" autocomplete="off" id="search" class="form-control input-lg" placeholder="Enter RESERVATIONS Id, firstname, lastname, Email Here">

Create custom post type in wordpress.

Create custom post type in wordpress.Please paste the code in finction.php


function custom_post_type() {

// Set UI labels for Custom Post Type
    $labels = array(
        'name'                => _x( 'Question', 'Post Type General Name', 'twentythirteen' ),
        'singular_name'       => _x( 'Question', 'Post Type Singular Name', 'twentythirteen' ),
        'menu_name'           => __( 'Questions', 'twentythirteen' ),
        'parent_item_colon'   => __( 'Parent Movie', 'twentythirteen' ),
        'all_items'           => __( 'All Questions', 'twentythirteen' ),
        'view_item'           => __( 'View Question', 'twentythirteen' ),
        'add_new_item'        => __( 'Add New Question', 'twentythirteen' ),
        'add_new'             => __( 'Add New', 'twentythirteen' ),
        'edit_item'           => __( 'Edit Question', 'twentythirteen' ),
        'update_item'         => __( 'Update Question', 'twentythirteen' ),
        'search_items'        => __( 'Search Question', 'twentythirteen' ),
        'not_found'           => __( 'Not Found', 'twentythirteen' ),
        'not_found_in_trash'  => __( 'Not found in Trash', 'twentythirteen' ),
    );
   
// Set other options for Custom Post Type
   
    $args = array(
        'label'               => __( 'Questions', 'twentythirteen' ),
        'description'         => __( 'Questions and reviews', 'twentythirteen' ),
        'labels'              => $labels,
        // Features this CPT supports in Post Editor
        'supports'            => array( 'title', 'author',),
        // You can associate this CPT with a taxonomy or custom taxonomy.
        'taxonomies'          => array( 'genres' ),
        /* A hierarchical CPT is like Pages and can have
        * Parent and child items. A non-hierarchical CPT
        * is like Posts.
        */
        'hierarchical'        => false,
        'public'              => true,
        'show_ui'             => true,
        'show_in_menu'        => true,
        'show_in_nav_menus'   => true,
        'show_in_admin_bar'   => true,
        'menu_position'       => 5,
        'can_export'          => true,
        'has_archive'         => true,
        'exclude_from_search' => false,
        'publicly_queryable'  => true,
        'capability_type'     => 'page',
    );
   
    // Registering your Custom Post Type
    register_post_type( 'Questions', $args );

}


/* Adds a box to the main column on the Post and Page edit screens */
function dynamic_add_custom_box() {
          add_meta_box(
        'dynamic_sectionid',
        'Right Answer',
        'dynamic_inner_custom_box',
        'questions',
        'advanced',
        'high'
    );
}

How to upload multiple image in php

Step : (1) Create index.phpfile paste the code .

<!DOCTYPE html>
<html>
<head>
<title>Upload Multiple Images Using jquery and PHP</title>
<!-------Including jQuery from Google ------>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="script.js"></script>
<!------- Including CSS File ------>
<link rel="stylesheet" type="text/css" href="style.css">
<body>
<div id="maindiv">
<div id="formdiv">
<h2>Multiple Image Upload Form</h2>
<form enctype="multipart/form-data" action="" method="post">
First Field is Compulsory. Only JPEG,PNG,JPG Type Image Uploaded. Image Size Should Be Less Than 100KB.
<div id="filediv"><input name="file[]" type="file" id="file"/></div>
<input type="button" id="add_more" class="upload" value="Add More Files"/>
<input type="submit" value="Upload File" name="submit" id="upload" class="upload"/>
</form>
<!------- Including PHP Script here ------>
<?php include "manjeet.php"; ?>
</div>
</div>
</body>

</html>


Step : (2) Create manjeet.js file paste the code .

var abc = 0;     
$(document).ready(function() {

$('#add_more').click(function() {
$(this).before($("<div/>", {
id: 'filediv'
}).fadeIn('slow').append($("<input/>", {
name: 'file[]',
type: 'file',
id: 'file'
}), $("<br/><br/>")));
});

$('body').on('change', '#file', function() {
if (this.files && this.files[0]) {
abc += 1; // Incrementing global variable by 1.
var z = abc - 1;
var x = $(this).parent().find('#previewimg' + z).remove();
$(this).before("<div id='abcd" + abc + "' class='abcd'><img id='previewimg" + abc + "' src=''/></div>");
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
$(this).hide();
$("#abcd" + abc).append($("<img/>", {
id: 'img',
src: 'x.png',
alt: 'delete'
}).click(function() {
$(this).parent().parent().remove();
}));
}
});

function imageIsLoaded(e) {
$('#previewimg' + abc).attr('src', e.target.result);
};
$('#upload').click(function(e) {
var name = $(":file").val();
if (!name) {
alert("First Image Must Be Selected");
e.preventDefault();
}
});

});

Step : (3) Create manjeet.css file paste the code .

form{
background-color:#fff
}
#maindiv{
width:960px;
margin:10px auto;
padding:10px;
font-family:'Droid Sans',sans-serif
}
#formdiv{
width:500px;
float:left;
text-align:center
}
form{
padding:40px 20px;
box-shadow:0 0 10px;
border-radius:2px
}
h2{
margin-left:30px
}
.upload{
background-color:red;
border:1px solid red;
color:#fff;
border-radius:5px;
padding:10px;
text-shadow:1px 1px 0 green;
box-shadow:2px 2px 15px rgba(0,0,0,.75)
}
.upload:hover{
cursor:pointer;
background:#c20b0b;
border:1px solid #c20b0b;
box-shadow:0 0 5px rgba(0,0,0,.75)
}
#file{
color:green;
padding:5px;
border:1px dashed #123456;
background-color:#f9ffe5
}
#upload{
margin-left:45px
}
#noerror{
color:green;
text-align:left
}
#error{
color:red;
text-align:left
}
#img{
width:17px;
border:none;
height:17px;
margin-left:-20px;
margin-bottom:91px
}
.abcd{
text-align:center
}
.abcd img{
height:100px;
width:100px;
padding:5px;
border:1px solid #e8debd
}
b{
color:red

}


Step : (4) Create manjeet.php file paste the code .

<?php
if (isset($_POST['submit'])) {
$j = 0;     // Variable for indexing uploaded image.
$target_path = "/sumit/";     // Declaring Path for uploaded images.
for ($i = 0; $i < count($_FILES['file']['name']); $i++) {
// Loop to get individual element from the array
$validextensions = array("jpeg", "jpg", "png");      // Extensions which are allowed.
$ext = explode('.', basename($_FILES['file']['name'][$i]));   // Explode file name from dot(.)
$file_extension = end($ext); // Store extensions in the variable.
$target_path = $target_path . md5(uniqid()) . "." . $ext[count($ext) - 1];     // Set the target path with a new name of image.
$j = $j + 1;      // Increment the number of uploaded images according to the files in array.
if (($_FILES["file"]["size"][$i] < 100000)     // Approx. 100kb files can be uploaded.
&& in_array($file_extension, $validextensions)) {
if (move_uploaded_file($_FILES['file']['tmp_name'][$i], $target_path)) {
// If file moved to uploads folder.
echo $j. ').<span id="noerror">Image uploaded successfully!.</span><br/><br/>';
} else {     //  If File Was Not Moved.
echo $j. ').<span id="error">please try again!.</span><br/><br/>';
}
} else {     //   If File Size And File Type Was Incorrect.
echo $j. ').<span id="error">***Invalid file Size or Type***</span><br/><br/>';
}
}
}

?>

Disable Admin Bar in wordpress.

Paste this code in your theme’s functions.php file

add_action('after_setup_theme', 'remove_admin_bar');

function remove_admin_bar() {

if (!current_user_can('administrator') && !is_admin()) {

  show_admin_bar(false);

}

}




If you want to disable it for all users, then simply put use this code in your theme’s functions.php file










  show_admin_bar(false);