手记

ExtJs里使用FckEditor

Ext.onReady(function() {   

 var fckFormObj = new Ext.FormPanel({   
  labelWidth:75,   
  url:"",   
  title:"EXT/FCKEditor 集成 -- vb2005xu | cdlinux.ys168.com",   
  bodyStyle:"padding:5px 5px 0",   
  defaultType:"form",   
  buttons:[   
   {   
    text:"Save" ,   
    type:'submit',   
    handler: function(){   
     //获取fckeditor内容赋给textarea   
     Ext.get('fckInstance').dom.value = "jjj";//fckobj.GetXHTML(true) + '提交后';     
     Ext.MessageBox.alert('FCK内容',Ext.get('fckInstance').dom.value);   
     if (fckFormObj.form.isValid())   
     {   
      //创建响应测试函数         
      var fckobj_temp = FCKeditorAPI.GetInstance('fckInstance');   
      //fckobj_temp.UpdateLinkedField();//此方法被绑定到submit事件   
         
      fckFormObj.form.doAction('submit',{   
       url:'submit.php',   
       method:'post',   
       waitMsg:'正在提交,请稍等',   
        success:function(form,action){//成功   
         showInfo('Success',fckobj_temp.GetXHTML(true));   
        } ,   
        failure:function(form,action){//失败   
         showInfo('Failed','网络中断造成连接失败');   
        }   
      });   
     }   
    }   
   },   
   {   
    text:"Cancel"  
   }   
  ],   
  items:[{   
      xtype:"textarea",   
      fieldLabel:"编辑",   
      labelSeparator:":",   
      id:"fckInstance", //div节点,这里要挂接FCKeditor编辑器   
      name:"fckInstance",   
      width:736,   
      height:371  
  }]   
 });   
 fckFormObj.render(document.body);   
    
 /*创建Fckeditor对象 -- 构造函数指出了Fckeditor要挂接的id,上文中的xtype : 'textarea'指定*/  
 //在页面上要求挂载fckeditor/fckeditor.js文件   
 var fckobj = new FCKeditor('fckInstance',810,350);   
 fckobj.BasePath = "/ucren/fckeditor/" ;   
 fckobj.ToolbarSet = 'Default' ;   
 fckobj.ReplaceTextarea();    
    
 //创建响应测试函数   
 function msgBox()   
 {   
  var fckobj_temp = FCKeditorAPI.GetInstance('fckInstance');   
  fckobj_temp.UpdateLinkedField();//此方法被绑定到submit事件   
  Ext.MessageBox.alert('FCK内容',fckobj_temp.GetXHTML( true ));   
     
 }   
    
 function showInfo(tip,str){   
  var win = new Ext.Window({   
   title: '信息提交应答提示 -- ' + tip,   
   width: 400 , height: 200 ,autoScroll: true ,   
   html: '<h1>'+ str +'</h1>'       
  });   
  win.show();   
 }   
});  

0人推荐
随时随地看视频
慕课网APP