页面标签
<select name="materialType" lay-verify="required" lay-filter="materialType" id="materialType" lay-search>
</select>
js代码
<script>
layui.use(['form', 'layer','jquery'],
function() {
$ = layui.jquery;
var form = layui.form,
layer = layui.layer;
//自定义验证规则
form.verify({
price: function(value) {
if (value.length==0) {
return '请输入价格';
}
if (value.length > 6) {
return '价格不能超过10万';
}
},
});
//监听提交
form.on('submit(modify)',
function(data) {
console.log(data);
//发异步,把数据提交给php
doSubmit();
return false;
});
init(form);
});
/*
为了让 select中的数据显示到页面上,以及让其选中相应的选项,都需要form对象参与
*/
function init(form){
var id=getParam("id");
//发请求,获取select控件的选项
$.ajax({
url:'/materialquerytype', /*接口域名地址*/
type:'get',
async:false,//异步
data: {},
success:function(res){
//console.log(res.data);
if(res.code==0){
var list = res.data;
var s = '<option value="-1">请选择类别</option>';
$.each(list, function (i, it) {
s = s + '<option value="' + it.id + '">' + it.name + '</option>';
});
console.log("s::::"+s)
$("#materialType").html(s);
form.render('select');//渲染该控件----将数据显示到页面上
// form.render();
}else{
layer.alert(res.msg, {icon: 0,title: '提示'})
}
},
error:function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest);
alert(textStatus);
alert(errorThrown);
}
})
//发请求,获取当前回显的数据
$.ajax({
url:'/material/'+id, /*接口域名地址*/
type:'get',
async:false,
data: {},
success:function(res){
//console.log(res.data);
if(res.code==0){
//给表单赋值
form.val("myform", {
"id": res.data.id
,"price": res.data.purchase_price
,"materialType": res.data.type_2 //设置下拉控件选中
});
}else{
layer.alert(res.msg, {icon: 0,title: '提示'})
}
},
error:function (XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest);
alert(textStatus);
alert(errorThrown);
}
})
}
</script>