Skip to content
Snippets Groups Projects
Commit ec576c91 authored by Laurent Destailleur's avatar Laurent Destailleur
Browse files

Enhance prototype for tables

parent f18585ab
No related branches found
No related tags found
No related merge requests found
......@@ -16,6 +16,8 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*
* Javascript code to activate drag and drop on lines
* You can use this if you want to be abale to drag and drop rows of a table.
* You must add id="tablelines" ont table level tag and have count($object->lines) or count($taskarray) > 0
*/
?>
......@@ -26,6 +28,7 @@ $fk_element=$object->fk_element;
$table_element_line=$object->table_element_line;
$nboflines=(isset($object->lines)?count($object->lines):(isset($tasksarray)?count($tasksarray):0));
$forcereloadpage=empty($conf->global->MAIN_FORCE_RELOAD_PAGE)?0:1;
$tagidfortablednd=(empty($tagidfortablednd)?'tablelines':$tagidfortablednd);
if (GETPOST('action') != 'editline' && $nboflines > 1) { ?>
<script type="text/javascript">
......@@ -37,10 +40,10 @@ $(document).ready(function(){
$(".tdlineupdown").css("background-repeat","no-repeat");
$(".tdlineupdown").css("background-position","center center");
$("#tablelines").tableDnD({
$("#<?php echo $tagidfortablednd; ?>").tableDnD({
onDrop: function(table, row) {
var reloadpage = "<?php echo $forcereloadpage; ?>";
var roworder = cleanSerialize($("#tablelines").tableDnDSerialize());
var roworder = cleanSerialize($("#<?php echo $tagidfortablednd; ?>").tableDnDSerialize());
var table_element_line = "<?php echo $table_element_line; ?>";
var fk_element = "<?php echo $fk_element; ?>";
var element_id = "<?php echo $id; ?>";
......@@ -55,7 +58,7 @@ $(document).ready(function(){
if (reloadpage == 1) {
location.href = '<?php echo $_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING']; ?>';
} else {
$("#tablelines .drag").each(
$("#<?php echo $tagidfortablednd; ?> .drag").each(
function( intIndex ) {
$(this).removeClass("pair impair");
if (intIndex % 2 == 0) $(this).addClass('impair');
......
......@@ -4,12 +4,13 @@ define("NOCSRFCHECK",1); // We accept to go on this page from external web site.
require '../../main.inc.php';
if (empty($conf->global->MAIN_FEATURES_LEVEL))
if (!empty($conf->global->MAIN_FEATURES_LEVEL))
{
print "Page available onto dev environment only";
exit;
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
......@@ -17,7 +18,7 @@ if (empty($conf->global->MAIN_FEATURES_LEVEL))
<meta name="robots" content="noindex,nofollow" />
<meta name="author" content="Dolibarr Development Team">
<link rel="shortcut icon" type="image/x-icon" href="<?php echo DOL_URL_ROOT ?>/theme/eldy/img/favicon.ico"/>
<title>Login Dolibarr 3.4.0-alpha</title>
<title>Test page</title>
<!-- Includes for JQuery (Ajax library) -->
<link rel="stylesheet" type="text/css" href="<?php echo DOL_URL_ROOT ?>/includes/jquery/css/smoothness/jquery-ui-latest.custom.css" />
<link rel="stylesheet" type="text/css" href="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/datatables/css/jquery.dataTables.css" />
......@@ -25,6 +26,7 @@ if (empty($conf->global->MAIN_FEATURES_LEVEL))
<link rel="stylesheet" type="text/css" title="default" href="<?php echo DOL_URL_ROOT ?>/theme/eldy/style.css.php?dol_use_jmobile=1" />
<!-- Includes JS for JQuery -->
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/js/jquery-latest.min.js"></script>
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/tablednd/jquery.tablednd.0.6.min.js"></script>
<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/datatables/js/jquery.dataTables.js"></script>
<!--<script type="text/javascript" src="<?php echo DOL_URL_ROOT ?>/includes/jquery/plugins/mobile/jquery.mobile-latest.min.js"></script>-->
</head>
......@@ -37,32 +39,43 @@ if (empty($conf->global->MAIN_FEATURES_LEVEL))
This page is a sample of page using tables. To make test with<br>
- css (edit page to change)<br>
- jmobile (edit page to enable/disable)<br>
- dataTables.<br>
- dataTables<br>
- tablednd<br>
<br>
<br>
Example 1 : Table using tags: div.tagtable+form+div or div.tagtable+div.tagtr+div.tagtd<br>
<?php
$tasksarray=array(1,2,3); // To force having several lines
$tagidfortablednd='tablelines';
if (! empty($conf->use_javascript_ajax) && $object->statut == 0) include DOL_DOCUMENT_ROOT.'/core/tpl/ajaxrow.tpl.php';
?>
<div class="tagtable centpercent" id="abc">
<div class="tagtable centpercent" id="tablelines">
<form class="liste_titre" method="POST" action="1.php">
<div>snake<input type="hidden" name="cartitem" value="1"></div>
<div>line1<input type="hidden" name="cartitem" value="1"></div>
<div><label><input type="checkbox" name="hidedetails" value="2"> A checkbox inside a cell</label></div>
<div><input name="count" value="4"></div>
<div><input type="submit" name="count" class="button noshadow" value="aaa"></div>
</form>
<form class="impair" method="POST" action="2.php">
<div>snagfdgfd gd fgf ke<input type="hidden" name="cartitem" value="2"></div>
<div>line2<input type="hidden" name="cartitem" value="2"></div>
<div>dfsdf</div>
<div><input name="count" value="4"></div>
<div><input type="submit" value="xxx" class="button"></div>
<div class="tdlineupdown"><input type="submit" value="xxx" class="button"></div>
</form>
<div class="pair tagtr" method="GET" action="3.php">
<div>snagfdgfd gd fgf ke<input type="hidden" name="cartitem" value="3"></div>
<div>line3<input type="hidden" name="cartitem" value="3"></div>
<div>dfsdf</div>
<div><input name="count" value="4"></div>
<div><input type="submit" value="zzz" class="button"></div>
<div class="tdlineupdown"><input type="submit" value="zzz" class="button"></div>
</div>
<div class="pair tagtr" method="GET" action="3.php">
<div>line4<input type="hidden" name="cartitem" value="3"></div>
<div>dfsdf</div>
<div><input name="count" value="4"></div>
<div class="tdlineupdown"><input type="submit" value="zzz" class="button"></div>
</div>
</div>
......@@ -133,68 +146,89 @@ $('xxxth').replaceWith(
</thead>
<tbody>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line1</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line2</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line3</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line4</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line5</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line6</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line7</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line8</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line9</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line10</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line11</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
<tr>
<td>snagfdgfd gd fgf ke</td>
<td>line12</td>
<td>dfsdf</td>
<td> xxx </td>
</tr>
</tbody>
</table>
<br><br>
<br>
Example 3 : Standard table<br>
<?php
$tasksarray=array(1,2,3); // To force having several lines
$tagidfortablednd='tablelines3';
if (! empty($conf->use_javascript_ajax) && $object->statut == 0) include DOL_DOCUMENT_ROOT.'/core/tpl/ajaxrow.tpl.php';
?>
<table class="tagtable centpercent centpercent" id="tablelines3">
<tr class="liste_titre"><td>title1</td><td class="tdlineupdown">title2</td></tr>
<tr class="pair"><td class="pair">a1</td><td class="tdlineupdown pair">b1</td></tr>
<tr class="impair"><td class="impair">a2</td><td class="tdlineupdown impair">b2</td></tr>
</table>
<br>
</div>
</body>
</html>
......@@ -374,6 +374,7 @@ td.showDragHandle {
}
.tdlineupdown {
white-space: nowrap;
min-width: 10px;
}
/* ============================================================================== */
......
......@@ -256,6 +256,7 @@ td.showDragHandle {
}
.tdlineupdown {
white-space: nowrap;
min-width: 10px;
}
......
......@@ -282,6 +282,7 @@ td.showDragHandle {
}
.tdlineupdown {
white-space: nowrap;
min-width: 10px;
}
......
......@@ -256,6 +256,7 @@ td.showDragHandle {
}
.tdlineupdown {
white-space: nowrap;
min-width: 10px;
}
......
......@@ -426,6 +426,7 @@ td.showDragHandle {
}
.tdlineupdown {
white-space: nowrap;
min-width: 10px;
}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment