Yii2.0 模态弹出框+ajax提交表单


Posted in PHP onMay 22, 2016

如题 我们使用模态弹出框+ajax提交表单 首先我们把index视图的create按钮添加data-toggle 和 data-target。

代码如下:

<?php 
echo Html::a('添加请假单', ['create'], ['class' => 'btn btn-success','data-toggle'=>'modal','data-target'=>'#ajax']) 
?>

在index视图添加如下代码 来显示模态弹出框:

<div class="modal bs-example-modal-lg" id="ajax">

 <div class="modal-dialog">
 
 <div class="modal-content width_reset" id="tmpl-modal-output-render"> </div>
 
 </div>

</div>

修改后的效果如下

Yii2.0 模态弹出框+ajax提交表单

然后我们修改控制器中的create方法,把render改为renderAjax即可

return $this->renderAjax('create', [
    'model' => $model,
   ]);

如果想添加表单验证我们需要修改views 里的 _form 添加上id

<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data'],'id'=>'leave-form-self']) ?>
指向 你的models 在rules添加上验证规则

 public function rules()
 {
  return [
   [['t_leave_date', 't_days', 't_reason', 't_nickname','t_leave_enddate'], 'required'],
   [['t_leave_date', 't_leave_enddate'], 'safe'],
   [['t_days'], 'number'],
   [['t_reason'], 'string'],
   [['type', 'add_time', 'uid', 'update_time', 'status', 'is_shen'], 'integer'],
   [['t_pickup', 't_nickname', 't_pass'], 'string', 'max' => 20],
   [['t_img', 'reviewer_user', 'audit_user'], 'string', 'max' => 255]
  ];
 }

效果如下

Yii2.0 模态弹出框+ajax提交表单

这样就实现了ajax提交表单

PHP 相关文章推荐
Linux下ZendOptimizer的安装与配置方法
Apr 12 PHP
腾讯QQ微博API接口获取微博内容
Oct 30 PHP
php第一次无法获取cookie问题处理
Dec 15 PHP
php生成图片验证码-附五种验证码
Aug 19 PHP
php parse_str() 函数的定义和用法
May 23 PHP
PHP socket 模拟POST 请求实例代码
Jul 18 PHP
php file_get_contents取文件中数组元素的方法
Apr 01 PHP
PHP中Cookie的使用详解(简单易懂)
Apr 28 PHP
PHP实现微信模拟登陆并给用户发送消息的方法【文字,图片,图文】
Jun 29 PHP
PHP封装的验证码工具类定义与用法示例
Aug 22 PHP
ThinkPHP5.0框架结合Swoole开发实现WebSocket在线聊天案例详解
Apr 02 PHP
thinkphp框架表单数组实现图片批量上传功能示例
Apr 04 PHP
php文件上传后端处理小技巧
May 22 #PHP
PHP strip_tags() 去字符串中的 HTML、XML 以及 PHP 标签的函数
May 22 #PHP
PHP+MySql+jQuery实现的&quot;顶&quot;和&quot;踩&quot;投票功能
May 21 #PHP
制作个性化的WordPress登陆界面的实例教程
May 21 #PHP
详解WordPress中添加友情链接的方法
May 21 #PHP
PHP框架Laravel插件Pagination实现自定义分页
Apr 22 #PHP
屏蔽PHP默认设置中的Notice警告的方法
May 20 #PHP
You might like
php calender(日历)二个版本代码示例(解决2038问题)
2013/12/24 PHP
smarty模板引擎基础知识入门
2015/03/30 PHP
PHP+JS实现大规模数据提交的方法
2015/07/02 PHP
php限制文件下载速度的代码
2015/10/20 PHP
HTML-CSS群中单选引发的“事件”
2007/03/05 Javascript
jQuery代码优化之基本事件
2011/11/01 Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
2013/04/16 Javascript
JavaScript编写检测用户所使用的浏览器的代码示例
2016/05/05 Javascript
JS模态窗口返回值兼容问题的完美解决方法
2016/05/28 Javascript
JavaScript 继承详解(五)
2016/10/11 Javascript
jQuery实现动态生成表格并为行绑定单击变色动作的方法
2017/04/17 jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
2017/08/17 jQuery
微信小程序表单验证功能完整实例
2017/12/01 Javascript
vue微信分享 vue实现当前页面分享其他页面
2017/12/02 Javascript
微信小程序js文件改变参数并在视图上及时更新【推荐】
2018/06/11 Javascript
jquery实现动态添加附件功能
2018/10/23 jQuery
实现高性能javascript的注意事项
2019/05/27 Javascript
vue vantUI tab切换时 list组件不触发load事件的问题及解决方法
2020/02/14 Javascript
js实现日历
2020/11/07 Javascript
对python数据切割归并算法的实例讲解
2018/12/12 Python
对Xpath 获取子标签下所有文本的方法详解
2019/01/02 Python
Python使用folium excel绘制point
2019/01/03 Python
详解Python基础random模块随机数的生成
2019/03/23 Python
在django中form的label和verbose name的区别说明
2020/05/20 Python
屈臣氏俄罗斯在线商店:Watsons俄罗斯
2020/08/03 全球购物
德国亚马逊官方网站:Amazon.de
2020/11/15 全球购物
.NET初级开发工程师面试题(包括Javascript)
2012/08/22 面试题
给同学的道歉信
2014/01/16 职场文书
员工拓展培训方案
2014/02/15 职场文书
村党支部对照检查材料思想汇报
2014/09/28 职场文书
会计工作岗位职责
2015/02/03 职场文书
病人慰问信范文
2015/02/15 职场文书
2015年大学班长个人工作总结
2015/04/24 职场文书
MySQL如何使用使用Xtrabackup进行备份和恢复
2021/06/21 MySQL
react中的DOM操作实现
2021/06/30 Javascript
Java字符缓冲流BufferedWriter
2022/04/09 Java/Android