Need help with Datatables Jeditable and ajax upload
Need help with Datatables Jeditable and ajax upload
crajbhandari
Posts: 1Questions: 1Answers: 0
in DataTables
I have been trying to upload files to the server. Datatables Jeditable is working fine and posts data back data to the database just fine. The HTML file input element is also displayed. The problem is ajax upload is not returning $_FILES to the corresponding PHP upload file. Cant figure out where I went wrong !!!
The following is the script used
$(document).ready( function () {
/* File Upload */
$.editable.addInputType('ajaxupload', {
/* create input element */
element : function(settings) {
settings.onblur = 'ignore';
var input = $('<input type="file" id="upload" name="upload" />');
$(this).append(input);
return(input);
},
content : function(string, settings, original) {
/* do nothing */
},
plugin : function(settings, original) {
var form = this;
form.attr("enctype", "multipart/form-data");
$("button:submit", form).bind('click', function() {
//$(".message").show();
$.ajaxFileUpload({
url: settings.target,
secureuri:false,
fileElementId: 'upload',
dataType: 'html',
success: function (data, status) {
$(original).html(data);
original.editing = false;
},
error: function (data, status, e) {
alert(e);
}
});
return(false);
});
}
});
var id = -1;//simulation of id
$('.addNewExpertise').editable('addCategory.php'); /Add new category/
//============
//data table
//============
$('#main-data-table').dataTable({
"bJQueryUI": true,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "Scripts/DataSource.php",
"iDisplayLength": 50,
"sPaginationType": "full_numbers",
"aaSorting": [[ 8, "desc" ]],
"aoColumns": [ { "sClass": "column-id","bVisible": false } ,
{ "sClass": "column-name"} ,
{ "sClass": "column-expertise"} ,
{ "sClass": "column-mas"} ,
{ "sClass": "column-adb"} ,
{ "sClass": "column-eu"} ,
{ "sClass": "column-wb"} ,
{ "sClass": "column-contact"} ,
{ "sClass": "column-date"} ,
{ "sClass": "column-tags"}
],
"bAutoWidth": false
}).makeEditable({
sAddURL: "Scripts/AddData.php",
sAddHttpMethod: "POST",
sDeleteHttpMethod: "POST",
sDeleteURL: "Scripts/DeleteData.php",
"aoColumns": [
/*Name*/ {
indicator: 'Saving...',
tooltip: 'Click to edit Name',
loadtext: 'loading...',
onblur: 'submit',
type: 'text',
width: '100px',
sUpdateURL: "Scripts/UpdateData.php"
},
/*Expertise*/ {
indicator: 'Saving...',
tooltip: 'Click to edit Expertise',
loadtext: 'loading...',
sUpdateURL: "Scripts/UpdateData.php",
onblur: 'submit',
type: 'text',
/*loadurl: 'Source/Expertise.php',
loadtype: 'GET',
*/
},
/*Orignal*/ {
indicator: 'Saving...',
tooltip: 'Click to upload Orignal CV',
loadtext: 'loading...',
cancel: 'cancel',
submit: 'upload',
placeholder: '<img src="images/icons/no_cv.png">',
type: 'ajaxupload',
sUpdateURL: "Scripts/UploadFile.php"
},
/*ADB*/ {
indicator: 'Saving...',
tooltip: 'Click to upload CV in ADB Format',
loadtext: 'loading...',
cancel: 'cancel',
placeholder: '<img src="images/icons/no_cv.png">',
submit: 'upload',
type: 'ajaxupload',
sUpdateURL: "Scripts/UploadFile.php"
},
/*WB*/ {
indicator: 'Saving...',
tooltip: 'Click to upload CV in WB Format',
loadtext: 'loading...',
cancel: 'cancel',
placeholder: '<img src="images/icons/no_cv.png">',
submit: 'upload',
type: 'ajaxupload',
sUpdateURL: "Scripts/UploadFile.php"
},
/*EU*/ {
indicator: 'Saving...',
tooltip: 'Click to upload CV in EU Format',
loadtext: 'loading...',
cancel: 'cancel',
placeholder: '<img src="images/icons/no_cv.png">',
submit: 'upload',
type: 'ajaxupload',
sUpdateURL: "Scripts/UploadFile.php"
},
/*Contact*/ {
indicator: 'Saving...',
tooltip: 'Click to edit contact information',
loadtext: 'loading...',
onblur: 'submit',
type: 'textarea',
sUpdateURL: "Scripts/UpdateData.php"
},
/*Date*/ null,
/*Tags*/ { indicator: 'Saving...',
tooltip: 'Click to edit tags',
loadtext: 'loading...',
onblur: 'submit',
type: 'textarea',
sUpdateURL: "Scripts/UpdateData.php"
}
],
oAddNewRowButtonOptions: {
label: "Add",
icons: {primary:'ui-icon-plus'}
},
oDeleteRowButtonOptions: {
label: "Remove",
icons: {primary:'ui-icon-trash'}
},
oAddNewRowFormOptions: {
title: 'Add New DATA',
show: "blind",
hide: "explode",
modal: true,
width: "432px"
} ,
sAddDeleteToolbarSelector: ".dataTables_length"
});
} );
This discussion has been closed.