File Handling at Client Side Using Javascript

Introduction

JavaScript has a very rich ensemble of methods and properties to create, manipulate, and manage drives, files, and folders. You can use JavaScript as you would any other modern programming language. For example, you can use it to open files, write to a file, read from it, etc.

Using the Code

File handling in JavaScript can be done using the FileSystemObject object and its properties and methods. This object is part of Microsoft's Scripting Engine, and thus this is applicable only to Microsoft Windows Operating Systems.

The following piece of code creates a new file at the specified location and write the line "File handling in JavaScript" into it.

Collapse |Copy Code

var fso = new ActiveXObject("Scripting.FileSystemObject");
// 2=overwrite, true=create if not exist, 0 = ASCII
varFileObject = fso.OpenTextFile("C:\\Sachin.txt", 2, true,0);
varFileObject.write("File handling in Javascript");
varFileObject.close();

The parameters for the function OpenTextFile are as follows:

Parameter 1: PATH - The file gets created at thepath specified on the client machine. If only the file name is mentioned here, the file getssaved on the desktop of the client system.

Parameter 2: I/O mode, indicates the mode of file opening. Possible values are:

1: Opens the file for reading.
2: Opens the file for writing.
8: Opens the file for appending.

Parameter 3: CREATE is a boolean value indicating whether to create the file if it does not exist (true) or to issue an error message if the file does not exist (false).

Parameter 4: FORMAT is optional and indicates the file type. If not specified, the default file type is ASCII. The possible values of format are:

TristateUseDefault - 2: Opens the file using the system default
TristateTrue -1: Opens the file as Unicode
TristateFalse 0: Opens the file as ASCII

The following are some of the methods provided by FileSystemObject for file handling:

Collapse |Copy Code

MoveFile(source, destination)
MoveFolder(source, destination)
CopyFile(source, destination, overwriteFlag) //overwriteFlag= true/false
CopyFolder(source, destination, overwriteFlag) //overwriteFlag= true/false
CreateFolder(folderName)
CreateTextFile(fileName, overwriteFlag)//overwriteFlag= true/false
DeleteFile(fileName, readPermissionFlag)//readPermissionFlag= true/false
DeleteFolder(folderName, readPermissionFlag)//readPermissionFlag= true/false
DriveExists(letterDrive)
FileExists(fileName)
FolderExists(folderName)
GetSpecialFolder(folderCode) /* The given folderCode is either 0 for a 
windows folder, 1 for a system folder, or 2 for a temporary folder. 
A full path is returned. On a typical installation, "c:\windows" 
is returned as the windows folder, "c:\windows\system" is returned 
as the system folder, and "c:\windows\temp" is returned as the temporary folder. */

Points of Interest

There are a few things to note before implementing FileSystemObject. Since it is an ActiveX object, it will not be created if the security level on the client machine is high. So the website has to be added to the trusted site list so that the ActiveX object can be created.

The user must have write access in the path specified while creating a file. In cases where there is uncertainty, it's better to write the file onto the Temporary Folder of the system. Thepath for the Temp folder can be found using:

Collapse |Copy Code

GetSpecialFolder(2)

The above topic is applicable only for IE. The below link gives an idea of how to implement file operations in Mozilla. The below code can be used to check the browser type:

Collapse |Copy Code

if (navigator.userAgent.indexOf("Opera") >= 0)
{
    alert("This example doesn't work in Opera") ; 
    return ;
}
if (navigator.userAgent.indexOf("MSIE") >= 0)
{ 
    alert("This example works in IE") ; 
    return ;
} 
if (navigator.userAgent.indexOf("Mozilla") >= 0)
{
    alert("This example doesn't work in Mozilla") ; 
    alert("Check the following link: <a href="http://www.mozilla.org/js/js-file" + 
          "-object.html" title="http://www.mozilla.org/js/js-file-object" + 
          ".html">http://www.mozilla.org/js/js-file-object.html</a>") ;
    return ;
}

//