LayUI

系统

Layui中怎么在表单进行文件下载 ajax？blob？

刚开始我用的AJAX请求的后端，但是返回的数据流被解析成字符串，无法下载。其实整个下载逻辑已经在后端进行判断，有无权限都由后端返回，所以前端就是一个请求而已。 layer.open 一个layer.open也是能实现下载，会一直显示加载状态，代码如下：

layer.open({
            type: 2,
            title: '下载',
            shadeClose: true,
            shade: 0.8,
            area: ['80%', '70%'],
            content: '/index/management/certificate_download/id/' + data.id
          });

1

2

3

4

5

6

7

8

layer.open({

type: 2,

title: '下载',

shadeClose: true,

shade: 0.8,

area: ['80%', '70%'],

content: '/index/management/certificate_download/id/' + data.id

});

文件下载后这个窗口一直在转圈圈。网上搜索…

蓝洛水深

2021年10月20日

011.2K0

网站

LayuiAdmin 退出接口设置及对应PHP后端代码分享

一、后端退出将session清空，按layui要求的接口格式返回数据。

 public function logout(){

        session(null);
        $arr=array();
            $arr['code']=0;
            $arr['msg']="退出成功";
            $arr['url'] = '/index/login/login';
        echo json_encode($arr);
    }

1

2

3

4

5

6

7

8

9

public function logout(){

session(null);

$arr=array();

$arr['code']=0;

$arr['msg']="退出成功";

$arr['url'] = '/index/login/login';

echo json_encode($arr);

}

二、Layuiadmin执行退出找到\modules\common.js，可以参考如下修改：

 //退出
  admin.events.logout = function(){
    //执行退出接口
    admin.req({
      url: '/index/login/logout'
      ,type: 'get'
      ,data: {}
      ,done: function(res){ //这里要说明一下：done 是只有 response 的 code 正常才会执行。而 succese 则是只要 http 为 200 就会执行
        
        //清空本地记录的 token，并跳转到登入页
        admin.exit(function(){
          location.href = '/index/login/login';
        });
      }
    });
  };

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

//退出

admin.events.logout = function(){

//执行退出接口

admin.req({

url: '/index/login/logout'

,type: 'get'

,data: {}

,done: function(res){ //这里要说明一下：done 是只有 response 的 code 正常才会执行。而 succese 则是只要 http 为 200 就会执行

//清空本地记录的 token，并跳转到登入页

admin.exit(function(){

location.href = '/index/login/login';

});

}

});

};

即可完成退出，并跳转登陆页面。

蓝洛水深

2021年10月8日

009110

网站

Layui下拉选框使用change无效如何取值赋值渲染

在使用layui过程中，使用下拉选框的changge，并不能执行，具体原因没有去了解，但是layui本身有一套自己的下拉选框操作方式。

form.on('select(demo)', function(data){
				if(data.value == 1){
					$("#searchSessionNum").attr("disabled","true");
					form.render('select');
				}else{
					$("#searchSessionNum").removeAttr("disabled");
					form.render('select');//select是固定写法 不是选择器
				}
			});

1

2

3

4

5

6

7

8

9

form.on('select(demo)', function(data){

if(data.value == 1){

$("#searchSessionNum").attr("disabled","true");

form.render('select');

}else{

$("#searchSessionNum").removeAttr("disabled");

form.render('select');//select是固定写法不是选择器

}

});

按上方写就可以了，当然，在实际过程中可以更灵活，逻辑代码按自己需求即可。

form.on('select(fund_com_ratio)', function(data){
                console.log(data.value);
                var fund_base = $("#fund_base").val();
                $("#fund_com_num").attr("value", fund_base*data.value/100);
                $("#fund_person_num").attr("value", fund_base*data.value/100);
                form.render('select');
			});

1

2

3

4

5

6

7

form.on('select(fund_com_ratio)', function(data){

console.log(data.value);

var fund_base = $("#fund_base").val();

$("#fund_com_num").attr("value", fund_base*data.value/100);

$("#fund_person_num").attr("value", fund_base*data.value/100);

form.render('select');

});

蓝洛水深

2021年9月17日

004310

系统

layuiAdmin打开新窗口（新标签页）的两种方法

一、在HTML中

<a lay-href="xxxx.html" lay-text="账号列表">打开新窗口</a>

1	<a lay-href="xxxx.html" lay-text="账号列表">打开新窗口</a>

二、在JS代码中

top.layui.index.openTabsPage(url, title);

1	top.layui.index.openTabsPage(url, title);

第二种方法可以传参，比如：

table.on('tool(customerTable)', function (obj) {
        var data = obj.data;
        if (obj.event === 'detail') {
          top.layui.index.openTabsPage('/index/customer/read/id/' + data.id, data.name);
        }

1

2

3

4

5

table.on('tool(customerTable)', function (obj) {

var data = obj.data;

if (obj.event === 'detail') {

top.layui.index.openTabsPage('/index/customer/read/id/' + data.id, data.name);

}

蓝洛水深

2021年9月16日

054.8K0

资讯

「踏着春风而回，layui 再次启航」layui更新到2.6.0

今天，layui更新到2.6.0，做了不少调整，具体如下： [调整] 核心模块的聚合，统一构建为 layui.js，这意味着不必再按需异步加载模块，直接就可以使用 layui 所提供的所有组件库。该调整向下兼容，对早前版本的写法不受影响。但需要注意的是：如果之前引入了 layui.all.js 的，现在必须改成 layui.js；2. 如果元素存在动态插入…

蓝洛水深

2021年3月31日

031.0K0

网站

Layui想给表格定义一列统计数据？可通过AJAX输出Return返回

昨天想在Layui的数据表格添加一列与ID对应的统计数据，折腾了几个小时，这里做一下记录。一、多模型Haswhere 最开始我的需求是联查三个表，但是看了TP文档，Hasone只能有一个Haswhere，但是可以有多个with。也就是可以展示多个绑定的数据，但是有且只能查询其中的两个，其他的不在查询条件内。后来没办法只有用join来连表实现，代码如下：…

蓝洛水深

2021年3月12日

008380

网站

Layui switch Off状态下不向后台传值的解决办法

原生checkbox只有在checked状态时值才会被浏览器提交到后台，未checked时值不会被浏览器提交。 LayUI实际上也是checkbox，所以，在off状态下不提交到后台，是正常的。解决办法添加js监听开关组件，并对组件值做处理在后台入库的地方做判断，如果没有传值，就设置is_show=0 其他解决办法在checkbox的上一行加个hid…

蓝洛水深

2021年3月6日

049540

网站

Layui select获取自定义属性的值

HTML代码：

<li class="layui-form">
	<div class="layui-form-item">
		<div class="layui-input-block">
			<select name="CountryId" lay-filter="CountryId_select">
				<option value="1" data-name="China">中国</option>
				<option value="2" data-name="Cuba">古巴</option>
				<option value="3" data-name="Russian Federation">俄罗斯</option>
			</select>
		</div>
	</div>
</li>

1

2

3

4

5

6

7

8

9

10

11

</select>

</div>

</li>

Layui代码：

form.on('select(CountryId_select)', function(data){
		var CountryId = data.value; //国家id
		var CountryEn = $(data.elem).find("option:selected").attr("data-name"); //国家英文名
	});

1

2

3

4

form.on('select(CountryId_select)', function(data){

var CountryId = data.value; //国家id

var CountryEn = $(data.elem).find("option:selected").attr("data-name"); //国家英文名

});

蓝洛水深

2021年3月2日

003330

网站

Layui延时执行刷新或关闭弹窗的正确写法

搜索了很多人的解答，但基本都是这样写的：

layer.msg(d.msg, {
      icon: 1,
      time: 3000,
      shade: 0.4
      }, function () {
      location.href = "{:url('admin/index')}"
    });

1

2

3

4

5

6

7

layer.msg(d.msg, {

icon: 1,

time: 3000,

shade: 0.4

}, function () {

location.href = "{:url('admin/index')}"

});

但是，这样写很可能执行不到，建议这样写：

done: function(res){
      layer.msg(res.msg, {
        time: 2000,
        end: function () {
          console.log('updated');
          console.log('close');
          parent.layer.close(index);
          parent.location.reload();
        }
      });
    }

1

2

3

4

5

6

7

8

9

10

11

done: function(res){

layer.msg(res.msg, {

time: 2000,

end: function () {

console.log('updated');

console.log('close');

parent.layer.close(index);

parent.location.reload();

}

});

}

蓝洛水深

2021年3月1日

001.6K0

网站

Layui开发下拉框及单选框radio回显

首先是下拉框的回显

$("#worker").each(function () {
    // this代表的是<option></option>，对option再进行遍历
    $(this).children("option").each(function () {
        // 判断需要对那个选项进行回显
        if (this.value == 2 {
            console.log($(this).text());
            // 进行回显
            $(this).attr("selected", "selected");
        }
    });
    //必须刷新表单
    form.render('select');
});

1

2

3

4

5

6

7

8

9

10

11

12

13

$("#worker").each(function () {

// this代表的是<option></option>，对option再进行遍历

$(this).children("option").each(function () {

// 判断需要对那个选项进行回显

if (this.value == 2 {

console.log($(this).text());

// 进行回显

$(this).attr("selected", "selected");

}

});

//必须刷新表单

form.render('select');

});

其次是radio的单选框

//将表单中的radio状态写到页面中
 $("input:radio[name=comefrom][value = 2]").prop("checked", true);
form.render('radio');

1

2

3

//将表单中的radio状态写到页面中

$("input:radio[name=comefrom][value = 2]").prop("checked", true);

form.render('radio');

蓝洛水深

2021年2月25日

042.0K0