包含extjs3.2附件上传的词条

发布时间:2023-12-08

包含extjs3.2附件上传的词条

更新:2022-11-12 06:15

本文目录一览:

  1. [求救!Extjs fileuploadfield怎么上传到服务器 后台用.net写](#求救!Extjs fileuploadfield怎么上传到服务器 后台用.net写)
  2. [extjs 3.4中 怎么给htmlEdit添加图片插件 实现图片上传功能](#extjs 3.4中 怎么给htmlEdit添加图片插件 实现图片上传功能)
  3. [extjs 如何在动态生成的EditorGridPanel的单元格里面添加一个上传文件的功能?](#extjs 如何在动态生成的EditorGridPanel的单元格里面添加一个上传文件的功能?)
  4. [extjs ajax 可以上传文件吗](#extjs ajax 可以上传文件吗)
  5. ExtJs中怎么上传文件

求救!Extjs fileuploadfield怎么上传到服务器 后台用.net写

var formFilePath = new Ext.ux.form.FileUploadField({
    id: 'PrjFilePath',
    emptyText: '请选择要导入的文件!',
    fieldLabel: '文件路径',
    name: 'PrjFilePath',
    buttonText: '',
    buttonCfg: { iconCls: 'page_white_put' }
});

后台代码:

HttpPostedFile postedFile = Request.Files["PrjFilePath"];
string ImportFile = postedFile.FileName;
string fileName = SaveFile(postedFile, Server, Request); //文件保存至服务器
System.IO.FileStream stream = System.IO.File.OpenRead(fileName);
//文件流操作你就根据你的业务来 自行搞定

保存方法:

String SaveFile(HttpPostedFile postedFile, HttpServerUtility server, HttpRequest request)
{
    String fullName = "";
    try
    {
        String fileName = Path.GetFileName(postedFile.FileName);
        String fileExtension = Path.GetExtension(fileName);
        String year = DateTime.Now.Year.ToString();
        DateTime date = DateTime.Now;
        //生成文件名
        String saveName = date.ToString("yyyyMMddHHmmssfffffff");
        String tmpName = saveName + fileExtension;
        String path = server.MapPath(@"~/" + ExcelHelper.PATH_NAME);
        fullName = path + @"\" + tmpName;
        postedFile.SaveAs(fullName);
    }
    catch (Exception)
    {
        throw new Exception("保存上传文件出错!");
    }
    return fullName;
}

extjs 3.4中 怎么给htmlEdit添加图片插件 实现图片上传功能

首先要使用extjs自带的HTMLEditor,然后在原有的工具条上添加一个图片按钮,点击这个图片按钮要弹出窗口,这个窗口负责实现上传功能,实现上传后,要将上传的图片路径添加到 HTMLEditor 的光标处,并且要以 <img /> 的方式,这样 HTMLEditor 才能解析出来。 实现代码如下: 前台JSP页面:

fieldLabel : '商品特性',
id : 'shopSp.spTxms',
name : 'shopSp.spTxms',
xtype : 'StarHtmleditor',
anchor : '93%'

StarHtmleditor.js代码如下:

var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, {
    addImage : function() {
        var editor = this;
        var imgform = new Ext.FormPanel({
            region : 'center',
            labelWidth : 55,
            frame : true,
            bodyStyle : 'padding:5px 5px 0',
            autoScroll : true,
            border : false,
            fileUpload : true,
            items : [{
                xtype : 'textfield',
                fieldLabel : '选择文件',
                id : 'UserFile',
                name : 'UserFile',
                inputType : 'file',
                allowBlank : false,
                blankText : '文件不能为空',
                anchor : '90%'
            }],
            buttons : [{
                text : '上传',
                handler : function() {
                    if (!imgform.form.isValid()) { return; }
                    imgform.form.submit({
                        waitMsg : '正在上传......',
                        url : 'HTMLEditorAddImgCommonAction.action',
                        success : function(form, action) {
                            var element = document.createElement("img");
                            element.src = action.result.fileURL;
                            if (Ext.isIE) {
                                editor.insertAtCursor(element.outerHTML);
                            } else {
                                var selection = editor.win.getSelection();
                                if (!selection.isCollapsed) {
                                    selection.deleteFromDocument();
                                }
                                selection.getRangeAt(0).insertNode(element);
                            }
                            form.reset();
                            win.close();
                        },
                        failure : function(form, action) {
                            form.reset();
                            if (action.failureType == Ext.form.Action.SERVER_INVALID)
                                Ext.MessageBox.alert('警告','上传失败',action.result.errors.msg);
                        }
                    });
                }
            }, {
                text : '关闭',
                handler : function() {
                    win.close(this);
                }
            }]
        });
        var win = new Ext.Window({
            title : "上传图片",
            width : 300,
            height : 200,
            modal : true,
            border : false,
            iconCls : "picture.png",
            layout : "fit",
            items : imgform
        });
        win.show();
    },
    createToolbar : function(editor) {
        HTMLEditor.superclass.createToolbar.call(this, editor);
        this.tb.insertButton(16, {
            cls : "x-btn-icon",
            icon : "picture.png",
            handler : this.addImage,
            scope : this
        });
    }
});
Ext.reg('StarHtmleditor', HTMLEditor);

JS的第一句 var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, 网上是没有 var 的,不用 var 不知道为什么总是报错,另外JS一定要与JSP的编码方式一致,要不然报莫名其妙的错误,而且错误都没有显示。 后台Java代码:

public void HTMLEditorAddImg() throws IOException {
    if(!"".equals(UserFile) && UserFile != null && UserFile.length() > 0){
        File path = ImportImg(UserFile, "jpg");
        UserFilePath = "../" + path.toString().replaceAll("\\\\", "/").substring(path.toString().replaceAll("\\\\", "/").indexOf("FileImg"));
    }
    this.getResponse().setContentType("text/html");
    this.getResponse().getWriter().write("{success:'true',fileURL:'" + UserFilePath + "'}");
}

特别要注意的是路径问题,路径问题主要有2点需要注意:

  1. 前台页面引用 StarHtmleditor.js 的路径一定要正确;
  2. Htmleditor上传的图片路径一定要改,因为上传之后图片路径变为,在正常使用中图片不显示,要将该地址替换为服务器的IP地址;替换方法如下:
//获取本地IP地址,因为extjs的htmleditor上传的照片路径有问题,需要将路径替换为本机IP地址
InetAddress inet = InetAddress.getLocalHost();
shopSp.setSpTxms(shopSp.getSpTxms().replace("localhost", inet.getHostAddress().toString()));

这样基本就完成了这个HTMLEditor上传图片功能。

extjs 如何在动态生成的EditorGridPanel的单元格里面添加一个上传文件的功能?

容器(可以是form等等).GetItemText("列名") 获取到你附件列 然后SetItemText("列名",设置的值) 也可以用 控件类.SetItemValue(设置的值)

extjs ajax 可以上传文件吗

文件上传的Ajax,首先Ajax并不支持流的传输,只是在里面套了个iframe。

Ext.get('btn').on('click',function(){
    Ext.Ajax.request({
        url:'Upload.php',
        isUpload:true,
        form:'upform',
        success:function(){
            Ext.Msg.alert('upfile','文件上传成功!');
        }
    });
});
<form id="upform">
    请选择文件:<input type="file" name="imgFile" />
    <input type="button" id="btn" value="上传" />
</form>
if(!isset($_FILES['imgFile'])){
    echo json_encode(array("success"=>false, 'msg'=>"Not get Imgfile"));
    return;
}
$upfile=$_FILES['imgFile'];
$name=$upfile["name"];//上传文件的文件名
$type=$upfile["type"];//上传文件的类型
$size=$upfile["size"];//上传文件的大小
$tmp_name=$upfile["tmp_name"];//上传文件的临时存放路径
$error_cod=$upfile["error"];
if ($error_cod > 0){
    echo json_encode(array("success"=>false, 'msg'=>$error_cod));
}
$photo_tmp_file_name = ""; //这里设置存放路径
move_uploaded_file($tmp_name,$photo_tmp_file_name); //存储文件

ExtJs中怎么上传文件

在formpanal中增加一个fileUpload的属性就可以直接上传了:

Ext.onReady(function(){
    var form = new Ext.form.FormPanel({
        renderTo:'file',
        labelAlign: 'right',
        title: '文件上传',
        labelWidth: 60,
        frame:true,
        url: '服务器处理上传功能的url地址', //fileUploadServlet
        width: 300,
        height:200,
        fileUpload: true,
        items: [{
            xtype: 'textfield',
            fieldLabel: '文件名',
            name: 'file',
            inputType: 'file' //文件类型
        }],
        buttons: [{
            text: '上传',
            handler: function() {
                form.getForm().submit({
                    success: function(form, response){
                        Ext.Msg.alert('信息', response.result.msg);
                    },
                    failure: function(){
                        Ext.Msg.alert('错误', '文件上传失败');
                    }
                });
            }
        }]
    });
});