forms - 在 jqgrid 的添加/编辑中上传文件？

Question

我使用 jqgrid，当我添加一行时，我想在服务器上推送一个文件。

我已经阅读了很多帖子，但我没有找到一个可行的例子。

许多示例不适用于 jquery 1.5。

我找到了理事会的人：

http://www.jainaewen.com/files/javascript/jquery/iframe-post-form.html#api

http://malsup.com/jquery/form/#file-upload

但是，我不知道如何将它与 jqgrid 一起使用。

有人可以给我一个使用 jqgrid 上传文件的完整示例吗？

感谢，

Answer 1

好吧，我发现：

<script type="text/javascript" src="/static/jqueryform/jquery.form.js"></script>

<script type="text/javascript"> $(function(){

 $("#citype").jqGrid({  url:"/api/citype/getdata",
    datatype:'json',
    mtype:'POST',
    colNames:['No', 'Name', 'Icon'],
    colModel :[
      {         name:'id',
                index:'id',
                width:55,
                editable:false,
                key:true,
                hidden:true
      },
      {
                name:'name',
                index:'name',
                width:55,
                editable:true
      },
      {
                name:'icon',
                index:'icon',
                edittype:'file',
                width:80,
                align:'right',
                editable:true},
    ],
    pager:'#pager',
    rowNum:10,
    rowList:[10,20,30],
    sortname:'citype_id',
    sortorder:'desc',
    viewrecords:true,
    gridview:true,
    caption:'List',
    useDataProxy: true,
    dataProxy :  function (opts, act) {
            opts.iframe = true;
            var $form = $('#FrmGrid_citype');    //use name of the grid
            //Prevent non-file inputs double serialization
            var ele = $form.find('INPUT,TEXTAREA,SELECT').not(':file');
            ele.each(function () {
                            $(this).data('name', $(this).attr('name'));
                            $(this).removeAttr('name');
                            });

            //Send only previously generated data + files
            $form.ajaxSubmit(opts);
            //Set names back after form being submitted
            setTimeout(function () {
                            ele.each(function () {
                                    $(this).attr('name', $(this).data('name'));
                                    jQuery("#citype").trigger('reloadGrid');
                                    });
                            }, 200);
    },
    editurl:"/submit"


  });

// Action Option   jQuery("#citype").jqGrid('navGrid','#pager',
    {}, //options
    {    // edit options
        closeAfterEdit:true,
        height:280,
        reloadAfterSubmit:true,
        closeOnEscape : true,
        useDataProxy: true,
        onInitializeForm : function(formid){
                    $(formid).attr('method','POST');
                    $(formid).attr('action','');
                    $(formid).attr('enctype','multipart/form-data');
                }
    },
    {    // add options
        closeAfterAdd:true,
        height:280,
        reloadAfterSubmit:true,
        closeOnEscape : true,
        useDataProxy: true,
        onInitializeForm : function(formid){
                    $(formid).attr('method','POST');
                    $(formid).attr('action','');
                    $(formid).attr('enctype','multipart/form-data');
                }
    },
    {   // del options
        reloadAfterSubmit:true
    },
    {} // search options   );