jQuery Grid Plugin - jqGrid - Topic: file upload again

kobruleht on file upload again

Mon, 26 Sep 2011 18:27:51 +0300

ajaxFileupload() uses undocumented jquery handleError() method. HandleError was removed in jquery 1.5 .

So this code does not work anymore. Also this does not post other form fields.

Where to find sample which posts file and other form fields also in submit button is clicked in add or edit form?

internetbug256 on file upload again

Tue, 21 Jun 2011 00:21:32 +0300

Hi Riza

Are you sure that the above code actually works? I tried it using KCfinder and the file uploader appears only when creating the inline form. It appears right on top of the inline form, without asking permission, and it never loads again.

I think I am missing something here, like triggering the uploader too in some other event, but since I am newbie to Jqgrid, I can't figure it out...

Any help out there? Thanks

Gabriel

riza_nurhadi on file upload again

Mon, 29 Nov 2010 22:16:59 +0200

Hello ,

my problem is the same.

i need to upload the file. but at the same time i need file manager.

and it seems like uploading the file using jqGrid is not the solution.

i found 2 solution to upload the file and at the same time using file manager to manage the file.

that is using free plugin

using jqGrid only to save the path to the file.

Using KcFinder http://kcfinder.sunhater.com/
Or Using KFM File Manager http://kfm.verens.com/

I'm choosing KcFinder because that plugin doesn't need to create table in dbase. and its preety simple to integrate.

KFM is also a good plugin but i'm not using it because i still don't know how to handle the security problem in CodeIgniter.

so KcFinder it is. its simple.

this my configuration in colModel

name:"file"

,index:"file"

,editable:true

,editoptions:{

,readonly:"true"

,dataInit:function(element){

// KCFINDER

                window.KCFinder = {
                                   callBack: function(url) {
                                       window.KCFinder = null;
                                       $("#file").val(url);
                                   }
                               };
                               window.open("yourURL/kcfinder/browse.php?type=files&dir=files/public", "kcfinder_textbox",
                                   "status=0, toolbar=0, location=0, menubar=0, directories=0, " +
                                   "resizable=1, scrollbars=0, width=800, height=600"
                               );

// KFM

                 // window.SetUrl=function(val){
                           // val=val.replace(/[a-z]*:\/\/[^\/]*/,\'\');
                               // $("#file").val(val);
                           // };
                           // var kfm_url="yourURL/kfm/";
                           // window.open(kfm_url,"kfm","modal,width=600,height=400");

}

With this you can get the "Path to Your File" value and save it into textbox.

KcFinder can use IFRAME to open FileManager. if you can integrate it. please tell me 🙂

tony on file upload again

Wed, 02 Jun 2010 20:38:01 +0300

HEllo,

I think that this is possible using formatters

Regards

Tony

Ricardo Montalban on file upload again

Tue, 01 Jun 2010 10:41:30 +0300

Hi Tony, thank you for the response. It seems that snippet you included might work when the only thing being uploaded is a file and no other fields?

I have a form with a number of text fields as well as a photo, when you click the "edit" button a modal pops up with the various editable fields and a file field (because the photo has edittype: 'file') but the form is not enctype="multipart/form-data" so no image can be uploaded.

What I'm trying to figure out is this:

1. I have a grid that has an image, a name and a caption

2. There is an edit button that, when clicked opens a modal window with a form to edit those three things

3. This form has a file input field and two text fields

4. You select the image, enter the text, hit submit and everything gets uploaded/updated/added.

Is this just not possible with jqgrid? It seems you can upload a file (using a third-party ajax file upload plugin) or you can handle text fields but you cannot do both in one form with jqgrid. Is this correct?

tony on file upload again

Sun, 30 May 2010 12:42:08 +0300

Hello,

here is a little code sniplet which works ok in my app using the phpletter plugin

onInitializeForm : function(formid)

{

//These are needed for fileupload plugin
$(formid).attr("method","POST");
$(formid).attr("action","");
$(formid).attr("enctype","multipart/form-data");
// Create a button bellow the file field
$("<br/><button id='buttonUpload'>Upload</button>").insertAfter("#fileToUpload",formid);
// bind a event
$("#buttonUpload",formid).click(function(){
   $.ajaxFileUpload({
       url:'doajaxfileupload.php',
       secureuri:false,
       fileElementId:'fileToUpload',
       dataType: 'json',
       success: function (data, status) {
            if(typeof(data.error) != 'undefined')
           {
               if(data.error != '')
               {
                   alert(data.error);
               }else{
                   $("#fileToUpload").val("");
                   alert(data.msg);
               }
           }
       },
       error: function (data, status, e)
       {
           alert(e);
       }
   });
   return false;
});

}

Where "fileToUpload" is a colmodel field defined as edittype – file

Hope this helps

Best Regards

Tony

Ricardo Montalban on file upload again

Fri, 28 May 2010 07:26:46 +0300

Hello Tony,

How would you implement using another plugin within jqgrid? I have an edit field that is part of a larger form and I would like to enable image uploading so how would I even begin to integrate something like that phpletter plugin you linked to?

-Best

tony on file upload again

Sun, 31 May 2009 11:04:30 +0300

Hello,

It is not so easy. Instead that we use form jqGrid post data to the server via ajax. As you known file upload via ajax is not possible, we need to make some trick (use hidden iframe) to do this, but I think it is better to use another plugin.

Best Regards

Tony

xuding on file upload again

Thu, 28 May 2009 08:53:56 +0300

But still I think it won't be very tough to make the modal box to post file out. isn't it ?

Just need to set the <form> in modal box with correct parameters such as

enctype="multipart/form-data", method ="post"

and when add/edit is clicked, it posts the file.

correct me if i am wrong.

I think it will be a great enhancement if jqgrid is able to handle file upload.

Regards

The-Di-Lab

xuding on file upload again

Thu, 28 May 2009 08:44:21 +0300

Okay, I see.

Then I think I have already put up the above plugin with jqgrid 3.4 in my demo

page.

http://www.the-di-lab.com

Thanks anyways.

Regards

The-Di-Lab

tony on file upload again

Thu, 28 May 2009 04:09:58 +0300

Hello,

Yes, the file is not uploaded. As you known uploading a file requiere diffrent approach. I put this in order to be easy use some other plugin like this one:

http://www.phpletter.com/Demo/.....load-Demo/

Regards

Tony

xuding on file upload again

Wed, 27 May 2009 19:53:50 +0300

Hi,Tony

I have tested the edittype: file.

and I found out that it did give me a <input type=file> ,but my doubt is that in it did not post the file from modal box.

Do I need to set something else except edittype:file, in order to let the modal box post file to the backend ?

Regards

The-Di-Lab

ps: The-Di-Lab = Xu Ding

xuding on file upload again

Wed, 27 May 2009 04:38:28 +0300

well,well, what to say ?

awsome !

tony on file upload again

Wed, 27 May 2009 02:59:37 +0300

Hello again,

Sorry for this. I really missed this in the docs. Also we have a couple of new editteipes:

Thease types are

button, image and file.

Sorry again

Best Regards

Tony

tony on file upload again

Wed, 27 May 2009 02:53:59 +0300

Hello,

If you carefully read the changes in 3.5 maybe you will find edittype:'file' 😉

Regards

Tony

xuding on file upload again

Tue, 26 May 2009 22:24:07 +0300

Hi Tony:

I know that many ppl have asked why you are not adding a file upload field into modal box. and you have answered that we can integrate file uploader into jqgrid.

but for me, I still dun understand, why can not you just add <input type=file> into modal box. and it posts a file to the backend.

Regards

Xu Ding