Ext HtmlEditor 上传图片

xiaoxiao2026-04-17  4

 

 出处:http://www.cnblogs.com/wuliangbo/archive/2009/03/08/1406460.html

 

 

覆盖Ext原有的HtmlEditor: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 : '选择文件',                        name : 'userfile',                        inputType : 'file',                        allowBlank : false,                        blankText : '文件不能为空',                        height : 25,                        anchor : '90%'                    }],            buttons : [{                text : '上传',                type : 'submit',                handler : function() {                    if (!imgform.form.isValid()) {return;}                    imgform.form.submit({                        waitMsg : '正在上传',                        url : 'Default.aspx',                        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);                            }                            win.hide();                        },                        failure : function(form, action) {                            form.reset();                            if (action.failureType == Ext.form.Action.SERVER_INVALID)                                Ext.MessageBox.alert('警告',                                        action.result.errors.msg);                        }                    });                }            }, {                text : '关闭',                type : 'submit',                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);

 

 

 

调用代码: Ext.onReady(function() {    Ext.QuickTips.init();    Ext.form.Field.prototype.msgTarget = 'side';    var ff = new Ext.FormPanel({                title : "文件上传",                renderTo : document.body,                width : 600,                height : 480,                labelWidth : 55,                frame : true,                items : [{                            xtype : "textfield",                            name : "title",                            fieldLabel : "标题",                            anchor : "98%"                        }, {                            xtype : "combo",                            name : "topic_id",                            fieldLabel : "所属栏目",                            anchor : "98%"                        }, {                            xtype : "textfield",                            name : "keywords",                            fieldLabel : "关键字",                            anchor : "98%"                        }, {                            xtype : "StarHtmleditor",                            name : "content",                            fieldLabel : "内容",                            anchor : "98%"                        }]    });});

 

 

 

后台代码:  protected void Page_Load(object sender, EventArgs e)        {            string fileName = string.Empty;            string fileURL = string.Empty;            string rt = string.Empty;            try            {                HttpPostedFile file = Request.Files[0];                fileName = GetFileName(file.FileName);                file.SaveAs(Server.MapPath("upload\\"+ fileName);                fileURL = "upload/" + fileName;                rt = "{success:'true',fileURL:'" + fileURL + "'}";            }            catch            {                rt = "{success:'false',fileURL:'" + fileURL + "'}";            }                          Response.Write(rt);        }                private string GetFileName(string FullName)        {            string fileName = string.Empty;            int last = FullName.LastIndexOf(@"\");            fileName = FullName.Substring(last + 1, FullName.Length - last - 1);            return fileName;        }
转载请注明原文地址: https://www.6miu.com/read-5047536.html

最新回复(0)