footer alway on bottom

 <script>

  $(document).ready(function() {

   var docHeight = $(window).height();
   var footerHeight = $('footer').height();
   var footerTop = $('footer').position().top + footerHeight;

   if (footerTop < docHeight) {
    $('footer').css('margin-top', 10+ (docHeight - footerTop) + 'px');
   }
  });
 </script>

what happens when you type in a URL in browser

In an extremely rough and simplified sketch, assuming the simplest possible HTTP request, no proxies, IPv4 and no problems in any step:

1. browser checks cache; if requested object is in cache and is fresh, skip to #9
2. browser asks OS for server's IP address
3. OS makes a DNS lookup and replies the IP address to the browser
4. browser opens a TCP connection to server (this step is much more complex with HTTPS)
5. browser sends the HTTP request through TCP connection
6. browser receives HTTP response and may close the TCP connection, or reuse it for another request
7. browser checks if the response is a redirect or a conditional response (3xx result status codes), authorization request (401), error (4xx and 5xx), etc.; these are handled differently from normal responses (2xx)
8. if cacheable, response is stored in cache
9. browser decodes response (e.g. if it's gzipped)
10. browser determines what to do with response (e.g. is it a HTML page, is it an image, is it a sound clip?)
11. browser renders response, or offers a download dialog for unrecognized types

send tceditor data with ajax

try{
                 for ( instance in CKEDITOR.instances ) {
                    CKEDITOR.instances[instance].updateElement();
                }
            }catch(e){}
            

python first webapp program

1 - create folder : mkdir myfirstapp
2-  pip install lpthw.web (install commond)
3 . create init file ( touch __init__.py)
4. create app file
    vim app.py
import web

urls = (
  '/', 'index'
)

app = web.application(urls, globals())

class index:
    def GET(self):
        greeting = "Hello World"
        return greeting

if __name__ == "__main__":
    app.run()


5 - save file and run
python app.py


open webbrowser
put on url :-localhost:8080
Output :-

Hello World

   

remove empty field from input

 function submitFormManual(){
        //get name search form
        var SearchForm = $("#propertyFilertForm");
         SearchForm.find('input[name], select[name]').each(function(){
            if (!$(this).val()){
                $(this).removeAttr('name');
            }
         });
         //form submit
        SearchForm.submit();
    }

given two date get month year

/*---------------------------------------
    Get month given two date
    ---------------------------------------*/
    function get_months($date1, $date2) {
        $time1  = strtotime($date1);
        $time2  = strtotime($date2);
        $my     = date('mY', $time2);
        $months= array();
        $months[date('M-Y', $time1)] = 0;

        while($time1 < $time2) {
           $time1 = strtotime(date('Y-m-d', $time1).' +1 month');
           if(date('mY', $time1) != $my && ($time1 < $time2))
              $months[date('M-Y', $time1)] = 0;
        }

        $months[date('M-Y', $time2)] = 0;
        return $months;
    }
   

remove file check

function checkRemoteFile($url) {
    $ch = curl_init();
   
    curl_setopt($ch, CURLOPT_URL, $url);
    // don't download content
    curl_setopt($ch, CURLOPT_NOBODY, 1);
    curl_setopt($ch, CURLOPT_FAILONERROR, 1);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    if (curl_exec($ch) !== FALSE) {
        return true;
    } else {
        return false;
    }
}

count increase value

<span class="count">10</span>
<script>
$('.count').each(function () {
    $(this).prop('Counter',0).animate({
        Counter: $(this).text()
    }, {
        duration: 2000,
        easing: 'swing',
        step: function (now) {
            $(this).text(Math.ceil(now));
        }
    });
});
</script>

page loader html css javascript

   /*--------------add html after body----*
<div id="loader-wrapper">
    <div id="loader_page_start"></div>


</div>


<script>

$( window ).load(function() {
    $('body').addClass('loaded');
    })

</script>
          
#loader-wrapper {
    background-color: rgb(255, 255, 255);
    border: medium none;
    cursor: wait;
    height: 100%;
    left: 0;
    margin: 0;
    opacity: 1;
    padding: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
}
#loader_page_start {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3498db;

    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

    #loader_page_start:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #e74c3c;

        -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader_page_start:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #f9c922;

        -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
          animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0%   {
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
    }
    @keyframes spin {
        0%   {
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
    }
   
.loaded #loader-wrapper {
    transform: translateY(+100%);
    transition: all 0.3s ease-out 1s;
    visibility: hidden;
}

price range picker with tooltip

    $(function() {
            var tooltip = function(sliderObj, ui){
                val1            = '<div id="slider_tooltip" style="margin-top:-20px">'+ sliderObj.slider("values", 0) +'</div>';
                val2            = '<div id="slider_tooltip" style="margin-top:-20px">'+ sliderObj.slider("values", 1) +'</div>';
                sliderObj.children('.ui-slider-handle').first().html(val1);
                sliderObj.children('.ui-slider-handle').last().html(val2);                 
            };

            $( "#slider-range" ).slider({
              range: true,
              min: 0,
              max: 10000000,
              values: [ 0, 10000000 ],
              slide: function( e, ui ) {
                tooltip($(this),ui);                   
              },             
              create:function(e,ui){
                tooltip($(this),ui);                   
              }
            });
        });

Time localization

: /*
 * localization convert localtime with date time
 */    
    
public static function viewLocalizedatetime($dbdatetime)
{  
$timelocal = $_SESSION["timezone"]*60;
$eqqdate = strtotime($dbdatetime) + $timelocal;
$eqdate = strftime("%Y-%m-%d %H:%M:%S",$eqqdate);
$datereturn = DATE('Y-m-d h:i:s ,$eqdate);
return "$datereturn";
}
        
/*
 * localization convert localtime with date 
 */    
    
public static function viewLocalizedate($dbdatetime)
{    
$timelocal = $_SESSION["timezone"]*60;
$eqqdate = strtotime($dbdatetime) + $timelocal;
$eqdate = strftime("%Y-%m-%d %H:%M:%S",$eqqdate);
$datereturn = DATE('Y-m-d  ,$eqdate);
return "$datereturn";
}

/***************in html page*******************/


                  var d = new Date()
                    var timeformateData = -d.getTimezoneOffset();                
                   /********************store data in input type nad send on servere***********/

Add image dynamic and upload

   
     $(document).on("click", ".imagedataclass", function () {

        var data1 = $(this).attr('data1');
        var data2 = $(this).attr('data');
        var dataid = $(this).attr('dataid');

        $("#image" + dataid).attr("src", data2);
        $(this).attr("data", data1)
        $(this).attr("data1", data2)
        $(this).closest('li').toggleClass('imagese');
    })
    /***************************************************************************
     File Upload Section
     ***************************************************************************/
    $('.add_more').click(function (e) {
        //get autoincrement number
        var InputNum = $(this).attr("data");
        //increment number
        InputNum++
        /***increment data var button***/
        $(this).attr("data", InputNum);
        var miandiv = $("#mainDivImage");

        e.preventDefault();
        miandiv.append('<div id="BrowseBtnData' + InputNum + '" class="col-sm-2 pad_bot"><div id="browsemain' + InputNum + '" class="input-group pad_bot"> <input type="hidden" id="imageName' + InputNum + '" name="imagename[' + InputNum + ']"><span class="input-group-btn"><span class="btn btn-primary btn-sm btn-file">Browse&hellip; <input id="ImgId' + InputNum + '" type="file" data="' + InputNum + '" name="file[]"></span></span><input type="text" id="inputId' + InputNum + '" readonly> <div id="imageloadstatus' + InputNum + '" style="display:none"><img src="/common/loader.gif" alt="Uploading...."/></div></div><div class="row_dv " id="ImageDiv' + InputNum + '" style="display:none"><div class="rltv"><span class="close_overlay"> <a class="close_ic fa fa-times-circle-o fa-3x deleteimg" data="BrowseBtnData' + InputNum + '"></a> </span><image width="185" height="150" src=""  id="imageTag' + InputNum + '"></div><div class="row_dv"><input value="' + InputNum + '" type="radio" name="default[]"> Make Default </div></div></div>');
    });

    /***************Get Image Preview***********/
    function readURL(input, num) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#imageTag' + num).attr('src', e.target.result);
                $('#imageTag' + num).show()
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    /********************remove Image ***************/
    $("#mainDivImage").on('click', '.deleteimg', function () {
        var deleteId = $(this).attr("data");
        $("#mainDivImage #" + deleteId).remove();
    });


    /******************ajax upload file***************/
    $(document).delegate(':file', 'change', function () {
        //get file instance for show image
        var dataThisFile = this;
        //****get dynamic file Number id******/
        var filenum = $(this).attr('data');

        /*****check file size************/
        var file_size = $("#ImgId" + filenum)[0].files[0].size;
        if (file_size > 2097152) {
            alert("File size is greater than 2MB");
            return false;
        }

        /**********check image type ********/

        var ext = $("#ImgId" + filenum).val().split('.').pop().toLowerCase();
        if ($.inArray(ext, ['gif', 'png', 'jpg', 'jpeg']) == -1) {
            alert('invalid extension!');
            return false;
        }

        var oMyForm = new FormData();
        oMyForm.append("media", $("#ImgId" + filenum).prop("files")[0]);
        oMyForm.append("_token", "{{ csrf_token() }}");




        $.ajax({
            url: "uploadfile",
            data: oMyForm,
            processData: false,
            contentType: false,
            type: 'POST',
            dataType: 'json',
            beforeSend: function () {
                $(".add_more").prop("disabled", true);
                $("#imageloadstatus" + filenum).show();
                $("#inputId" + filenum).hide();
            },
            success: function (response) {
                if (response.error === 1) {
                    $("#inputId" + filenum).val("System recieve an error !");
                } else {
                    var label = $("#ImgId" + filenum).val().replace(/\\/g, '/').replace(/.*\//, '');
                    $("#inputId" + filenum).val(label);
                    $("#imageName" + filenum).val(response);
                    $("#browsemain" + filenum).hide();
                    $("#imageloadstatus" + filenum).hide();

                    $("#ImageDiv" + filenum).show();

                    readURL(dataThisFile, filenum);


                }

                $(".add_more").prop("disabled", false)
                $("#imageloadstatus" + filenum).hide();


            },
            error: function () {
                alert("unable to create the record");
                $(".add_more").prop("disabled", false)
                $("#imageloadstatus" + filenum).hide();


            }
        });
    });

Group validation checkbox

    /***********add custome validation for check box at least one check box checked*************/
         $.validator.addMethod('require-one', function(value) {
    return $('.require-one:checked').size() > 0;
}, 'Please check at least one property feature.');

var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e, i) {
    return $(e).attr("name")
}).join(" ");
        
           $('#Addpropertyform').validate({
         ignore: ".ignore",
        
         groups: {
        checks: checkbox_names
    },
    errorPlacement: function(error, element) {
        if (element.attr("type") == "checkbox") error.insertAfter(checkboxes.last());
        else error.insertAfter(element);
    },
        invalidHandler: function(e, validator){
            if(validator.errorList.length)
            $('#tabs a[href="#' + $(validator.errorList[0].element).closest(".tab-pane").attr('id') + '"]').tab('show')
        }
    });