ExtJS——文本编辑器
来源:互联网 发布:青年网络公开课 官网 编辑:程序博客网 时间:2024/04/29 11:17
index.php
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title></title> <link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" /> <script type="text/javascript" src="ext-all-debug.js"></script> <script type="text/javascript" src="ext-all.js"></script> <script type="text/javascript" src="bootstrap.js"></script></head><body><script type="text/javascript">Ext.onReady(function(){ var form = new Ext.form.FormPanel({ renderTo:Ext.getBody(), width:700, method:'POST', layout:'anchor',//这个布局将子元素的位置与父容器大小进行关联固定. 如果容器大小改变, 所有固定的子项将按各自的anchor 规则自动被重新渲染固定.-取值:Auto - card - fit - hbox - vbox - anchor - table column border accordion 没有form titile:'EXT文本编辑器', items:[{ xtype:'htmleditor', anchor:'100%', name:'content', height:250, enableFont:true,//是否启用选择字体按钮。 },{ xtype:'panel', anchor:'100%', title:'编辑的内容', height:250, html:"<div id='viewcontent'></div>" }], bbar:[{ xtype:'tbfill',//一个非渲染的占位符控件,通知工具栏的布局开始使用右对齐的按钮容器方式. },{ xtype:'button', text:'确定', // disabled:true,//True时为不可用. //formBind:true, listeners:{ click:function(){ var thisForm = form.getForm(); thisForm.submit({ url:'php/formSubmit.php', success:function(form,action){ Ext.getDom('viewcontent').innerHTML = action.result.msg; } }) } } },{xtype:'tbfill'}] });});</script></body></html>
formSubmit.php<?php $content=$_REQUEST["content"]; $res=array('success'=>true,'msg'=>$content);echo json_encode($res); ?>
0 0