Layui table selects the radio button of the specified row and scrolls to the implementation code of the row
|
The layui table has multiple rows of data. Through external input content, you need to locate the specified row, select the row to change, and perform operations on the row. Result:
HTML code:
<body>
<div class="layui-fluid">
<input type="text" id="txt_id" />
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" lay-event="getCheckData">Get the selected row data</button>
<button class="layui-btn layui-btn-sm" lay-event="SetChecked">Set the selected row</button>
</div>
</script>
</div>
<script src="lib/jquery-1.9.1.min.js"></script>
<script src="layui/layui.all.js"></script>
<script src="lib/AjaxCommon.js"></script>
<script>
layui.use('table', function () {
: : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :Background code:
public class LayUITableEntity
{
public string code
{
get;
set;
}
public string msg
{
get;
set;
}
public string count
{
get;
set;
}
public object data
{
get;
set;
}
}
public class TestEntity
{
/// <summary>
/// This field is used to indicate whether the radio is selected. /// </summary>
public bool LAY_CHECKED
{
get; set;
}
= false;
public string Id
{
get;
set;
}
public string Name
{
get; set;
}
}
[Route("/api/test")]
public class TestController : ServiceController
{
[RouteHttpGet("hello")]
public FormiumResponse HelloNanUI(FormiumRequest request)
{
List<TestEntity> teList = new List<TestEntity>();
for (int i = 1; i <= 30; i++)
{
TestEntity te = new TestEntity()
{
//First time loading, the layer with id 3 is selected LAY_CHECKED = i == 3 ? true : false,
Id = i.ToString(),
Name = "name" + i.ToString() 32
};
teList.Add(te);
}
LayUITableEntity layUITableEntity = new LayUITableEntity()
{
code = "0",
count = teList.Count().ToString(),
msg = "",
data = teList
};
return Json(layUITableEntity);
}
}This is the end of this article about the implementation code of selecting the radio button in the specified row of the Layui table and scrolling to the row. For more relevant Layui table selected radio button scrolling content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future! |
<<: Solution for front-end browser font size less than 12px
>>: Detailed explanation of several clever applications of position:sticky sticky positioning
Recommend
Detailed explanation of location and rewrite usage in nginx
1. Summary of location usage Location can locate ...
Java example code to generate random characters
Sample code: import java.util.Random; import java...
Detailed explanation of Angular dynamic components
Table of contents Usage scenarios How to achieve ...
Summary of the 10 most frequently asked questions in Linux interviews
Preface If you are going to interview for a Linux...
Review of the best web design works in 2012 [Part 1]
At the beginning of the new year, I would like to...
Detailed explanation of MySQL's MERGE storage engine
The MERGE storage engine treats a group of MyISAM...
How to deploy nodejs service using Dockerfile
Initialize Dockerfile Assuming our project is nam...
MySQL cross-database transaction XA operation example
This article uses an example to describe the MySQ...
HTML+VUE paging to achieve cool IoT large screen function
Effect demo.html <html> <head> <me...
Tutorial on installing mysql5.7.18 on mac os10.12
I searched the entire web and found all kinds of ...
Json string + Cookie + localstorage in JS
Table of contents 1.Json string 1.1Json Syntax 1....
UDP DUP timeout UPD port status detection code example
I have written an example before, a simple UDP se...
CentOS7.5 installation tutorial of MySQL
1. First check whether the system has mysql insta...
VMware installation of Centos8 system tutorial diagram (Chinese graphical mode)
Table of contents 1. Software and system image 2....
Zabbix WEB monitoring implementation process diagram
Take zabbix's own WEB interface as an example...