Skip to content

Upload Files

Upload Files

Using File Upload

Step1: Define column with edittype 'file', and set uploading path in 'upload_dir' property.

// file upload column
$col = array();
$col["title"] = "Note";
$col["name"] = "note"; 
$col["width"] = "50";
$col["editable"] = true;

$col["edittype"] = "file"; // render as file
$col["upload_dir"] = "temp"; // upload here

$col["show"] = array("list"=>false,"edit"=>true,"add"=>true); // only show in add/edit dialog
$cols[] = $col;

Step2: To display uploaded file in grid, make a (non-db) virtual column.

$col = array();
$col["title"] = "Image";
$col["name"] = "logo";
$col["width"] = "200";
$col["editable"] = true;
$col["default"] = "<a href='http://jqgrid/dev/demos/dev/{note}' target='_blank'><img height=100 src='http://jqgrid/dev/demos/dev/{note}'></a>";
$col["show"] = array("list"=>true,"edit"=>false,"add"=>false); // only show in listing
$cols[] = $col;

You can also decide what to do when file already exist:

// prompt error
$col["editrules"] = array("ifexist"=>"error");

// rename file e.g. file_1,file_2,file_3 etc (default)
$col["editrules"] = array("ifexist"=>"rename");

// override file
$col["editrules"] = array("ifexist"=>"override");

To restrict uploaded files based on extension you can set:

$col["editrules"]["allowedext"] = "jpeg,jpg,png,bmp,gif"; // comma separated list of extensions

To upload multiple files, you can set following. It uploads all selected files in specified folder and set comma separated file names in posted array field to be saved in db. One can use on_insert, on_update to separate them and save in separate table if required.

$col["editoptions"]["multiple"] = "multiple";

Resources

^ Top