JQGrid File Upload
I want to use Multiple File Upload With JQGrid builtin Inline/popup Editing. User will supply some meta info and file. Meta info will go to DB and file will be saved on web server. I need to do this on Submit button. Any Suggestion/reference ?开发者_开发百科
This question is a bit old, but if anyone gets it on google, here:
http://www.trirand.com/blog/?page_id=393/feature-request/file-upload-again/
Here's a demo by the JqGrid staff, based on the Ajax file upload plugin. It's a pretty simple script!
you have your grid.php:
// add column "fileToUpload" , hidden in main table view, showed in add/edit forms
$grid->addCol(array("name"=>"fileToUpload", "hidden"=>true, "editable"=>true, "edittype"=>"file", "editrules"=>array("edithidden"=>true)));
// file upload code
$upload = <<< UPLOAD
function (formid) {
//These are needed for fileupload plugin
$(formid).attr("method", "POST");
$(formid).attr("action", "");
$(formid).attr("enctype", "multipart/form-data");
// convert to jqueryUI button
$("#fileToUpload", formid).button();
// Create a button bellow the file field
$("<BR/><button id='buttonUpload'>Upload</button>").button().insertAfter("#fileToUpload", formid);
// bind a event
$("#buttonUpload", formid).click(function () {
$('<img src="loading.gif" />')
.dialog()
.ajaxStart(function () {
$("#gview_grid").attr("disabled", true); //disable jqgrid to avoid editing while uploading file
$(this).show();
})
.ajaxComplete(function () {
$(this).dialog("close");
$("#gview_grid").removeAttr("disabled");; //restore jqgrid after file loading complete
});
$.ajaxFileUpload({
url: 'doajaxfileupload.php',
secureuri: false,
fileElementId: 'fileToUpload',
dataType: 'json',
success: function (data, status) {
console.log(data);
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
/* if file-upload error */
alert(data.error);
} else {
// file successfully uploaded
alert(data.msg);
}
}
},
error: function (data, status, e) {
alert(e);
}
});
return false;
});
}
UPLOAD;
// bind $upload code to onInitializeForm
$grid->setNavEvent('add', 'onInitializeForm', $upload);
and the Ajax file uploader (doajaxfileupload.php):
<?php
$error = "";
$msg = "";
$fileElementName = 'fileToUpload';
if(!empty($_FILES[$fileElementName]['error']))
{
switch($_FILES[$fileElementName]['error'])
{
case '1':
$error = 'The uploaded file exceeds the upload_max_filesize directive in php.ini';
break;
case '2':
$error = 'The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form';
break;
case '3':
$error = 'The uploaded file was only partially uploaded';
break;
case '4':
$error = 'No file was uploaded.';
break;
case '6':
$error = 'Missing a temporary folder';
break;
case '7':
$error = 'Failed to write file to disk';
break;
case '8':
$error = 'File upload stopped by extension';
break;
case '999':
default:
$error = 'No error code avaiable';
}
}elseif(empty($_FILES[$fileElementName]['tmp_name']) || $_FILES[$fileElementName]['tmp_name'] == 'none')
{
$error = 'No file was uploaded..';
}else
{
$msg .= " File Name: " . $_FILES[$fileElementName]['name'] . ", ";
$msg .= " File Size: " . @filesize($_FILES[$fileElementName]['tmp_name']);
//for security reason, we force to remove all uploaded file
//@unlink($_FILES[$fileElementName]);
$fname = basename($_FILES[$fileElementName]['name']);
if (move_uploaded_file($_FILES[$fileElementName]['tmp_name'], $fname)) {
$msg .= " OK";
} else {
$error= 'Possible file upload attack';
@unlink($_FILES['fileToUpload']);
}
//@unlink($_FILES['fileToUpload']);
}
echo "{";
echo "error: '" . $error . "',\n";
echo "msg: '" . $msg . "'\n";
echo "}";
?>
精彩评论