layui实现三级联动下拉菜单+thinkphp5读取表单提交数据

layui实现三级联动,在网上看到一个插件,挺好用的:

原文:https://blog.csdn.net/DSRCCSDN/article/details/84728396

插件预览地址:http://www.jpw.net/code/636431820895762098

 

使用了这个插件,基本可以达到自己想要的效果:

 

但是,当需要将数据存进数据库时发现问题。因为插件中input框中的值是城市对应的数字号码,虽然可以存进数据库,但读出来就不是很方便了(emmm其实应该是还不知道怎么实现!),那么就考虑下直接把城市名写进数据库吧!

修改了js文件,来来回回好几次,都没有改出来如何让input框里面的value直接改成城市名TAT

最后解决方案是:在select后加上一个隐藏的input框,设置一个id,把选择的值传进去;

具体代码:

1)在select框后加上input框:

 <input type="hidden" id="province" name="province">

2)表单提交前,把选中的值传到input框中,再提交到后台:

在form中加上<form οnsubmit="test()">

function test(){
            $('#province').val($('#provid').next().find('input').val());
            $('#city').val($('#cityid').next().find('input').val());
            $('#area').val($('#areaid').next().find('input').val());
        }

使用next()是因为,打开F12发现城市的值并不是直接写在select中,而是下一个节点中的input框中。

相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页