LK.WXAD.Web/Skin/plugins/datatables/extensions/ColReorder/examples/reset.html

(开头部分) 16KB

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">

	<title>ColReorder example - Reset ordering API</title>
	<link rel="stylesheet" type="text/css" href="../../../media/css/jquery.dataTables.css">
	<link rel="stylesheet" type="text/css" href="../css/dataTables.colReorder.css">
	<link rel="stylesheet" type="text/css" href="../../../examples/resources/syntax/shCore.css">
	<link rel="stylesheet" type="text/css" href="../../../examples/resources/demo.css">
	<style type="text/css" class="init">

	</style>
	<script type="text/javascript" language="javascript" src="../../../media/js/jquery.js"></script>
	<script type="text/javascript" language="javascript" src="../../../media/js/jquery.dataTables.js"></script>
	<script type="text/javascript" language="javascript" src="../js/dataTables.colReorder.js"></script>
	<script type="text/javascript" language="javascript" src="../../../examples/resources/syntax/shCore.js"></script>
	<script type="text/javascript" language="javascript" src="../../../examples/resources/demo.js"></script>
	<script type="text/javascript" language="javascript" class="init">



$(document).ready(function() {
	var table = $('#example').DataTable( {
		dom: 'Rlfrtip',
		colReorder: {
			order: [ 4, 3, 2, 1, 0 ]
		}
	} );
	
	$('#reset').click( function (e) {
		e.preventDefault();
		
		table.colReorder.reset();
	} );
} );



	</script>
</head>

<body class="dt-example">
	<div class="container">
		<section>
			<h1>ColReorder example <span>Reset ordering API</span></h1>

			<div class="info">
				<p>One useful control option to present the end user when using ColReorder is the ability to reset the column ordering to that which was found in the HTML. This
				can be done by calling the <code>reset</code> API function. While ColReorder does not provide a visual element for this itself (in order to provide maximum
				flexibility) it is easy to hook to an event handler, as shown in this example.</p>

				<p>For full information about the ColReorder API, please refer to the <a href="//datatables.net/extensions/colreorder/api">ColReorder API documentation</a>.</p>
			</div><button id="reset">Reset to original HTML order</button><br>
			<br>

			<table id="example" class="display" cellspacing="0" width="100%">
				<thead>
后面还有 589 行代码,购买后查看完整代码

24 小时内免费解锁 3 个项目,之后 1 积分/个。 规则说明

AI 解读 AI

登录后可用,每次 10 积分,解读结果公开显示在下面。

还没有人解读过这个文件。