추가/수정에서 jqgrid의 파일을 업로드 하시겠습니까?

Question

jqgrid를 사용합니다. 행을 추가 할 때 파일을 서버에 푸시합니다.

많은 게시물을 많이 읽었지만 작동 예제를 찾지 못했습니다.

많은 예제가 jquery 1.5에서 작동하지 않습니다. 내가 하우투가있는 jqGrid 이것을 사용 아는하지 않는,

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

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

그러나 :

나는 사람 누가 회의를 발견했다.

누구나 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 );