今天主要是实现tp框架下，在form表单提交错误时，不重新加载页面，弹出错误提示框！大牛有好多方法，就略过。和我一样的新手可以参考下。
好熟悉的界面！这不是bootstrap做的吗?ooooo,也是也不是。俺自己重写了。
用bsp，css+js要100多k了，用不了那些功能还浪费加载时间和空间。坚决不要那么做。自己重新定义了格栅16栏，3栏，5栏，重新定义了表、form等几个要用的css样式。还没有压缩，一共不到10k。自己写的用起来顺手啊，大牛勿喷！
怎么样实现无刷新提示错误那？
当然还是用ajax。先上效果图
给form添加ID，取消默认行为！
<form role="form" id='fm1' action="" method="post" enctype="multipart/form-data">
<div class="form-group 16">
<label for="activityName">活动名称</label>
<input type="text" class="form-control" name="actname" id="activityName" placeholder="请输入活动名称">
</div>
<div class="16" style="text-align: center;">
<button type="submit" class="btn btn-success" >提交申请</button> <!--onClick="submit1();"-->
</div>
</form>js代码如下:$("button[type='submit']").click(function(e){
e.preventDefault();//这个很关键，要不然就跳转了！
$.ajax({
type: "POST", //url不需要，会自动提交到控制器；
data:$('#fm1').serialize(),
error: function(request) {
},
success: function(data) {
errorlist= '<ul >';
for(var key in data)
{
errorlist+='<li><span>'+data[key]+'</span></li>';
}
errorlist+='</ul>';
SysUtil.Dialog.show('<div style="width:250px;top:600px">'+errorlist+'</div>', '错误提示', "老铁有很多错误了，请按要求输入!");
}
});
});是不是很简单！哦也！js代码中有System.Dialog.show（标题，提示html信息，底部提示）。这个是可拖动的dialog框。
不是自己写的，感谢原创作者！个人把没用的代码极限阉割，只留可以拖动和弹框功能~是原作者封装的一个类，很好用。需要原代码自己度娘搜，我把压缩代码贴在下面
window.SysUtil=window.SysUtil||{};SysUtil.Dialog=function(){function a(){this.loaded=false;this.callback=null;this.DlgContainer=null;this.DlgContainerId="errorDialog";this.domSize=null;this.dragConf={"dragable":true,"srcObj":null,"targetObj":null,"diffX":0,"diffY":0};this.html='<div class="mDlg" id="mDlg">'+'<div class="mDlg-title" id="mDlg-title">'+'<span class="mDlg-title-text" id="mDlg-title-text">{$title}</span>'+'<span class="mDlg-title-close" id="mDlg-title-close" onclick="SysUtil.Dialog.close(-1)">×</span>'+"</div>"+'<div class="mDlg-content" id="mDlg-content">{$content}</div>'+'<div class="mDlg-footer" id="mDlg-footer">{$footer}</div>'+"</div>"}a.prototype={constructor:a,_mouseup:function(c){var b=this;document.onmousemove=null;document.onmouseup=null},_mousemove:function(b){b=b||window.event;this.dragConf.targetObj.style.left=b.clientX-this.dragConf.diffX+"px";this.dragConf.targetObj.style.top=b.clientY-this.dragConf.diffY+"px"},_mousedown:function(c){c=c||window.event;var b=this;this.dragConf.diffX=c.clientX-this.dragConf.targetObj.offsetLeft;this.dragConf.diffY=c.clientY-this.dragConf.targetObj.offsetTop;document.onmousemove=function(d){b._mousemove(d)};document.onmouseup=function(d){b._mouseup(d)}},initDrag:function(){if(!this.dragConf.dragable){return}var b=this;this.dragConf.srcObj=document.getElementById("mDlg-title");this.dragConf.targetObj=this.DlgContainer;this.dragConf.srcObj.onmousedown=function(c){b._mousedown(c)}},initPostion:function(){this.domSize={"width":Math.max(document.documentElement.clientWidth,document.body.clientWidth),"height":Math.max(document.documentElement.clientHeight,document.body.clientHeight)};var b=document.documentElement.scrollTop||document.body.scrollTop;var c=Math.max(this.DlgContainer.scrollWidth,this.DlgContainer.offsetWidth,220);this.DlgContainer.style.left=parseInt((this.domSize.width-c)/2)+"px";this.DlgContainer.style.top=parseInt(this.domSize.height/4)+b+"px"},init:function(){if(this.loaded){return}this.DlgContainer=document.createElement("span");this.DlgContainer.id=this.DlgContainerId;this.DlgContainer.setAttribute("id",this.DlgContainerId);this.DlgContainer.style.position="absolute";this.DlgContainer.style.zIndex="1200";this.loaded=true},replaceVars:function(e,d,b){var c=this.html;c=c.replace("{$title}",d);c=c.replace("{$content}",e);c=c.replace("{$footer}",b);this.DlgContainer.innerHTML=c},render:function(){var b=document.body;b.insertBefore(this.DlgContainer,b.firstChild);this.initPostion();this.initDrag()},clearCallback:function(){this.callback=null},show:function(c,d,b){c=c||"";d=d||"";b=b||"";this.clearCallback();this.init();this.replaceVars(c,d,b);this.render()},close:function(b){if(document.getElementById(this.DlgContainerId)){document.body.removeChild(this.DlgContainer)}if(null!=this.callback){this.callback(b)}}};return new a()}();使用方法就是在页面中引入该js，用SysUtil.Dialog.show（巴拉巴拉）直接使用即可！下面是提示框类的css
.mDlg {box-shadow:0 0 60px 0 rgba(0,0,0,.4);background-color:#fff;border-radius:8px;
border:1px solid #888;-webkit-transition:box-shadow .25s ease-out;-moz-transition:box-shadow .25s ease-out;
transition:box-shadow .25s ease-out;}
.mDlg-title {font-size: 18px;position:relative;padding:8px 12px;line-height:14px;background-image:-webkit-gradient(linear,left top,left bottom,from(#62c462),to(#51a351));
background-image:-moz-linear-gradient(top,#62c462, #51a351);background-image:linear-gradient(top,#62c462, #51a351);
background-color:#51a351;border-radius:6px 6px 0 0;border:1px solid #62c462;box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 1px 1px rgba(0,0,0,.2);font-weight:bold;}
.mDlg-title-text {font-size:14px;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.4);}
.mDlg-title-close {position:absolute;top:50%;_top:20px;right:6px;margin-top:-7px;font-size:16px;color:#fff;cursor:pointer;}
.mDlg-content {padding:0 12px;margin:12px 0;font-size:14px;color: red;}
.mDlg-footer {text-align:center;padding:2px 12px;border-top:1px solid #EEE;}引入js和css就可以提示了。。爽不爽~ 嫌弃样式不美观，自己修改下即可！说完提示框，接下来说说tp控制器内ajax返回，这个很简单。
if (IS_POST) {
$mo = new \Model\ActivityModel;
//D('Activity')不行，估计新版本行；要自动验证必须用最原始的new方法；
if (!$mo -> create()) {//验证失败， 验证方法在ActivityModel.class.php中；create()集成了自动收集，自动验证
//通过geterror()
//show_dbg($mo->getError());
// $this -> assign('error', $mo -> getError());
// $this -> error= $mo -> getError();
$this->ajaxReturn($mo -> getError());
// $this -> display(); //layout也加载，用上面ajax只加载当前模板数据；
} else {
if ($mo -> add($_POST)) {
$this -> success('申请已收到，请等待审核~', U('index/index'));
} else {
$this -> error('error');
}
}
} else {
$this -> display();
}自动验证规则，老铁们自己写吧，我就不贴出来了。over，如果不明白的可以留言。新手，你问了我也不会。哈哈哈哈哈哈
同样是九年义务教育，你会更优秀！
最佳答案
