Lapisan Thinkphp ajax cara menambah kaedah (dengan contoh kod)-ThinkPHP-php.cn

Lapisan Thinkphp ajax cara menambah kaedah (dengan contoh kod)

藏色散人

Lepaskan： 2021-08-24 10:31:20

ke hadapan

2567 orang telah melayarinya

Thinkphp ialah rangka kerja PHP biasa, dan lapisan ialah komponen pop timbul Web yang berguna Lajur tutorial thinkphp berikut akan memperkenalkan kepada anda cara Thinkphp menggabungkan pop timbul lapisan. Tambah ajax untuk melengkapkan kaedah penambahan.

Lapisan Thinkphp ajax cara menambah kaedah (dengan contoh kod)

Thinkphp menggabungkan tetingkap pop timbul lapisan dan ajax untuk dilengkapkan kaedah penambahan

Hanya ikat id pada setiap kotak input
Ini ialah halaman hadapan

<!DOCTYPE html><html>
  
  <head>{include file="public/head" title="顶部开始" /}
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
    <p class="x-body layui-anim layui-anim-up">
    <form action="" method="post" class="layui-form">
      <p class="layui-form-item">
          <label for="L_email" class="layui-form-label">
              <span class="x-red">*</span>管理员名称          </label>
          <p class="layui-input-inline">
              <input type="text"  name="name" class="layui-input" id="name">//绑定ld
          </p>
          <p class="layui-form-mid layui-word-aux">
          </p>
      </p>
      <p class="layui-form-item">
          <label for="L_username" class="layui-form-label">
              <span class="x-red">*</span>手机号码          </label>
          <p class="layui-input-inline">
              <input type="text"  name="phone" class="layui-input" id="phone">//绑定ld
          </p>
      </p>
      <p class="layui-form-item">
        <label class="layui-form-label"><span class="x-red">*</span>请选择权限</label>
        <p class="layui-input-block" style="width:34%;">
          <select name="type" lay-verify="required" id="type">
            <option value=""></option>
            <option value="1">超级管理员</option>
            <option value="0">普通操作员</option>
          </select>
        </p>
      </p>          
      <p class="layui-form-item">
          <label for="L_pass" class="layui-form-label">
              <span class="x-red">*</span>密码          </label>
          <p class="layui-input-inline">
              <input type="password"  name="pass" class="layui-input" id="pass">//绑定ld
          </p>
          <p class="layui-form-mid layui-word-aux">
              6到16个字符          </p>
      </p>
      <p class="layui-form-item">
          <label for="L_repass" class="layui-form-label">
              <span class="x-red">*</span>确认密码          </label>
          <p class="layui-input-inline">
              <input type="password"  name="pass" class="layui-input" id="pass2">
          </p>
      </p>
       <p class="layui-form-item" >
          <label class="layui-form-label"><span class="x-red">*</span>性别</label>
          <p class="layui-input-block"  >
            <input type="radio" name="sex" value="1" title="男"  id="sex" checked="">//绑定ld
            <input type="radio" name="sex" value="2" title="女" id="sex">//绑定ld
          </p>
        </p>       
      <p class="layui-form-item">
          <label for="L_repass" class="layui-form-label">
          </label>
          <a href="javascript:;" id=&#39;confirm&#39; class="layui-btn" >立即提交</a>//绑定事件，触发confirm方法
      </p>
  </form></p><script>$("#confirm").click(function(){
    var name   = $.trim($(&#39;#name&#39;).val());
    var phone  = $.trim($(&#39;#phone&#39;).val()); 
    var type  = $.trim($(&#39;#type&#39;).val()); 
    var pass  = $.trim($(&#39;#pass&#39;).val()); 										//先var
    var pass2  = $.trim($(&#39;#pass2&#39;).val()); 
    var sex  = $.trim($(&#39;#sex&#39;).val()); 
    var index=parent.layer.getFrameIndex(window.name);  
  
    if(name==&#39;&#39;){
        layer.msg(&#39;请输入管理员名称&#39;, {icon: 0});
        return false;
    }
    if(phone==&#39;&#39;){
        layer.msg(&#39;请输入手机号码&#39;, {icon: 0});
        return false;
    }
    if(type==&#39;&#39;){
        layer.msg(&#39;请选择权限&#39;, {icon: 0});
        return false;
    }
    if(pass==&#39;&#39;){
        layer.msg(&#39;请输入密码&#39;, {icon: 0});
        return false;
    }    
    if(pass!=pass2){
      layer.msg(&#39;两次密码不一致&#39;, {icon: 0});
      $(&#39;#pass&#39;).val("").focus(); 
      $(&#39;#pass2&#39;).val("").focus();
      return false;
    } 

    $.ajax({
            url:"{:url(&#39;user_add&#39;)}",  //这里跳到后台控制器
            data:{name:name,phone:phone,type:type,pass:pass,sex:sex},  //注意这里一一对应要传的参数
            type:"POST",
            success: function(data){
                if (data.status==1) {
                  layer.msg(&#39;添加成功！&#39;,{time:1000,icon: 1},function(){
                    window.parent.location.reload();
                    parent.layer.close(index);     //添加成功之后销毁当前弹窗
                  })   

                }else{
                    layer.msg(data.info,{time:2000,icon: data.status});
                }
            }
        });   
    });</script>

  </body></html>

Salin selepas log masuk

Berikut ialah bahagian pengawal

    public function user_add(){
       $time = time();
       if(Request::instance()->isAjax()){
           $name=Db::table(&#39;shop_admin&#39;)->where([&#39;name&#39;=>input(&#39;post.name&#39;)])->count();
           if($name >=1){
               return json(["info"=>"该用户名已被占用!","status"=>0]);
           }
           $res = Db::table(&#39;shop_admin&#39;)->
           insert([
                   &#39;name&#39;=>input(&#39;post.name&#39;),
                   &#39;phone&#39;=>input(&#39;post.phone&#39;),
                   &#39;type&#39;=>input(&#39;post.type&#39;),
                   &#39;password&#39;=>md5(input(&#39;post.pass&#39;)),
                   &#39;sex&#39;=>input(&#39;post.sex&#39;),
                   &#39;time&#39;=> $time                   ]);
           if($res){
               return json(["info"=>"添加成功！","status"=>1,"url"=>url(&#39;user/index&#39;)]);
           }else{
               return json(["info"=>"注册失败!","status"=>5]);
           }
       }
   }

Salin selepas log masuk

Cadangan berkaitan: 10 tutorial video thinkphp terkini

Atas ialah kandungan terperinci Lapisan Thinkphp ajax cara menambah kaedah (dengan contoh kod). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!