How to read a file character by character in php ?

<?php

$file=fopen("filename.txt","r") or exit("Unable to open file!");
while (!feof($file))
  {
  echo fgetc($file);
  }
fclose($file);

?>

AJAX and JQuery File Uploader for your Web Application

Uploading files and images are very common tasks in the modern web like uploading profile picture, uploading trip pictures to their social networking account etc. As uploading files is a very simple task but AJAX and JQUERY improved it much more.

Now many JQuery file upload plugins are available which allow for more complex functionality and better usability. they shows users how much time left, allowing them to upload multiple files as well as use drag and drop interfaces. Here in this article, you will find few powerful AJAX JQuery file uploader plugins.

To more about this article Click Here

PHP & MySQL File Download Counter

It has been a while since we’ve done a proper PHP & MySQL tutorial here, at Tutorialzine, so today we are creating a simple, yet robust, file download tracker. Each file will have a corresponding row in the database, where the total number of downloads is saved. PHP will update the MySQL database and redirect the visitors to the appropriate files.

 

To track the number of downloads, you just need to upload your files to the files folder, and use a special URL to access them.

To read more about this article Click Here

For Demo Click Here

 

File Upload Progress Bar with jQuery and PHP

In this tutorials we tell how to create file upload progress bar with PHP and jQuery. In this post we had developed few lines of code using PHP APC library, it is very simple getting the server file upload process every few second and increasing the bar color using jquery css property. Just take a look at this demo.

To read more about this article Click Here

For Demo Click Here

 

SFBrowser File Manager With PHP and jQuery

SFBrowser is an open source application, built with PHP and jQuery, for managing files online with an Ajaxed interface.
Besides listing files and folders, it can upload, delete, rename and preview them. Uploading can be accomplished via an Ajaxed or Flash-based uploader (queued multiple uploads, progress bar, canceling, selection filtering, size filtering).

The functionality can be extended with plugins. There are few ready-to-use ones like filetree and image-resize.


To read more about this article Click Here

For Demo Click Here

AJAX Multiple File Upload Form Using jQuery

Multiple file upload forms are sometimes essential for your web application but managing upload from multiple file input boxes becomes a bit tedious and lengthy. But thanks to jQuery using which we can make this task easier too. Today I’m going to create an AJAXified multiple file upload form that uses a lot lesser server side code and also provides a very nice user interface.

For this tutorial, i’ll be using latest version of jQuery and Ajax upload library by Andrew Valums. Grab both libraries and add them to your page header

The HTML Structure

As i said, the upload form will be intuitive, we won’t be using the classic File input box. So, First of all create the upload button on which user will click to open the File Selection dialog.

<div id="upload" >Upload File</div>

You can use any element you want for the button. I just applied some basic style to this div, you can apply any style you wish to make it look more attractive.

#upload{

margin:30px 200px; padding:15px;

font-weight:bold; font-size:1.3em;

font-family:Arial, Helvetica, sans-serif;

text-align:center;

background:#f2f2f2;

color:#3366cc;

border:1px solid #ccc;

width:150px;

cursor:pointer !important;

-moz-border-radius:5px; -webkit-border-radius:5px;

}

I also added a span element next to upload button to show various messages during processing. And to show the uploaded files to the user, i added an unordered list next to the button. Here’s the complete html code.

<!-- Upload Button-->

<div id="upload" >Upload File</div><span id="status" ></span>

<!--List Files-->

<ul id="files" ></ul>

The PHP Code

To upload the files to server, here’s a basic file uploading script in PHP that displays ‘success’ if file uploaded successfully otherwise displays ‘error’.

upload-file.php

<?php

$uploaddir = './uploads/';

$file = $uploaddir . basename($_FILES['uploadfile']['name']); 

if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file)) {

  echo "success";

} else {

echo "error";

}

?>

The JavaScript Code

And lastly the javascript part. The AJAX Upload library you included earlier will do all the heavy lifting for you. Here’s the JavaScript Code you’ll need.

$(function(){

var btnUpload=$('#upload');

var status=$('#status');

new AjaxUpload(btnUpload, {

action: 'upload-file.php',

//Name of the file input box

name: 'uploadfile',

onSubmit: function(file, ext){

if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){

                  // check for valid file extension

status.text('Only JPG, PNG or GIF files are allowed');

return false;

}

status.text('Uploading...');

},

onComplete: function(file, response){

//On completion clear the status

status.text('');

//Add uploaded file to list

if(response==="success"){

$('<li></li>').appendTo('#files').html('<img src="./uploads/'+file+'" alt="" /><br />'+file).addClass('success');

} else{

$('<li></li>').appendTo('#files').text(file).addClass('error');

}

}

});

});

Code explanation: to use the AJAX Upload library we need to initialize the AjaxUpload object and provide it with parameters. The first parameter is the id of the button element on which the user will click and second is the server side script that’ll handle file upload. The second parameter can accept an array of various options to give you more control over the process.

And that’s exactly what i’ve done.

• The action field is the path to server side script,
• name is the name of file input box(hidden) which will be used for upload. If you change this value, make sure to change the server side script corresspondinly.
• onSubmit lets you perform some function before the file is uploaded e.g. you can check the file extension like i’ve done above or show a status message.
• onComplete lets you perform some action after the upload is complete e.g. I’ve shown the uploaded image to the user.

And if you want to limit the number of files that a user can upload at a time, simply usethis.disable() within onSubmit or onComplete to disable the upload button after checking for some condition.

Note: The file upload using AJAX is not true ajax as it uses hidden iframe to upload the form data but his whole process is transparent by using the AJAX Upload library and gives a feel of AJAXified file upload.

Find files with PHP

In PHP you can find files with function glob. The glob function searches for all the pathnames matching pattern according to the rules used by the libc glob function, which is similar to the rules used by common shells. It is nice, but it works for the current directory only. If you need function to search whole directory subtree, then it can be done with few line more.

Here is first solution for PHP file search. I found PHP function on glob manual page PHP: glob - Manual. Original function works but ignores dot directories in subtree. So, I applied a little modification to include missing dot directories. Returned result are found files packed in array. It's important to mention implemented recursion and possible high memory consumption.

/**

 * find files matching a pattern

 * using PHP "glob" function and recursion

 *

 * @return array containing all pattern-matched files

 *

 * @param string $dir     - directory to start with

 * @param string $pattern - pattern to glob for

 */

function find($dir, $pattern){

// escape any character in a string that might be used to trick

// a shell command into executing arbitrary commands

$dir = escapeshellcmd($dir);

// get a list of all matching files in the current directory

$files = glob("$dir/$pattern");

// find a list of all directories in the current directory

// directories beginning with a dot are also included

foreach (glob("$dir/{.[^.]*,*}", GLOB_BRACE|GLOB_ONLYDIR) as $sub_dir){

$arr   = find($sub_dir, $pattern);  // resursive call

$files = array_merge($files, $arr); // merge array with files from subdirectory

}

// return all found files

return $files;

}

If you use Unix (Linux) then you can try solution with "find" command. "Find" is very powerful and you can see how files can be searched in post The "find" command. Function will also return array with found files as the first version.

/**

 * find files matching a pattern

 * using unix "find" command

 *

 * @return array containing all pattern-matched files

 *

 * @param string $dir     - directory to start with

 * @param string $pattern - pattern to search

 */

function find($dir, $pattern){

// escape any character in a string that might be used to trick

// a shell command into executing arbitrary commands

$dir = escapeshellcmd($dir);

// execute "find" and return string with found files

$files = shell_exec("find $dir -name '$pattern' -print");

// create array from the returned string (trim will strip the last newline)

$files = explode("\n", trim($files));

// return array

return $files;

}

Both versions return the same result, so you can choose between pure PHP version or version with "find" command.

Multiple File Upload With Progress Bar Using php and jQuery

The default browser file input boxes do not allow multiple file selection for uploading at once and also do not provide any visual clue as to how much of the files selected have uploaded. Earlier I wrote about multiple file upload using AJAX, but that did not provide multiple file selection and a progress bar.

Today I am going to show you how to create a multiple file upload form that allows multiple file selection using Ctrl/Shift keys and also displays a progress bar for each of the selected files while they are uploading.

For this tutorial, you will need the all powerful jQuery library(latest version) and SWFUpload jQuery Plugin.

Folder Structure

Place the jQuery library in js folder, extract the SWFUpload jQuery Plugin somewhere and copy the jquery.swfupload.js in the src folder to the js folder. Also, copy the swfupload folder inside vendor folder of SWFUpload jQuery Plugin to js Folder. Here’s what your folder structure should look like.

Add reference to jQuery library and then jquery.swfupload.js in the head tag of your page.

HTML Structure

Since we will be using SWFUpload, we’ll need a container that will act as placeholder for SWFUpload button, and a list to show the queue of files.

<div id="swfupload-control">  

    <p>Upload upto 5 image files(jpg, png, gif), each having maximum size of 1MB(Use Ctrl/Shift to select multiple files)</p>  

    <input type="button" id="button" />  

    <p id="queuestatus" ></p>  

    <ol id="log"></ol>  

</div>  

CSS Styles

Here are some CSS styles to stylize our File Uploader, modify them as you want. Important ones are .progressbar and .progress that define the progress bar for file upload, you can adjust their height and color.

#swfupload-control p{ margin:10px 5px; font-size:0.9em; }  

#log{ margin:0; padding:0; width:500px;}  

#log li{ list-style-position:inside; margin:2px; border:1px solid #ccc; padding:10px; font-size:12px;  

    font-family:Arial, Helvetica, sans-serif; color:#333; background:#fff; position:relative;}  

#log li .progressbar{ border:1px solid #333; height:5px; background:#fff; }  

#log li .progress{ background:#999; width:0%; height:5px; }  

#log li p{ margin:0; line-height:18px; }  

#log li.success{ border:1px solid #339933; background:#ccf9b9; }  

#log li span.cancel{ position:absolute; top:5px; rightright:5px; width:20px; height:20px;  

    background:url('js/swfupload/cancel.png') no-repeat; cursor:pointer; }  

The JavaScript Code

The JavaScript code is a bit bulkier but it is not that difficult to understand as it looks.

$(function(){  

    $('#swfupload-control').swfupload({  

        upload_url: "upload-file.php",  

        file_post_name: 'uploadfile',  

        file_size_limit : "1024",  

        file_types : "*.jpg;*.png;*.gif",  

        file_types_description : "Image files",  

        file_upload_limit : 5,  

        flash_url : "js/swfupload/swfupload.swf",  

        button_image_url : 'js/swfupload/wdp_buttons_upload_114x29.png',  

        button_width : 114,  

        button_height : 29,  

        button_placeholder : $('#button')[0],  

        debug: false  

    })  

        .bind('fileQueued', function(event, file){  

            var listitem='<li id="'+file.id+'" >'+  

                'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+  

                '<div class="progressbar" ><div class="progress" ></div></div>'+  

                '<p class="status" >Pending</p>'+  

                '<span class="cancel" >&nbsp;</span>'+  

                '</li>';  

            $('#log').append(listitem);  

            $('li#'+file.id+' .cancel').bind('click', function(){ //Remove from queue on cancel click  

                var swfu = $.swfupload.getInstance('#swfupload-control');  

                swfu.cancelUpload(file.id);  

                $('li#'+file.id).slideUp('fast');  

            });  

            // start the upload since it's queued  

            $(this).swfupload('startUpload'); 

        }) 

        .bind('fileQueueError', function(event, file, errorCode, message){ 

            alert('Size of the file '+file.name+' is greater than limit'); 

        }) 

        .bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){ 

            $('#queuestatus').text('Files Selected: '+numFilesSelected+' / Queued Files: '+numFilesQueued); 

        }) 

        .bind('uploadStart', function(event, file){ 

            $('#log li#'+file.id).find('p.status').text('Uploading...'); 

            $('#log li#'+file.id).find('span.progressvalue').text('0%'); 

            $('#log li#'+file.id).find('span.cancel').hide(); 

        }) 

        .bind('uploadProgress', function(event, file, bytesLoaded){ 

            //Show Progress 

            var percentage=Math.round((bytesLoaded/file.size)*100); 

            $('#log li#'+file.id).find('div.progress').css('width', percentage+'%'); 

            $('#log li#'+file.id).find('span.progressvalue').text(percentage+'%'); 

        }) 

        .bind('uploadSuccess', function(event, file, serverData){ 

            var item=$('#log li#'+file.id);  

            item.find('div.progress').css('width', '100%'); 

            item.find('span.progressvalue').text('100%'); 

            var pathtofile='<a href="uploads/'+file.name+'" target="_blank" >view &raquo;</a>'; 

            item.addClass('success').find('p.status').html('Done!!! | '+pathtofile); 

        }) 

        .bind('uploadComplete', function(event, file){ 

            // upload has completed, try the next one in the queue 

            $(this).swfupload('startUpload');  

        })  

});  

Code Explanation

Since we are using SWFUpload jQuery Plugin, firstly we initialize it on the placeholder element using the $('#placeholder').swfupload({ settings }) function and pass it a settings object that defines various parameters like server side file that will handle uploads, maximum size of the file, number of maximum uploads, allowed file types, button url, button size etc. For complete detail of settings you can use, refer to SWFUpload docs.

At this stage, your file upload script will work but will not show any visual clue to users about the upload. SWFUpload fires certain events that we can use to provide information to user about the file uploads. So, next thing is to bind functions to various events to show required output. That’s what all bind calls are doing. They are pretty much self-explanatory.

Limitations

Since this script uses SWFUpload to upload files, which requires flash plugin, so this will not work if flash plugin is not installed in end user’s browser. Make sure to provide an alternative upload form so that users without flash can upload files.

Also, SWFUpload has some known issues when used on linux systems and if user is behind proxies. Make sure to read them before you use it in production environment.