ueditor版本python3_GitHub - crazyinstall/DjangoUeditor3: Django Ueditor 兼容Python3改进，Python2上也可用...
本模塊幫助在Django應用中集成百度Ueditor HTML編輯器,Django是Python世界最有影響力的web框架。
Ueditor HTML編輯器是百度開源的在線HTML編輯器,功能非常強大，像表格可以直接拖動調整單元格大小等。
更新歷史
###[2015-1-17] Ver:1.9.143
Fix:當models.py中toolbars變量使用unicode字符時，編輯器無法加載的問題
###[2014-7-8] Ver:1.8.143
Fix:當admin使用inlines生成多實例時widget命名不正確的問題
###[2014-6-27] Ver:1.7.143
Fix:解決在admin管理后臺的使用問題。
增加year,month,day的上傳路徑變量
###[2014-6-25]
由于Ueditor從1.4版本開始，API發生了非常大的改動和不兼容，導致DjangoUeditor上一個版本的升級后上傳功能不能用等，因此
本次重新設計了API，后端上傳的代碼幾乎完全重寫了。
更新到1.5.143，即版本號為1.5，使用了Ueditor 1.4.3版本。
重新設計了UeditorWidget、UeditorField。
新增了自定義Ueditor按鈕的功能
注意：本次升級與之前版本不兼容，但是在使用體驗上差別不大。
###[2014-6-16]
更新到Ueditor 1.4.3
###[2014-5-15]
增加不過濾 script,style ,不自動轉div為p的腳本
修復在django 1.6和python2.7下的警告
使用 json 代替 django 中的 simplejson
用content_type 代替原來的 mime_type
###[2014-5-7]
更新到Ueditor 1.3.6
BUGfix:更新UEditor文件夾名字，避免在linux出現找不到靜態文件問題
添加一種樣式，besttome, 希望大家喜歡
###[2013-2-22]
更新到Ueditor 1.2.5
BUGfix:更新UEditor文件夾名字，避免在linux出現找不到靜態文件問題
BUGfix:現在支持south更新了
針對csrf導致上傳圖片失敗的問題，現在默認上傳視圖開啟了csrf_exempt裝飾
使用方法
##1、安裝方法
* 方法一：將github整個源碼包下載回家，在命令行運行：
python setup.py install
* 方法二：使用pip工具在命令行運行(推薦)：
pip install DjangoUeditor
##2、在Django中安裝DjangoUeditor
在INSTALL_APPS里面增加DjangoUeditor app，如下：
INSTALLED_APPS = (
#........
'DjangoUeditor',
)
##3、配置urls
url(r'^ueditor/',include('DjangoUeditor.urls' )),
##4、在models中的使用
from DjangoUeditor.models import UEditorField
class Blog(models.Model):
Name=models.CharField(,max_length=100,blank=True)
Content=UEditorField(u'內容',width=600, height=300, toolbars="full", imagePath="", filePath="", upload_settings={"imageMaxSize":1204000},
settings={},command=None,event_handler=myEventHander(),blank=True)
說明
UEditorField繼承自models.TextField,因此你可以直接將model里面定義的models.TextField直接改成UEditorField即可。
定義UEditorField時除了可以直接傳入models.TextFieldUEditorField提供的參數外，還可以傳入UEditorField提供的額外的參數
來控制UEditorField的外觀、上傳路徑等。
UEditorField的參數如下：
width，height :編輯器的寬度和高度，以像素為單位。
toolbars :配置你想顯示的工具欄，取值為mini,normal,full，代表小，一般，全部。如果默認的工具欄的按鈕數量不符合您的要求，您可以在settings里面配置自己的顯示按鈕。參見后面介紹。
imagePath :圖片上傳后保存的路徑,如"images/",實現上傳到"{{MEDIA_ROOT}}/images"文件夾。
注意：如果imagePath值只設置文件夾，則未尾要有"/"
imagePath可以按python字符串格式化：如"images/%(basename)s_%(datetime)s.%(extname)s"。這樣如果上傳test.png，則文件會
被保存為"{{MEDIA_ROOT}}/images/test_20140625122399.png"。
imagePath中可以使用的變量有：
time :上傳時的時間，datetime.datetime.now().strftime("%H%M%S")
date ：上傳時的日期，datetime.datetime.now().strftime("%Y%m%d")
datetime ：上傳時的時間和日期，datetime.datetime.now().strftime("%Y%m%d%H%M%S")
year : 年
month : 月
day : 日
rnd : 三位隨機數，random.randrange(100,999)
basename ： 上傳的文件名稱，不包括擴展名
extname : 上傳的文件擴展名
filename : 上傳的文件名全稱
filePath : 附件上傳后保存的路徑，設置規則與imagePath一樣。
upload_settings : 字典值,
例:upload_settings={
imagePathFormat:"images/%(basename)s_%(datetime)s.%(extname)s",
imageMaxSize:323232
fileManagerListPath:"files"
}
upload_settings的內容就是ueditor/php/config.json里面的配置內容，因此，你可以去看config.json或者官方文檔內容來決定
該如何配置upload_settings,基本上就是用來配置上傳的路徑、允許上傳的文件擴展名、最大上傳的文件大小之類的。
上面的imagePath和filePath被單獨提取出來配置，原因是因為這兩個參數是最常使用到的，imagePath就相當于upload_settings里面的
imagePathFormat，filePath就相當于upload_settings里面的filePathFormat。
您upload_settings里面設置了imagePathFormat,也可以在UeditorField里面設置imagePath，效果是一樣的。但是如果兩者均設置，
則imagePath優先級更高。
涂鴉文件、截圖、遠程抓圖、圖片庫的xxxxPathFormat如果沒有配置，默認等于imagePath.
遠程文件庫的xxxxPathFormat如果沒有配置，默認等于filePath.
settings : 字典值,配置項與ueditor/ueditor.config.js里面的配置項一致。
command : 可以為Ueditor新增一個按鈕、下拉框、對話框,例：
Description = UEditorField(u'描述', blank=True, toolbars="full", imagePath="cool/", settings={"a": 1},
command=[myBtn(uiName="mybtn1", icon="d.png", title=u"1摸我", ajax_url="/ajaxcmd/"),
myCombo(uiName="myCombo3",title=u"ccc",initValue="aaa")
])
以上代碼可以會Ueditor增加一個按鈕和一個下拉框。command是一個UEditorCommand的實例列表。如果你要在Ueditor的工具欄上增加一個
自定義按鈕，方法如下：
from DjangoUeditor.commands import UEditorButtonCommand,UEditorComboCommand
#定義自己的按鈕命令類
class myBtn(UEditorButtonCommand):
def onClick(self):
return u"""
alert("爽!"); //這里可以寫自己的js代碼
editor.execCommand(uiName);
"""
def onExecuteAjaxCommand(self,state):
""" 默認在command代碼里面加入一段ajax代碼，如果指定了ajax_url和重載本方法，則在單點按鈕后
會調用ajax_url.本方法重載是可選的。
"""
if state=="success":
return u"""
alert("后面比較爽!"+xhr.responseText);//這里可以寫ajax成功調用的js代碼
"""
if state=="error":
return u"""
alert("討厭，摸哪里去了！"+xhr.responseText);//這里可以寫ajax錯誤調用的js代碼
"""
UEditorButtonCommand有初始化參數:
uiName:按鈕名稱
title:按鈕提示信息
index:按鈕顯示的位置索引
ajax_url：單擊時調用的ajax url
UEditorComboCommand可以在Ueditor上增加一個下拉框
UEditorDialogCommand可以在Ueditor上增加一個對話框，一般與UEditorButtonCommand配合使用。暫未實現
event_handler : 用來為Ueditor實例綁定事件偵聽，比較當選擇區改變時將按鈕狀態置為禁止。
from DjangoUeditor.commands import UEditorEventHandler
class myEventHander(UEditorEventHandler):
def on_selectionchange(self):
return """
function getButton(btnName){
var items=%(editor)s.ui.toolbars[0].items;
for(item in items){
if(items[item].name==btnName){
return items[item];
}
}
}
var btn=getButton("mybtn1");
var selRanage=id_Description.selection.getRange()
btn.setDisabled(selRanage.startOffset == selRanage.endOffset);
"""
我們可以繼承UEditorEventHandler創建自己的事件偵聽類，例如上面myEventHander，然后在myEventHander中
增加on_eventname的方法，在里面返回偵聽該event的js代碼。例如上例on_selectionchange,就會在前端js中
生成id_Description.addListener('selectionchange', function () {.......});
如果要偵聽contentchange事件，就在myEventHander中增加一個on_contentchange方法，然后在該方法中返回js代碼。
##5、在表單中使用非常簡單，與常規的form字段沒什么差別，如下：
class TestUeditorModelForm(forms.ModelForm):
class Meta:
model=Blog
***********************************
如果不是用ModelForm，可以有兩種方法使用：
1: 使用forms.UEditorField
from DjangoUeditor.forms import UEditorField
class TestUEditorForm(forms.Form):
Description=UEditorField("描述",initial="abc",width=600,height=800)
2: widgets.UEditorWidget
from DjangoUeditor.widgets import UEditorWidget
class TestUEditorForm(forms.Form):
Content=forms.CharField(label="內容",widget=UEditorWidget(width=800,height=500, imagePath='aa', filePath='bb',toolbars={}))
widgets.UEditorWidget和forms.UEditorField的輸入參數與上述models.UEditorField一樣。
說明 關于第一種方法，需要在代碼中建立相應的類(比如就在views.py中)，并且需要在views.py渲染視圖的時候返回到模板(template)中，對于上面的代碼，具體使用可能如下(在views.py中)：
from DjangoUeditor.forms import UEditorField class TestUEditorForm(forms.Form):
Description=UEditorField("描述",initial="abc",width=600,height=800)
def edit_description_view(request):
form = TestUEditorForm()
return render(request,'edit-description.htm',{"form": form})
而在edit-description.htm這個模板(template)里面，只需要在模板相應位置輸出form即可：
{{ form }}
##6、Settings配置
在Django的Settings可以配置以下參數：
UEDITOR_SETTINGS={
"config":{
#這里放ueditor.config.js里面的配置項.......
},
"upload":{
#這里放php/config.json里面的配置項.......
}
}
##7、在模板里面：
......
{{ form.media }} #這一句會將所需要的CSS和JS加進來。
......
注：運行collectstatic命令，將所依賴的css,js之類的文件復制到{{STATIC_ROOT}}文件夾里面。
##8、高級運用：
****************
動態指定imagePathFormat等文件路徑
****************
這幾個路徑文件用于保存上傳的圖片或附件，您可以直接指定路徑，如：
UEditorField('內容',imagePath="uploadimg/")
則圖片會被上傳到"{{MEDIA_ROOT}}/uploadimg"文件夾，也可以指定為一個函數，如：
def getImagePath(model_instance=None):
return "abc/"
UEditorField('內容',imagePath=getImagePath)
則圖片會被上傳到"{{MEDIA_ROOT}}/abc"文件夾。
****************
使上傳路徑(如imagePathFormat)與Model實例字段值相關
****************
在有些情況下，我們可能想讓上傳的文件路徑是由當前Model實例字值組名而成，比如：
class Blog(Models.Model):
Name=models.CharField('姓名',max_length=100,blank=True)
Description=UEditorField('描述',blank=True,imagePath=getUploadPath,toolbars="full")
id | Name | Description
------------------------------------
1 | Tom | ...........
2 | Jack | ...........
我們想讓第一條記錄上傳的圖片或附件上傳到"{{MEDIA_ROOT}}/Tom"文件夾,第2條記錄則上傳到"{{MEDIA_ROOT}}/Jack"文件夾。
該怎么做呢，很簡單。
def getUploadPath(model_instance=None):
return "%s/" % model_instance.Name
在Model里面這樣定義：
Description=UEditorField('描述',blank=True,imagePath=getUploadPath,toolbars="full")
這上面model_instance就是當前model的實例對象。
還需要這樣定義表單對象：
from DjangoUeditor.forms import UEditorModelForm
class UEditorTestModelForm(UEditorModelForm):
class Meta:
model=Blog
特別注意：
**表單對象必須是繼承自UEditorModelForm，否則您會發現model_instance總會是None。
**同時在Admin管理界面中，此特性無效，model_instance總會是None。
**在新建表單中，model_instance由于還沒有保存到數據庫，所以如果訪問model_instance.pk可能是空的。因為您需要在getUploadPath處理這種情況
##9、其他事項：
**本程序版本號采用a.b.ccc,其中a.b是本程序的號，ccc是ueditor的版本號，如1.2.122，1.2是DjangoUeditor的版本號，122指Ueditor 1.2.2.
**本程序安裝包里面已經包括了Ueditor，不需要再額外安裝。
**目前暫時不支持ueditor的插件
**別忘記了運行collectstatic命令，該命令可以將ueditor的所有文件復制到{{STATIC_ROOT}}文件夾里面
**Django默認開啟了CSRF中間件，因此如果你的表單沒有加入{% csrf_token %}，那么當您上傳文件和圖片時會失敗
總結
以上是生活随笔為你收集整理的ueditor版本python3_GitHub - crazyinstall/DjangoUeditor3: Django Ueditor 兼容Python3改进，Python2上也可用...的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： gis属性表怎么导成excel_第022
- 下一篇： as f报错 open with_一篇文