1

ファイルアップロードアイテムを含むextフォームパネルがあります。コードを以下に示します。

fp = new Ext.FormPanel({
         fileUpload: true,
         autoHeight: true,
         bodyStyle: 'padding: 10px 10px 0 10px;',
         labelWidth: 50,
         defaults: {
             anchor: '95%',
             allowBlank: false,
             msgTarget: 'side'
         },
         items: [
            {
                xtype: 'fileuploadfield',
                id: 'form-file',
                emptyText: 'Select excel file',
                fieldLabel: 'File',
                name: 'file',
                buttonText: 'Choose File',
                buttonCfg: {
                    iconCls: 'upload-icon'
                }
            }
         ],
         buttons: [{
            text: 'Load',
             handler: function(){                   
                if(fp.getForm().isValid()){
                  fp.getForm().submit({
                      url: myURL,
                      waitMsg: 'Uploading your photo...',
                      success: function(fp, o){
                        // I want to get loaded excel data list
                      },
                      failure : function(fp,o)
                      {
                        console.log('error');
                      }
                  });
                 }
             }
         }]
     });

アップロードされたExcelデータを操作するためのスプリングコントローラーといくつかのサービスがあります。Excel をアップロードした後、データを Excel で反復処理してリストに入れます。

@RequestMapping("/uploadExcel")
@ResponseBody
public Map<String, ? extends Object> uploadExcellData(@RequestParam("file") MultipartFile file)
{
    Map<String, Object> result = new HashMap<String,Object>();
    try
    {
        result = uploadService(file);
    }
    catch(Exception ex)
    {
        logger.error(ex.getMessage(), ex);
    }

    return result;
}

public Map<String,Object> uploadService(MultipartFile argFile) throws BLOException, DAOException 
{
    Map<String,Object> result = new HashMap<String,Object>(3);

    List importExcelList = null;
    try 
    {
        if (!argFile.isEmpty()) 
        {   
            importExcelList = parseExcelAndCreateListFunction(argFile.getInputStream());

            result.put("total", new Integer(importExcelList.size()));
            result.put("success", true);

            result.put("data", importExcelList);
        }
    } 
    catch (IOException e) 
    {
        logger.error(e.getMessage(), e);
    }

    return result;
}

このコードを実行すると、" NetworkError: 404 Not Found" が得られました。フォーム送信後にエクセルのデータ一覧を返したい。私はこれを行うことができませんでした。送信コールバックでExcelデータリストを取得するにはどうすればよいですか?

4

2 に答える 2

0

success追加のパラメーターを返し、メソッドパラメーターをチェックインする必要があると思いますaction。Extjs Docs (action.result)を確認してください。

于 2013-03-18T19:08:58.063 に答える
0

次のようにJavaファイルを更新しました：

@RequestMapping("/uploadExcel")
@ResponseBody
public void uploadExcellData(@RequestParam("file") MultipartFile file, HttpServletResponse response)
{
    Map<String, Object> result = new HashMap<String,Object>();
    try
    {
        result = uploadService(file);
    }
    catch(Exception ex)
    {
        logger.error(ex.getMessage(), ex);
    }

    response.setContentType("text/html; charset=UTF-8");
    response.getWriter().write("{success:true, total:'"+result.size()+"', data:'"+result+"'}");

}

public List uploadService(MultipartFile argFile) throws BLOException, DAOException 
{
    List importExcelList = null;
    try 
    {
        if (!argFile.isEmpty()) 
        {   
            importExcelList = parseExcelAndCreateListFunction(argFile.getInputStream());
        }
    } 
    catch (IOException e) 
    {
        logger.error(e.getMessage(), e);
    }

    return importExcelList;
}

また、js ファイルを次のように更新しました。

fp = new Ext.FormPanel({
   fileUpload: true,
   autoHeight: true,
   bodyStyle: 'padding: 10px 10px 0 10px;',
   labelWidth: 50,
   defaults: {
       anchor: '95%',
       allowBlank: false,
       msgTarget: 'side'
   },
   items: [
      {
          xtype: 'fileuploadfield',
          id: 'form-file',
          emptyText: 'Select excel file',
          fieldLabel: 'File',
          name: 'file',
          buttonText: 'Choose File',
          buttonCfg: {
              iconCls: 'upload-icon'
          }
      }
   ],
   buttons: [{
      text: 'Load',
       handler: function(){                   
          if(fp.getForm().isValid()){
            fp.getForm().submit({
                url: myURL,
                waitMsg: 'Uploading your photo...',
                success: function(fp, o){
                    var resData = Ext.util.JSON.decode(o.result.data);
                    // I can iterate resData
                },
                failure : function(fp,o)
                {
                    Ext.MessageBox.alert("Failure", "your error message");
                }
            });
           }
       }
   }]
});

上記のように問題を解決しました。

于 2013-04-10T19:18:20.013 に答える