Yii2实现ActiveForm ajax提交


Posted in PHP onMay 26, 2017

做项目时总会碰到ajax提交的功能,特别是在做后台提交时,一般都会用模型自动生成,这个功能的使用会比较频繁,其实只要了解了流程,操作还是挺简单的,使用起来也方便。

表单部分

<?php $form = ActiveForm::begin([ 
  'action' => ['save'], //提交地址(*可省略*) 
  'method'=>'post',  //提交方法(*可省略默认POST*) 
  'id' => 'form-save', //设置ID属性 
  'options' => [ 
    'class' => 'form-horizontal', //设置class属性 
  ], 
  'enableAjaxValidation' => true, 
  'validationUrl' => 'validate-view', 
]); ?> 
 
<?php echo $form->field($model,'company_name', ['inputOptions' => ['placeholder'=>'请输入商家名称','class' => 'form-control'], 'template'=>'<label for="inputCompanyName" class="col-sm-1 control-label"><span class="text-red">*</span> 商家名称</label><div class="col-md-8">{input}</div><label class="col-sm-3" for="inputError">{error}</label>'])->textInput()?> 
 
<?=Html::submitButton('保存',['class'=>'btn btn-primary']); ?> 
 
<?php ActiveForm::end(); ?>

其中:'enableAjaxValidation' => true, 必须设置,告诉表单用ajax提交

控制器(controller)部分

控制器分两部分,一部分是效验表单的正确性,另外一部分是保存

1、效验部分

public function actionValidateView() 
{ 
  $model = new model(); 
  $request = \Yii::$app->getRequest(); 
  if ($request->isPost && $model->load($request->post())) { 
    \Yii::$app->response->format = Response::FORMAT_JSON; 
    return ActiveForm::validate($model); 
  } 
}

2、保存部分

public function actionSave() 
{ 
  \Yii::$app->response->format = Response::FORMAT_JSON; 
  $params = Yii::$app->request->post(); 
  $model = $this->findModel($params[id]); 
 
  if (Yii::$app->request->isPost && $model->load($params)) { 
    return ['success' => $model->save()]; 
  } 
  else{ 
    return ['code'=>'error']; 
  } 
}

Ajax提交from表单

$(function(){ 
$(document).on('beforeSubmit', 'form#form-save', function () { 
    var form = $(this); 
    //返回错误的表单信息 
    if (form.find('.has-error').length) 
    { 
      return false; 
    } 
    //表单提交 
    $.ajax({ 
      url  : form.attr('action'), 
      type  : 'post', 
      data  : form.serialize(), 
      success: function (response){ 
        if(response.success){ 
          alert('保存成功'); 
          window.location.reload(); 
        } 
      }, 
      error : function (){ 
        alert('系统错误'); 
        return false; 
      } 
    }); 
    return false; 
  }); 
});

特别注意本人用的是Yii2 adminlte框架后台,具体操作过程试项目而定,基本操作过程都一样。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
Linux下进行MYSQL编程时插入中文乱码的解决方案
Mar 15 PHP
40个迹象表明你还是PHP菜鸟
Sep 29 PHP
解析PHP多种序列化与反序列化的方法
Jun 06 PHP
php面象对象数据库操作类实例
Dec 02 PHP
php实现计数器方法小结
Jan 05 PHP
PHP的Yii框架中YiiBase入口类的扩展写法示例
Mar 17 PHP
PHP实现页面静态化的超简单方法
Sep 06 PHP
php版微信公众平台回复中文出现乱码问题的解决方法
Sep 22 PHP
PHPStrom 新建FTP项目以及在线操作教程
Oct 16 PHP
php微信公众平台示例代码分析(二)
Dec 06 PHP
laravel5.1框架基础之Blade模板继承简单使用方法分析
Sep 05 PHP
Laravel 将数据表的数据导出,并生成seeds种子文件的方法
Oct 09 PHP
Yii2选项卡的简单使用
May 26 #PHP
PHP编程获取各个时间段具体时间的方法
May 26 #PHP
php实现自定义中奖项数和概率的抽奖函数示例
May 26 #PHP
PHP判断密码强度的方法详解
May 26 #PHP
thinkphp实现附件上传功能
May 26 #PHP
微信第三方登录(原生)demo【必看篇】
May 26 #PHP
php写一个函数,实现扫描并打印出自定目录下(含子目录)所有jpg文件名
May 26 #PHP
You might like
mac下安装nginx和php
2013/11/04 PHP
YII2.0之Activeform表单组件用法实例
2016/01/09 PHP
php实现微信模拟登陆、获取用户列表及群发消息功能示例
2017/06/28 PHP
ThinkPHP5.0框架验证码功能实现方法【基于第三方扩展包】
2019/03/11 PHP
laravel 解决后端无法获取到前端Post过来的值问题
2019/10/22 PHP
网页里控制图片大小的相关代码
2006/06/25 Javascript
Ext JS Grid在IE6 下宽度的问题解决方法
2009/02/15 Javascript
JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)
2013/12/17 Javascript
浅谈JavaScript 框架分类
2014/11/10 Javascript
javascript文件加载管理简单实现方法
2015/07/25 Javascript
JS验证图片格式和大小并预览的简单实例
2016/10/11 Javascript
Jquery鼠标放上去显示全名的实现方法
2017/02/06 Javascript
详解Vue2.X的路由管理记录之 钩子函数(切割流水线)
2017/05/02 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
2017/07/28 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
2018/02/08 Javascript
nodejs实现连接mongodb数据库的方法示例
2018/03/15 NodeJs
基于Koa(nodejs框架)对json文件进行增删改查的示例代码
2019/02/02 NodeJs
过滤器vue.filters的使用方法实现
2019/09/18 Javascript
解决Vue在Tomcat8下部署页面不加载的问题
2019/11/12 Javascript
python实现查询IP地址所在地
2015/03/29 Python
深入理解python中的select模块
2017/04/23 Python
如何把外网python虚拟环境迁移到内网
2020/05/18 Python
python集合能干吗
2020/07/19 Python
python 三种方法提取pdf中的图片
2021/02/07 Python
送给他或她的礼物:FUN.com
2018/08/17 全球购物
迪卡侬印尼体育用品商店:Decathlon印尼
2020/03/11 全球购物
机电一体化专业应届本科生求职信
2013/09/27 职场文书
大专应届生个人简历的自我评价
2013/10/15 职场文书
医学专业五年以上个人求职信
2013/12/03 职场文书
药店主任岗位责任制
2014/02/10 职场文书
基层领导干部“四风”问题批评与自我批评
2014/09/23 职场文书
2015年预防青少年违法犯罪工作总结
2015/05/22 职场文书
世界各国短波电台对东亚播送时间频率表(SW)
2021/06/28 无线电
Maven学习----Maven安装与环境变量配置教程
2021/06/29 Java/Android
vue 实现弹窗关闭后刷新效果
2022/04/08 Vue.js