Top Questions

  • 2.11 Years

    • Category : Jquery
    • Location : Chandigarh, India
    • Posted On : Feb 4, 2019

    If you want to create a web page form like contact form or any other form text field. if you want to allow only numeric letters like (0-9)

    <input name="number">
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    
    <script type="text/javascript">
    // Numeric only control handler
    jQuery.fn.ForceNumericOnly =
    function()
    {
        return this.each(function()
        {
            $(this).keydown(function(e)
            {
                var key = e.charCode || e.keyCode || 0;
                // allow backspace, tab, delete, enter, arrows, numbers and keypad numbers ONLY
                // home, end, period, and numpad decimal
                return (
                    key == 8 || 
                    key == 9 ||
                    key == 13 ||
                    key == 46 ||
                    key == 110 ||
                    key == 190 ||
                    (key >= 35 && key <= 40) ||
                    (key >= 48 && key <= 57) ||
                    (key >= 96 && key <= 105));
            });
        });
    };
    $('input[name="number"]').ForceNumericOnly();
    </script>
  • 5.11 Years

    • Category : Java
    • Location : Mohali
    • Posted On : Aug 8, 2018

    Here are two scenarios where the keyup event will not get fired: The user drags text into the textarea. The user copy-paste text in the textarea with a right click (contextual menu).

    Use the HTML5 input event instead for a more robust solution:

    // jquery
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    
    // html
    <div class="control">
    	<textarea spellcheck="true" maxlength="200" name="question" id="question" class="input-textarea required-entry" cols="5" rows="8" data-validate="{required:true}" aria-required="true"></textarea>
      <div class="limittext"><span class="charnum">200 Characters left</span></div>
    </div>
    
    <script type="text/javascript">
    jQuery(document).ready(function() {
      // edit area start
      var maxLength = 200;
      var textarea_id = "question";
      // edit area end
    
      var html='<span style="color:red;">'+ maxLength + ' characters allowed, excess characters trimmed</span>';
      jQuery("#"+textarea_id).on('input',function(){
          var length = this.value.length;
          if (length >= maxLength) {
            this.value = this.value.substring(0, maxLength);
            jQuery(this).next(".limittext").html(html);
          } else {
            var count=maxLength-length;
            jQuery(this).next(".limittext").html('<span class="charnum">' +count+' Characters left</span>');
          }
      });
    });
    </script>
  • 5.11 Years

    • Category : Php
    • Location : Mohali
    • Posted On : Jan 10, 2018

    Now generate 'A5' sized PDF from html and display it view. The PDF name will be 'simple_any_name.pdf'.

    <?php
     // INCLUDE THE phpToPDF.php FILE
    require("phpToPDF.php"); 
    
    // PUT YOUR HTML IN A VARIABLE
    $my_html="<HTML>
    <h2>Test HTML 02</h2><br><br>
    <div style=\"display:block; padding:20px; border:2pt solid:#FE9A2E; background-color:#F6E3CE; font-weight:bold;\">
    phpToPDF is pretty cool! <br><br>
    [This was orange, but I set the PDF option to monochrome (Black & White)]
    </div><br><br>
    For more examples, visit us here --> https://www.dorcode.com/
    </HTML>";
    
    // SET YOUR PDF OPTIONS -- FOR ALL AVAILABLE OPTIONS, VISIT HERE:  http://phptopdf.com/documentation/
    $pdf_options = array(
      "source_type" => 'html',
      "source" => $my_html,
      "action" => 'view',
      "color" => 'monochrome',
      "page_orientation" => 'landscape',
      "file_name" => 'simple_any_name.pdf');
    
    // CALL THE phpToPDF FUNCTION WITH THE OPTIONS SET ABOVE
    phptopdf($pdf_options);
    
    ?> 
     
  • 5.11 Years

    • Category : Html
    • Location : Mohali
    • Posted On : Dec 19, 2017

    This is another Client Side Validation strategy No JavaScript or jQuery required, Thanks to HTML5 in light of the fact that approvals should now be possible utilizing HTML5 without coding of javascript or any server side dialect, utilizing HTML5 you can approve frames with design, Forms must be approve either utilizing customer side or server side since it causes you to gather redress information or substantial shape esteems from the clients, you can't trust clients aimlessly, how about we see it.

    pattern="[A-Za-z] " accepts only capital or small letters. 
    <label>Name : (letters only)*</label>
    <input type="text" pattern="[A-Za-z] " title="only letters" required />
    
    pattern="[a-z0-9._% -] @[a-z0-9.-] \.[a-z]{2,4}$" accepts valid email address 
    <label>E-mail : (xyz@zyx.com)*</label>
    <input type="email" pattern="[a-z0-9._% -] @[a-z0-9.-] \.[a-z]{2,4}$" title="xyz@something.com" required />
    
    pattern="https?://. " required title="https://dorcode.com" accepts valid web url starting with http://. 
    <label>website : (https://dorcode.com)*</label>
    <input type="url"  pattern="https?://. " title="https://dorcode.com" required />
    
    pattern="[0-9] " accepts only numbers 0, 1, 2.... 
    <label>pin code : (numbers only)</label>
    <input type="text" pattern="[0-9] " title="numbers only" required />
    
    pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" accepts one number one upper and lower case letters with 8 or more chars. 
    <label>password : (at least 6 chars)</label>
    <input type="password" pattern=".{6,}" title="Six or more characters" required />
    
    pattern="^\d{10}$" accepts only numeric values with 10 digit. 
    <label>phone no : (10 chars)</label>
    <input type="tel" pattern="^\d{10}$" title="10 numeric characters only" required />
    
    pattern="^[a-zA-Z][a-zA-Z0-9-_\.]{5,12}$" accepts alphanumeric values letters and digits. 
     
  • 2.9 Years

    • Category : Jquery
    • Location : Chandigarh
    • Posted On : Sep 20, 2017

    Display countdown timer using jQuery.

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.min.js" ></script>
    
    /*html*/
    
    <span data-countdown="2017-09-25 12:10:01" ></span> // end date add here
    
    
    /*Jquery*/
    
    setTimeout(function(){
                    initCountDown()
    }, 300);            
    function initCountDown(){
        $('[data-countdown]').each(function() {
            var $this = $(this), finalDate = $(this).data('countdown');
            $this.countdown(finalDate, function(event) {
                $this.html(event.strftime('%D days %H:%M:%S'));
            });
        });
    }  
     
  • 5.11 Years

    • Category : Php
    • Location : Mohali
    • Posted On : Aug 11, 2017

    WordPress offers built-in functionality for navigating through posts. Theme developers can use simple default wordpress pagination function or other pagination function for better customize.

    // Create table in mysql
    CREATE TABLE `your_table_name` (
      `id` int(11) NOT NULL AUTO_INCREMENT,
      `title` varchar(200) NOT NULL,
      `addtime` int(20) NOT NULL,
      PRIMARY KEY (`id`)
    ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
    
    // Insert table data
    INSERT INTO `your_table_name` (`id`, `title`, `addtime`) VALUES
    (1, 'test', 1299446702);	// addtime is timestamp
    
    
    
    <?php
    // insert this code where your want to add pagination
    // ----------- code start -----------
    
    $table_name =  "your_table_name"; 	// enter your table name
    $item_per_page=5;					// enter number 
    
    $all = $wpdb->get_row( "SELECT count(*) as total FROM {$table_name} WHERE 1=1", ARRAY_A );
    $page_number = (get_query_var('page')) ? get_query_var('page') : 1;
    $offset = ($page_number - 1) * $item_per_page;
    $data = $wpdb->get_results( "SELECT * FROM {$table_name} WHERE 1=1 ORDER BY id DESC LIMIT $offset,$item_per_page", ARRAY_A );
    $cou=$page_number*$item_per_page;
    ?>
    
    <h2>Results <?=$page_number ?>-<?=($cou>$all['total'])?$all['total']:$cou ?> of <?=$all['total'] ?></h2>
    <ul class="pagination">
    	<?php echo pagination($all['total'], $item_per_page, $page_number, site_url()."/your-page-name/?page=%d"); ?>
    </ul>
    
    
    <?php
    foreach ($data as $one) {
    ?>
    		<?=$one['id'] ?> <br />
    		<?=$one['title'] ?>
    <?php
    }
    ?>
    // ----------- code end -----------
    
    
    // add function.php in wordpress----------- code start ----
    
    function pagination($item_count, $limit, $cur_page, $link)
    {
           $page_count = ceil($item_count/$limit);
           $current_range = array(($cur_page-2 < 1 ? 1 : $cur_page-2), ($cur_page 2 > $page_count ? $page_count : $cur_page 2));
    
           // First and Last pages
           $first_page = $cur_page > 3 ? '<a href="'.sprintf($link, '1').'">1</a>'.($cur_page < 5 ? ', ' : ' ... ') : null;
           $last_page = $cur_page < $page_count-2 ? ($cur_page > $page_count-4 ? ', ' : ' ... ').'<a href="'.sprintf($link, $page_count).'">'.$page_count.'</a>' : null;
    
           // Previous and next page
           $previous_page = $cur_page > 1 ? '<a href="'.sprintf($link, ($cur_page-1)).'">&lt;&lt;</a>  ' : null;
           $next_page = $cur_page < $page_count ? '  <a href="'.sprintf($link, ($cur_page 1)).'">&gt;&gt;</a>' : null;
    
           // Display pages that are in range
           for ($x=$current_range[0];$x <= $current_range[1];   $x)
                   $pages[] = '<a href="'.sprintf($link, $x).'">'.($x == $cur_page ? '<strong>'.$x.'</strong>' : $x).'</a>';
    
           if ($page_count > 1)
                   return '<p class="pagination">'.$previous_page.$first_page.implode('&nbsp;&nbsp;', $pages).$last_page.$next_page.'</p>';
    }
    
    // add function.php in wordpress----------- code end ----
  • 2.9 Years

    • Category : Jquery
    • Location : Chandigarh
    • Posted On : Jul 5, 2017

    Get geo location using jquery and save in a cookie

    var jb_lat = getCookie('jb_lat');
    var jb_lng = getCookie('jb_lng');
    
    if(jb_lat == '' && jb_lng == ''){
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition);
        } else { 
            x.innerHTML = "Geolocation is not supported by this browser.";
        }
        function showPosition(location){
            var exdays = 10;
            var d = new Date();
            d.setTime(d.getTime()   (exdays*24*60*60*1000));
            var expires = "expires="  d.toUTCString();
            document.cookie = "jb_lat="   location.coords.latitude   ";"   expires   ";path=/";
            document.cookie = "jb_lng="   location.coords.longitude   ";"   expires   ";path=/";
            window.location.reload();
        }
    
    }
        function getCookie(cname) {
            var name = cname   "=";
            var decodedCookie = decodeURIComponent(document.cookie);
            var ca = decodedCookie.split(';');
            for(var i = 0; i <ca.length; i  ) {
                var c = ca[i];
                while (c.charAt(0) == ' ') {
                    c = c.substring(1);
                }
                if (c.indexOf(name) == 0) {
                    return c.substring(name.length, c.length);
                }
            }
            return "";
        }
  • 2.9 Years

    • Category : Jquery
    • Location : Chandigarh
    • Posted On : Apr 12, 2017

    You can print specific div or area using this script

    /******Html*********/
     <a href="javascript:void(0);" id="printinvoice"  class="btn btn-warning btn-sm">PRINT INVOICE</a>
    
    <div class="print_div">
                        <div class="col-xs-6 table-responsive">
                            <div class = "sales_header">
                                <span>ORDER NO: # 11380189</span>  
                            </div>
                            <table class="table table-striped table-bordered datatables dataTable">
                                <tbody>
                                    <tr>
                                        <td>Order date</td>
                                        <td>12 Apr 2017 15:55:34</td>
                                    </tr>
                                    <tr>
                                        <td>Order Status</td>
                                        <td> Processed                                    </td>
                                    </tr>
                                    <tr>
                                        <td>Currency</td>
                                        <td>GBP</td>
                                    </tr> 
                                </tbody>
                            </table>
                        </div>  
     </div> 
    /***script**/
    <script src="/assets/js/jQuery.print.js"></script>
    $(document).ready(function() {
        $(document).on('click','#printinvoice',function(){
            //Print ele4 with custom options
            $('.print_div').print({
                //Use Global styles
                globalStyles: true,
                //Add link with attrbute media=print
                mediaPrint: true,
                //Custom stylesheet
                stylesheet: "http://fonts.googleapis.com/css?family=Inconsolata",
                //Print in a hidden iframe
                iframe: true,
                //Don't print this
                noPrintSelector: ""
            });
        });
    });
  • 2.9 Years

    • Category : Jquery
    • Location : Chandigarh
    • Posted On : Feb 27, 2017

    using this code you can prevent required values in html5

    <script src="https://cdnjs.cloudflare.com/ajax/libs/webshim/1.16.0/dev/polyfiller.js" type="text/javascript"></script>
    
    <script> 
            webshim.activeLang('en');
            webshims.polyfill('forms');
            webshims.cfg.no$Switch = true;
    </script>
     
  • 2.9 Years

    • Category : Jquery
    • Location : Chandigarh
    • Posted On : Feb 12, 2017

    JQuery Ajax form using boostrap validation

     $(document).on('submit','#formid',function(){
     $(this).formValidation({
                                framework: 'bootstrap',
                                fields: {
                                    name: {
                                        validators: {
                                            notEmpty: {
                                                message: 'The name is required'
                                            }
                                        }
                                    },
                                    email: {
                                        validators: {
                                            notEmpty: {
                                                message: 'The email is required'
                                            }
                                        }
                                    },
                                    password: {
                                        validators: {
                                            notEmpty: {
                                                message: 'The password is required'
                                            }
                                        }
                                    },
                                }
                            })
                            .on('success.form.fv', function(e) {
                                e.preventDefault();
                               var Formdata=$(this).serialize();
                                $.ajax({
                                    type: "POST",
                                    url: '', //add page url here
                                    data: Formdata, //send data from here,
                                    success: function(data) {
                                        alert(data);
                                    }
                                });
                            });
                     });