2

上一章 https://segmentfault.com/a/11... 介绍了模态框的的添加 弹出和models验证,本章对上一章做个补充。
代码如下:

    <? echo Html::a('<i class="glyphicon glyphicon-plus"></i>'.Yii::t('yii','Create Sales'), ['create','actionID'=>1] ,['class' => 'btn blue','data-toggle'=>'modal','data-target'=>'#modal_ajax'])?>  
    

按钮效果图:
图片描述

模态框代码:

<div class="modal fade" id="modal_ajax" role="basic" aria-hidden="true">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-body">
          <img src="../assets/global/img/loading-spinner-grey.gif" alt="" class="loading">
          <span> &nbsp;&nbsp;Loading... </span>
      </div>
  </div>
  </div>
</div>

然后我们修改控制器中的create方法,把render改为renderAjax
图片描述

模态框效果图:图片描述

表单添加id:

图片描述

提交表单ajax代码:
图片描述

controllers ajax验证代码:
图片描述

models rules验证规则:
图片描述

效果如下:
图片描述

这样就实现了ajax提交表单。

如果想实现pjax 刷新 就需要在index 开启pjax:

图片描述

添加代码:

function sales_pjax(){
    $.pjax.reload({container:'#dynagrid-1-pjax'});
}

在表单提交的时候调用:

图片描述

这样整个ajax提交表单就完成了。


lylwyy2016
75 声望6 粉丝