PHP Guru: September 2014

Saturday, 27 September 2014

How to check the internet connection using PHP function fsockopen?

<?php
//function to check if the local machine has internet connection
function checkConnection()
{
    //Initiates a socket connection to www.itechroom.com at port 80
    $conn = @fsockopen("www.itechroom.com", 80, $errno, $errstr, 30);
    if ($conn)
    {
        $status = "Connection is OK";
        fclose($conn);
    }
    else
    {
        $status = "NO Connection<br/>\n";
        // $status .= "$errstr ($errno)";
    }
    return $status;
}

echo checkConnection();
?>

How to print string in reverse order using recursion?

function reverse_recursion($str){
    if(strlen($str)==1)
        return $str;
    else{
        $len = strlen($str);
        return ucwords(reverse_recursion(substr($str,1,strlen($str)-1)).$str[0]);
    }
}

echo reverse_recursion('Kumar Abhimanyu');

How to print string in reverse order without recursion?

function reverse($str){
   $rev = NULL;
   for($i=strlen($str)-1; $i>=0; $i--)
       $rev.=$str[$i];
       return ucwords(strtolower($rev));
}
echo reverse('Kumar Abhimanyu');

How to print facorial in PHP using recursion?

function fact($n){
    if($n==1)
        return $n;
    else
        return fact($n-1)*$n;
}

echo fact(4);

How tp print Fibonacci Series in PHP?

function fab($max=null){
    $a = 0;
    $b = 1;
    $count = 0;
    echo $a.', ';
    echo $b.', ';
    while($count < $max){
        $c = $b + $a;
        echo $c.', ';
        $a = $b;
        $b = $c;
        $count++;
    }
}
echo fab(22);

It will print up to22.

Tuesday, 23 September 2014

How to create tebbing system?



<!doctype html>



<html lang="en">



<head>



  <meta charset="utf-8">



  <title>jQuery UI Tabs - Default functionality</title>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">



  <script src="//code.jquery.com/jquery-1.10.2.js"></script>



  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>



  <link rel="stylesheet" href="/resources/demos/style.css">



  <script>



  $(function() {



    $( "#tabs" ).tabs();



  });



  </script>



</head>



<body>



 



<div id="tabs">



  <ul>



    <li><a href="#tabs-1">Nunc tincidunt</a></li>



    <li><a href="#tabs-2">Proin dolor</a></li>



    <li><a href="#tabs-3">Aenean lacinia</a></li>



  </ul>



  <div id="tabs-1">



    <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>



  </div>



  <div id="tabs-2">



    <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>



  </div>



  <div id="tabs-3">



    <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>



    <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>



  </div>



</div>



 



 



</body>



</html>

How to create text box tooltip?



<!doctype html>



<html lang="en">



<head>



  <meta charset="utf-8">



  <title>jQuery UI Tooltip - Default functionality</title>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">



  <script src="//code.jquery.com/jquery-1.10.2.js"></script>



  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>



  <link rel="stylesheet" href="/resources/demos/style.css">



  <script>



  $(function() {



    $( document ).tooltip();



  });



  </script>



  <style>



  label {



    display: inline-block;



    width: 5em;



  }



  </style>



</head>



<body>



 



<p><a href="#" title="That&apos;s what this widget is">Tooltips</a> can be attached to any element. When you hover



the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip.</p>



<p>But as it's not a native tooltip, it can be styled. Any themes built with



<a href="http://jqueryui.com/themeroller/" title="ThemeRoller: jQuery UI&apos;s theme builder application">ThemeRoller</a>



will also style tooltips accordingly.</p>



<p>Tooltips are also useful for form elements, to show some additional information in the context of each field.</p>



<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes."></p>



<p>Hover the field to see the tooltip.</p>



 



 



</body>



</html>

How to create dialog box alert in jquery?

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {

$( "#aaa" ).click(function() {
$( "#dialog" ).dialog();
});
});
</script>
</head>
<body>
<div id="dialog" style="display:none;" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
<span id="aaa">Click Here</span>
</body>
</html>

How to create progressbar using jquery?



<!doctype html>



<html lang="en">



<head>



  <meta charset="utf-8">



  <title>jQuery UI Progressbar - Default functionality</title>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">



  <script src="//code.jquery.com/jquery-1.10.2.js"></script>



  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>



  <link rel="stylesheet" href="/resources/demos/style.css">



  <script>



  $(function() {



    $( "#progressbar" ).progressbar({



      value: 37



    });



  });



  </script>



</head>



<body>



 



<div id="progressbar"></div>



 



 



</body>



</html>

How to create Autocomplete textbox



<!doctype html>



<html lang="en">



<head>



  <meta charset="utf-8">



  <title>jQuery UI Autocomplete - Default functionality</title>



  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">



  <script src="//code.jquery.com/jquery-1.10.2.js"></script>



  <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>



  <link rel="stylesheet" href="/resources/demos/style.css">



  <script>



  $(function() {



    var availableTags = [



      "ActionScript",



      "AppleScript",



      "Asp",



      "BASIC",



      "C",



      "C++",



      "Clojure",



      "COBOL",



      "ColdFusion",



      "Erlang",



      "Fortran",



      "Groovy",



      "Haskell",



      "Java",



      "JavaScript",



      "Lisp",



      "Perl",



      "PHP",



      "Python",



      "Ruby",



      "Scala",



      "Scheme"



    ];



    $( "#tags" ).autocomplete({



      source: availableTags



    });



  });



  </script>



</head>



<body>



 



<div class="ui-widget">



  <label for="tags">Tags: </label>



  <input id="tags">



</div>



 



 



</body>



</html>

How to create parent child menu

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Menu - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#menu" ).menu();
});
</script>
<style>
.ui-menu { width: 150px; }
</style>
</head>
<body>
<ul id="menu">
<li class="ui-state-disabled">Aberdeen</li>
<li>Ada</li>
<li>Adamsville</li>
<li>Addyston</li>
    <li>Delphi
        <ul>
        <li class="ui-state-disabled">Ada</li>
        <li>Saarland</li>
        <li>Salzburg an der schönen Donau</li>
        </ul>
    </li>
    <li>Saarland</li>
    <li>Salzburg
        <ul>
            <li>Delphi
                <ul>
                    <li>Ada</li>
                    <li>Saarland</li>
                    <li>Salzburg</li>
                </ul>
            </li>
            <li>Delphi
                <ul>
                    <li>Ada</li>
                    <li>Saarland</li>
                    <li>Salzburg
                        <ul>
                            <li>Ada</li>
                            <li>Saarland</li>
                            <li>Salzburg
                                <ul>
                                    <li>Ada</li>
                                    <li>Saarland</li>
                                    <li>Salzburg
                                        <ul>
                                            <li>Ada</li>
                                            <li>Saarland</li>
                                            <li>Salzburg</li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li>Perch</li>
        </ul>
    </li>
<li class="ui-state-disabled">Amesville</li>
</ul>
</body>
</html>

Monday, 22 September 2014

Browser detection - IE, Firefox, Safari, Chrome

    <?php
    $msie = strpos($_SERVER["HTTP_USER_AGENT"], 'MSIE') ? true : false;
    $firefox = strpos($_SERVER["HTTP_USER_AGENT"], 'Firefox') ? true : false;
    $safari = strpos($_SERVER["HTTP_USER_AGENT"], 'Safari') ? true : false;
    $chrome = strpos($_SERVER["HTTP_USER_AGENT"], 'Chrome') ? true : false;
    ?>

        <?php
    //Firefox
    if ($firefox) {
    echo 'you are using Firefox!';
    echo '<br />';
    }

    // Safari or Chrome. Both use the same engine - webkit
    if ($safari || $chrome) {
    echo 'you are using a webkit powered browser';
    echo '<br />';
    }

    // IE
    if ($msie) {
    echo '<br>you are using Internet Explorer<br>';
    echo '<br />';
    }

    // Not IE and for all other browsers
    if (!$msie) {
    echo '<br>you are not using Internet Explorer<br>';
    echo '<br />';
    }

    // Add inline css
    if ($firefox) {
    echo '<style type="text/css">';
    echo '.mydiv {position:relative; width:100px; height:50px;}';
    echo '</style>';
    }
    ?>

Some useful link

Autocomplete textbox
http://daveismyname.com/demos/autocomplete/
Dynamick datepicker
http://www.daveismyname.com/demos/dynamic-form-with-jquery-ui-datepicker/

Create dynamic datepicker in jquery

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Dynamic Form with Jquery UI datepicker</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
</head>
<body>

<form action="" method="post">

<fieldset>
<legend>Inputs</legend>
<div id="extender"></div>
<p><a href="#" id="add">Add</a></p>
</fieldset>

</form>

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
<script type="text/javascript">
$(function() {

//fadeout selected item and remove
$('.remove').live('click', function() {
$(this).parent().fadeOut(300, function(){
$(this).empty();
return false;
});
});

var options = '<p>Title: <input type="text" name="titles[]" value="" size="30" /> Date: <input type="text" class="datepicker" name="dates[]" value="" size="10" /> <a href="#" class="remove">Remove</a></p>';

//add input
$('a#add').click(function() {
$(options).fadeIn("slow").appendTo('#extender');
i++;
return false;
});

$('.datepicker').live('click', function() {
$(this).datepicker('destroy').datepicker({changeMonth: true,changeYear: true,dateFormat: "yy-mm-dd",yearRange: "1900:+10",showOn:'focus'}).focus();
});

});
</script>
</body>
</html>

Geting image size before image upload using javascript

<SCRIPT type="text/javascript">
    function ValidateFileUpload() {
        var fuData = document.getElementById('fileChooser');
        var FileUploadPath = fuData.value;
var f = fuData.files.item(0); // get only the first file from the list of files
var filesize = f.size;
alert("the size of the image is : "+filesize/1024+" bytes");

//To check if user upload any file
        if (FileUploadPath == '') {
            alert("Please upload an image");

        } else {
            var Extension = FileUploadPath.substring(
                    FileUploadPath.lastIndexOf('.') + 1).toLowerCase();

//The file uploaded is an image

if (Extension == "gif" || Extension == "png" || Extension == "bmp"
                    || Extension == "jpeg" || Extension == "jpg") {

// To Display

                if (fuData.files && fuData.files[0]) {
                    var reader = new FileReader();

                    reader.onload = function(e) {
                        $('#blah').attr('src', e.target.result);
                    }

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

            }

//The file upload is NOT an image
else {
                alert("Photo only allows file types of GIF, PNG, JPG, JPEG and BMP. ");
fuData.value="";
            }
        }
    }
</SCRIPT>

<form>
<input type="text" />
<input type="file" name="dataFile" id="fileChooser" onchange="return ValidateFileUpload()" />
<input type="reset" />
</form>

Get image extention before uploading using javascript

<SCRIPT type="text/javascript">
    function ValidateFileUpload() {
        var fuData = document.getElementById('fileChooser');
        var FileUploadPath = fuData.value;
// var f = fuData.files.item(0); // get only the first file from the list of files
// var filesize = f.size;
// alert("the size of the image is : "+filesize/1024+" bytes");

//To check if user upload any file
        if (FileUploadPath == '') {
            alert("Please upload an image");

        } else {
            var Extension = FileUploadPath.substring(
                    FileUploadPath.lastIndexOf('.') + 1).toLowerCase();

//The file uploaded is an image

if (Extension == "gif" || Extension == "png" || Extension == "bmp"
                    || Extension == "jpeg" || Extension == "jpg") {

// To Display

                if (fuData.files && fuData.files[0]) {
                    var reader = new FileReader();

                    reader.onload = function(e) {
                        $('#blah').attr('src', e.target.result);
                    }

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

            }

//The file upload is NOT an image
else {
                alert("Photo only allows file types of GIF, PNG, JPG, JPEG and BMP. ");
fuData.value="";
            }
        }
    }
</SCRIPT>
<form>
<input type="text" />
<input type="file" name="dataFile" id="fileChooser" onchange="return ValidateFileUpload()" />
<input type="reset" />
</form>