MVC_CRUD/Scripts/datatable/examples/api/select_row.html

这里只显示每个文件的开头 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>DataTables example - Row selection (multiple rows)</title>
	<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
	<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
	<link rel="stylesheet" type="text/css" href="../resources/demo.css">
	<style type="text/css" class="init">
	
	</style>
	<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
	</script>
	<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/demo.js">
	</script>
	<script type="text/javascript" language="javascript" class="init">
	

$(document).ready(function() {
	var table = $('#example').DataTable();

	$('#example tbody').on( 'click', 'tr', function () {
		$(this).toggleClass('selected');
	} );

	$('#button').click( function () {
		alert( table.rows('.selected').data().length +' row(s) selected' );
	} );
} );


	</script>
</head>
<body class="dt-example">
	<div class="container">
		<section>
			<h1>DataTables example <span>Row selection (multiple rows)</span></h1>
			<div class="info">
				<p>It can be quite useful at times to provide the user with the option to select rows in a DataTable. This can be done by simply using a click event to add /
				remove a class on the table rows. The <a href="//datatables.net/reference/api/rows().data()"><code class="api" title=
				"DataTables API method">rows().data()</code></a> method can then be used to get the data for the selected rows. In this case it is simply counting the number of
				selected rows, but much more complex interactions can easily be developed.</p>
				<p>If you are looking for a more complete and easier to use row selection option, check out the <a href="https://datatables.net/extras/select">Select extension</a>
				provides an API that is fully integrated with DataTables for selecting rows and acting upon those selected rows.</p>
			</div>
			<div class="demo-html">
				<button id="button">Row count</button>
			</div>
			<table id="example" class="display" cellspacing="0" width="100%">
				<thead>
					<tr>
						<th>Name</th>
						<th>Position</th>
						<th>Office</th>