springboot +layui实现1获取输入框值2显示table:请求后台读sch文本数据并回显给table3改变table值：请求传值写入opt文本中的功能

已于 2022-05-30 20:32:11 修改
阅读量5.7k 收藏 2
点赞数
分类专栏： vue以及前端 文章标签： java
于 2021-11-29 11:48:14 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42434039/article/details/121605621
版权

实现获取输入框控件参数，写入文本中，并读取数据返回给table控件。
0.后台opt文本 bean实体类，也可以叫模型或者数据库

public class OptModel {
private String cslj;
private String yhlj;
private String xmm;
private String cscys;
private String zdyhcs;
private String zqdx;
private String zsjs;
private String cyjs;
private String yhbs;
private String dbbc;
private String yhqsb;
private String ylys;
private String hsl;
private String bx;
private String jtdccy;
private String dtdcjd;
private String sxbs;
private String xxbs; 
 
private LinkedList<WellData>  wellmodel;
}

public class WellData {
private String wellname; 
private String type;
private String chanye;
private String up;
private String down;

1.控件
参数控件

<div class="layui-row">
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>初始采样数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="cscys" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="50" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>最大优化次数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="zdyhcs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="100" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>种群大小</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="zqdx" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="20" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>注水井数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="zsjs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="4" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
  </div>
  
    <div class="layui-row">
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>采油井数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="cyjs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="9" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>优化步数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="yhbs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="4" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>单步步长</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="dbbc" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="360" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>优化起始步</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="yhqsb" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="1" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
  </div>
  
    <div class="layui-row">
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>压力约束</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="ylys" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="140" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>含水率约束</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="hsl" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="0.9" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>静态单次采样数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="jtdccy" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="5" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1">
       <div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange">*</span>动态单次加点数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="dtdcjd" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="11" value="4" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
  </div>
  
  
  
  <div class="layui-row">
   <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1">
       <div class="layui-form-item">
      <label class="layui-form-label"><span class="f_orange"  >*</span>注采上限倍数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="sxbs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="" value="1.5" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    
     <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1">
       <div class="layui-form-item">
      <label class="layui-form-label"  ><span class="f_orange">*</span>注采下限倍数</label>
      <div class="layui-input-block width_250 pos-r">
        <input type="text" id="xxbs" class="layui-input" name="ColumnCode" lay-verify="required|inputLength_100" placeholder="" value="0.5" autocomplete="off">
        <i class="icon_ca_layui"></i>
      </div>
        </div>
        </div>
    </div>
    <div class="layui-col-sm3">
       <div class="grid-demo grid-demo-bg1"><div class="layui-form-item">
       <div class="layui-form-item">
    <label class="layui-form-label">是否并行</label>
    <div class="layui-input-block">
      <input id="bx" type="radio" name="sex" value="" title="是" checked="">
      <input id="bx2" type="radio" name="sex" value="" title="否">
       
    </div>
  </div>
        </div>
        </div>
    </div>
    
  </div>
   
</div>
   
</form>


 table显示按钮

  <div class="layui-form-item">
  <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend style="color:red">SCH处理</legend>
</fieldset> 
    <div class="layui-input-block">
        &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; 
      <button class="layui-btn"   lay-filter="demo1" type="button" value="test"  onclick="cuculate()" >加载井生产数据</button>
     &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; 
     <button class="layui-btn"   lay-filter="demo1" type="button" value="test"  onclick="change()" >确认修改</button>
    
    </div>
  </div>
  <div class="layui-form-item">

table 控件

<table class="layui-table" id="welltb" style='width:68%' lay-skin="line">
  <colgroup>
    <col width="150">
    <col width="150">
    <col width="150">
    <col  width="150">
    <col  width="150">
  </colgroup>
  <thead  >
    <tr >
      <th style='width:150px'>井名</th>
      <th style='width:150px'>井别</th>
      <th style='width:150px'>当前值</th>
      <th style='width:150px'>最小调控量</th>
      <th style='width:150px'>最大调控量</th>
    </tr> 
  </thead>
  <tbody >
    
  </tbody>
</table>

生成文件按钮

 </div>
   <div class="layui-form-item">
  <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
  <legend style="color:red">生成optpar.dat文件</legend>
</fieldset>

2.js

输入框参数上传和获取table数据回显功能

function cuculate(){
	layui.use([ 'jquery' ], function() {
		var $ = layui.jquery;
		//赋值
		opts.cscys=$("#cscys").val() ;
		opts.zdyhcs=$("#zdyhcs").val() ;
		opts.zqdx=$("#zqdx").val() ;
		opts.zsjs=$("#zsjs").val() ;
		opts.cyjs=$("#cyjs").val() ;
		opts.yhbs=$("#yhbs").val() ;
		opts.dbbc=$("#dbbc").val() ;
		opts.yhqsb=$("#yhqsb").val() ;
		opts.ylys=$("#ylys").val() ;
		opts.hsl=$("#hsl").val() ;
		if($("#bx")[0].checked==true){opts.bx="1"}
		else opts.bx="0";
		opts.jtdccy=$("#jtdccy").val() ;
		opts.dtdcjd=$("#dtdcjd").val() ;
		opts.sxbs=$("#sxbs").val() ;
		opts.xxbs=$("#xxbs").val() ;
		//console.log( opts); 
		//编码json	
		$.ajax({
		type : 'POST',
		url :   baseurl+'Culculate',
		data : {
			"optd" :  JSON.stringify(opts )
		},
		dataType: "json",
		success : function(data) {
			 console.log(data.opt);
			   complete_Opt=data.opt;
			 well=data.opt.wellmodel;
			 //console.log($("#welltb")[0]);
			layui.use('layer', function(){
				  var layer = layui.layer;
				//原生方法渲染：
				  $("#welltb")[0].style.display='block';
				  for(var i=0;i<well.length;i++){
				  var tr=  "<tr > "+
                  "  <td  style='width:150px' > <p contentEditable='true'>"+well[i].wellname+"</p> </td> "+
				  "  <td  style='width:150px' > <p contentEditable='true'>"+ well[i].type+"</p> </td> "+
				  " <td  style='width:150px' > <p contentEditable='true'>"+ well[i].chanye+"</p> </td> "+
				  "  <td  style='width:150px' > <p contentEditable='true'>"+ well[i].down+"</p> </td> "+
				  "  <td  style='width:150px' > <p contentEditable='true'>"+ well[i].up+"</p> </td> ";
				 $("#welltb").append(tr);   //动态添加
				 };
				  layer.msg('加载完毕', {icon: 1});
				});  
				
		}
		 
		
	});
});
	}

改变table值的更新，写入opt文本功能

function change(){
	layui.use([ 'jquery' ], function() {
		var $ = layui.jquery;
		//修改数据opts，前台的bean
 
		opts=complete_Opt;     
 
		//重新赋值
		for(var i=0;i<opts.wellmodel.length;i++){
		opts.wellmodel[i].wellname=$("#welltb")[0].rows[i+1].children[0].innerText;
		opts.wellmodel[i].type=$("#welltb")[0].rows[i+1].children[1].innerText;
		opts.wellmodel[i].chanye=$("#welltb")[0].rows[i+1].children[2].innerText;
		opts.wellmodel[i].down=$("#welltb")[0].rows[i+1].children[3].innerText;
		opts.wellmodel[i].up=$("#welltb")[0].rows[i+1].children[4].innerText;
		//console.log(a);
		};
		console.log(opts);
		$.ajax({
		type : 'POST',
		url :   baseurl+'change',
		data : {
			"Optmod" :  JSON.stringify(opts )
		},
		dataType : "json",
		success : function(n) {
			//var name=n.itemname;
			 
			//$("#xmm").val(name);
			
			opts=n.opt;
			 layer.msg('数据修改完毕', {icon: 1});	 

		}
	});
});
	}

3.后台
读取json参数转为对象和读取sch文件塞给bean并返回

	@RequestMapping("/Culculate")
	public HashMap nomaosch(String optd) throws JsonParseException, JsonMappingException, IOException  {
		//前台参数optd
		ObjectMapper mapper = new ObjectMapper();
		opt = mapper.readValue(optd,OptModel.class);
		WellData welldata = new WellData();
		LinkedList<WellData> welllist=new LinkedList<WellData>();
		//读sch文件 
		String pathsch =opt.getCslj()+"\\"+opt.getXmm()+".SCH";
		System.out.println(pathsch);
		Scanner scanner = new Scanner(new FileInputStream(pathsch) ) ;
		FileInputStream fis=new FileInputStream(pathsch);
		InputStreamReader isr=new InputStreamReader(fis);
		BufferedReader br = new BufferedReader(isr);
		String line="";
		String[] arrs=null;
		while (true) { 
			String lines=br.readLine();
			if(lines==null)break;
			if(lines.contains("WCONPROD")) {//查找关键字
				welllist.clear(); 
				while((lines = br.readLine())!=null) {
					if(lines.toCharArray().length<16)break;\\选择小于16的数据那一行就是我们要的数据
					arrs = lines.split("\\s+");//按照空格分割一行的数据 
					WellData wellnode = new WellData();
					WellData wellnodea = new WellData();
					wellnode = nwelldata2oil(wellnodea, arrs, opt.getSxbs(), opt.getXxbs()); 
					welllist.add(wellnode);//加一行 井节点，table数据的一行，循环加完
				}
			}
			if(lines.contains("WCONINJE")) {
				while((lines = br.readLine())!=null) { 
					if(lines.toCharArray().length<16)break;
					arrs = lines.split("\\s+");
					WellData wellnode = new WellData();
					WellData wellnodea = new WellData();
					wellnode = nwelldata2water(wellnodea, arrs, opt.getSxbs(), opt.getXxbs());
					welllist.add(wellnode);
				}
			}
		opt.setWellmodel(welllist);
		writeOptFile(opt);
		HashMap data=new HashMap();
		data.put("opt",opt);//bean 
		return data;

	}

从文本获取数据的方法业务：一行油水井数据的赋值处理

private WellData welldata(WellData welldata, String[] arrs, String up, String down) {
		welldata.setChanye(arrs[4]);
		double chanyeliang=Double.parseDouble(arrs[4]);
		DecimalFormat df = new DecimalFormat("#.00");
		String upd=df.format(Double.parseDouble(up)*chanyeliang);
		String dowd=df.format(Double.parseDouble(down)*chanyeliang);
		welldata.setUp(String.valueOf(upd) );
		welldata.setWellname(arrs[0]);
		welldata.setDown(String.valueOf(dowd) );String aa=null;
		//int l=arrs[0].length();
		//if(arrs[0].length()>6) {  aa=(arrs[0].substring(1, 4));}
		//else {  aa=(arrs[0].substring(0, 3));}
		if(arrs[1].equals("WATER")) {
			welldata.setType("water");
		}
		else welldata.setType("oil");
		return welldata;
	}
	private WellData nwelldata2oil(WellData welldata, String[] arrs, String up, String down) {
		welldata.setChanye(arrs[4]);
		double chanyeliang=Double.parseDouble(arrs[4]);
		DecimalFormat df = new DecimalFormat("#.00");
		String upd=df.format(Double.parseDouble(up)*chanyeliang);
		String dowd=df.format(Double.parseDouble(down)*chanyeliang);
		welldata.setUp(String.valueOf(upd) );
		welldata.setWellname(arrs[0]);
		welldata.setDown(String.valueOf(dowd) );String aa=null;
	 
		welldata.setType("oil");
		return welldata;
	}
	private WellData nwelldata2water(WellData welldata, String[] arrs, String up, String down) {
		// TODO Auto-generated method stub			welldata.setWellname(arrs[0]);
		welldata.setChanye(arrs[4]);
		double chanyeliang=Double.parseDouble(arrs[4]);
		DecimalFormat df = new DecimalFormat("#.00");
		String upd=df.format(Double.parseDouble(up)*chanyeliang);
		String dowd=df.format(Double.parseDouble(down)*chanyeliang);
		welldata.setUp(String.valueOf(upd) );
		welldata.setWellname(arrs[0]);
		welldata.setDown(String.valueOf(dowd) );String aa=null;
 
		welldata.setType("water");
		return welldata;
	}
 
	 
}

改变table后，写进opt文件功能，得到后台运行的文件。

@RequestMapping("/change")
		public HashMap change(String Optmod) throws JsonParseException, JsonMappingException, IOException  {
			  ObjectMapper mapper = new ObjectMapper();
			    opt = mapper.readValue(Optmod,OptModel.class);
		      writeOptFile(opt);
			HashMap n=new HashMap();
			n.put("opt",opt);
			return n;
           }
private void writeOptFile(OptModel opt2) {
		FileWriter fw = null;
		FileWriter fw2 = null;
		File file = new File(opt2.getCslj()+"\\"+"optpar.dat");
		File file2 = new File(path_opt);
		try {
			if (!file.exists()) {
				file.createNewFile();
				file2.createNewFile();
			}
			fw = new FileWriter(file);//写参数
			fw2 = new FileWriter(file2);
			fw.write(opt2.getCslj()+"\r\n");
			fw.write(opt2.getYhlj()+"\r\n");
			fw.write(opt2.getXmm()+"\r\n");
			fw.write(opt2.getCscys()+"\r\n");
			fw.write(opt2.getZdyhcs()+"\r\n");
			fw.write(opt2.getZqdx()+"\r\n");
			fw.write(opt2.getZsjs()+"\r\n");
			fw.write(opt2.getCyjs()+"\r\n");
			fw.write(opt2.getYhbs()+"\r\n");
			fw.write(opt2.getDbbc()+"\r\n");
			fw.write(opt2.getYhqsb()+"\r\n");
			fw.write(opt2.getYlys()+"\r\n");
			fw.write(opt2.getHsl()+"\r\n");
			fw.write(opt2.getBx()+"\r\n");
			fw.write(opt2.getJtdccy()+"\r\n");
			fw.write(opt2.getDtdcjd()+"\r\n");
			fw.write("well"+"\r\n");
			fw2.write(opt2.getCslj()+"\r\n");
			fw2.write(opt2.getYhlj()+"\r\n");
			fw2.write(opt2.getXmm()+"\r\n");
			fw2.write(opt2.getCscys()+"\r\n");
			fw2.write(opt2.getZdyhcs()+"\r\n");
			fw2.write(opt2.getZqdx()+"\r\n");
			fw2.write(opt2.getZsjs()+"\r\n");
			fw2.write(opt2.getCyjs()+"\r\n");
			fw2.write(opt2.getYhbs()+"\r\n");
			fw2.write(opt2.getDbbc()+"\r\n");
			fw2.write(opt2.getYhqsb()+"\r\n");
			fw2.write(opt2.getYlys()+"\r\n");
			fw2.write(opt2.getHsl()+"\r\n");
			fw2.write(opt2.getBx()+"\r\n");
			fw2.write(opt2.getJtdccy()+"\r\n");
			fw2.write(opt2.getDtdcjd()+"\r\n");
			fw2.write("well"+"\r\n");
			LinkedList<WellData> well = opt2.getWellmodel();//循环写井数据
			for(int i=0;i<well.size();i++) {
				String names = well.get(i).getWellname();
				if(names.contains("'")){
					names=names.substring(1,names.length()-1);
					well.get(i).setWellname(names);
				}
				fw.write(names+"\r\n");
				fw2.write(names+"\r\n");
			}
			fw.write("boundary"+"\r\n");
			fw2.write("boundary"+"\r\n");
			for(int i=0;i<well.size();i++) {
				fw.write(well.get(i).getChanye()+"  "+well.get(i).getDown()+"  "+well.get(i).getUp()+"\r\n");
				fw2.write(well.get(i).getChanye()+"  "+well.get(i).getDown()+"  "+well.get(i).getUp()+"\r\n");
			}
			fw.flush();
			fw2.flush();
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}finally{
			if(fw != null){
				try {
					fw.close();
					fw2.close();
				} catch (IOException e) {
					// TODO Auto-generated catch block
					e.printStackTrace();
				}
			}
		}
	}

效果
在这里插入图片描述

Spring（小雨点）
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
layui 获取input 的自定义属性和值
CaiXinXing的CSDN博客
05-04 6687
HTML表格页面中 使用data-xxxx="xxxx" 来定义属性和值 <script type="text/html" id="switchTpl"> <input type="checkbox" name="si_state" data-si_id="{{d.si_id}}" data-ei_id="{{d.ei_id}}" data-si_name="{{d....
layui表格自定义input提交表单时获取自定义input的值
weixin_44132285的博客
03-04 6440
在layui表格中我们如果想要使用自定义的表单比如：（数字输入框），这时候我们要使用template去自定义表格里面显示表单的内容 这时候我们会发现表单虽然可以自定义但是在提交表单的时候里面的值获取不到。我们会发现table自带的text框是可以在提交表单的时候获取到其输入的值： 解决思路： 我们可以使用逆向思维考虑一下，当我们提交表单获取表格数据的时候发现数据中没有我们自定义的表单字段 这个时候我们可以考虑在我们输入的时候拿到输入的值塞到对应表格数据中。 具体操作如下： 我们首先要给自定义表格input（
layui 获取某一组 input 框的变量和值 并提交到后台接口
qq_40088333的博客
06-30 2373
用layui.js进行 Ajax 提交
layui input 监听事件
最新发布
u013733643的博客
09-25 3506
console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回。console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象。
layui table数据修改的回显方法
12-10
实现的样式给你们看一波 点击这锅按钮 其实回显就是一个赋值的操作，先把form表单的那些input 框的id拿到，在展示成功的那里进行绑值 table.on('tool(test)', function(obj) { var data = obj.data; // 获得...
Spring boot +mybatis + layui简单demo
07-02
Spring boot +mybatis + layui简单demo，实现数据增删改查，附带sql文件，实现分页、模糊查询等
基于layui的下拉列表的数据回显方法
10-16
今天小编就为大家分享一篇基于layui的下拉列表的数据回显方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
jquery 通过ajax请求获取后台数据显示在表格上的方法
10-18
今天小编就为大家分享一篇jquery 通过ajax请求获取后台数据显示在表格上的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Layui 获取复选框的值
qq_42782011的博客
09-06 3185
Layui获取复选框的值：定义数组：遍历input复选框，然后将当前遍历的对象的Value加入数组：(‘input:checkbox[name=′});
layui的表单控件的input文本框赋值
热门推荐
狼魂之力
01-08 1万+
第一种： //org-table 行监听器 table.on('tool(org-table)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值" var data = obj.data; //获得当前行数据 var layEvent = obj.event; ...
layui取input name_layui列表如何取input框的值
weixin_35795792的博客
02-06 7010
layui列表如何取input框的值发布时间：2020-09-21 11:30:46来源：亿速云阅读：374作者：小新这篇文章主要介绍了layui列表如何取input框的值，具有一定借鉴价值，需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。我们先创建一个input，样式名就为layui-input。然后关键为其添加一个id值。接着添加一个按钮，有一个oncl...
layui获取input信息_Python入门丨input()函数
weixin_39607447的博客
11-22 427
input()函数的使用作用：获取用户的输入，返回输入的内容，也可以用作暂停程序的运行实例choice = input('请输入您的选择：')输出结果请输入您的选择： # 在后端输入信息才会继续运行注：只有输出内容input()函数才会结束，然后继续执行下面的命令。input()函数结果的赋值通过给input()函数赋值，达到随时提取输入结果的目的.实例name = input('请输入你的名...
layui 获取表单数据
博客
03-08 9623
layui 获取表单数据
layui中的html怎样接收后台的值,layui框架与SSM前后台交互的方法
weixin_30752653的博客
06-07 1660
采用layui前台框架实现前后台交互，数据分页显示以及删除操作，具体方式如下：一、数据分页显示1.前端(1)html页面12(2)请求渲染数据1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162$(function() {...
关于layui数据表格获取后台数据，进行单元格编辑修改数据
qq_36137248的博客
08-15 6327
<body> <table id="demo" lay-filter="test"> <script type="text/html" id="toolbarDemo"> <div class="layui-btn-container"> <button class="layui-btn la...
Layui 富文本编辑、存储和回显
世态人情 可作书读 可作戏看
08-14 2479
在开发中富文本的操作对于备注、描述之类的小功能是很有必要的！也能更好的展示我们需要的存储或者显示的内容 如果你正苦苦寻找一款轻量的Web富文本编辑器，那么LayEdit会是你不错的选择。 一、创建一个富文本编辑框 先定义一个textarea标签，给定一个id值，向页面引入layedit，然后调用layedit.build(id, options)构建富文本框 //官方给出的模板 <textarea id="demo" style="display: none;"></textar
LayUI表格渲染实现前后端交互
个人学习笔记库，一篇一篇记录成长的足迹
02-14 2234
LayUI表格渲染实现前后端交互，将数据填充到表格中的三种方法。
layui-弹出层-input框值显示
分外蓝
11-15 4134
数据显示使用data-th-value=" “；但data-th-text=” “会直接显示在页面的输入框上 输入框验证：意思是id不能为空，必填 data-th-lay-verify=”${user?.id!=null?’’:‘required’}" <input class="layui-input" data-th-value="${user?.userName}" name="use...
vue+springboot+element从mysql回显文件和表单数据并显示
05-12
如果你想要实现从 MySQL 数据库中获取文件和表单数据，并在前端页面中显示出来，那么你可以按照以下步骤进行操作： 1. 创建 MySQL 数据库表格，并将文件和表单数据存储在其中。 2. 使用 Spring Boot 创建 RESTful ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值