Es ist doch etwas mehr tricky.
Mit Auszählen kommt man nicht all zu weit, da man innerhalb des Spalten-Arrays nicht weiss welcher Index (welche Spalten) zu welcher Checkbox gehören.
Der Einträge-Array-pro-Spalte ist (je nach Anzahl der Einträge) n-lang, aber Checkboxes gibt es nur so viele wie Tabellen-Spalten. Daher kann man nicht sagen "checkbox #2", blende Spalte 2 aus -> dann würde er nur den ersten Eintrag ausblenden, aber die zweite Zeile ignorieren, weil dort der index bereits weiter ist.
Long story short...
man geht über die Klassennamen, die eh vergeben werden pro Feld und schaut welchen Klassennamen hat die aktuell geklickte checkbox.
Damit sucht man sich aus dem Haufen Spalten diejenigen, die ebenfalls diesen Namen haben und blendet sie aus / bzw. ein.
Ich hängs dir mal an, da kannst du bissel gucken wie es gehen könnte. Viele Wege führen nach Rom
PHP-Code:
<?php if (count($this->entries)): ?>
<table class="layout_simpletable" summary="Catalog Items" cellspacing="0" cellpadding="0">
<thead class="header">
<!-- chechboxes -->
<tr class="checkbox_container">
<?php list($field, $heading) = each($this->entries); ?>
<?php foreach ($heading['data'] as $field=>$data): ?>
<?php if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
<th class="field <?php echo $field; ?>"><input type="checkbox" checked="checked" class="checkbox <?php echo $field; ?>"><?php echo $data['label']; ?></input></th>
<?php endif; ?>
<?php endforeach; ?>
</tr>
<tr class="label_container">
<?php list($field, $heading) = each($this->entries); ?>
<?php foreach ($heading['data'] as $field=>$data): ?>
<?php if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
<th class="field <?php echo $field; ?>"><?php echo $data['label']; ?></th>
<?php endif; ?>
<?php endforeach; ?>
</tr>
</thead>
<tbody class="body<?php echo $entry['class'] ? ' '.$entry['class'] : ''; ?>">
<?php foreach ($this->entries as $entry): ?>
<tr class="item<?php echo $entry['class'] ? ' '.$entry['class'] : ''; ?>">
<?php foreach ($entry['data'] as $field=>$data): ?>
<?php if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
<td class="field <?php echo $field; ?>"><?php if (strlen($data['value'])): ?>
<?php echo $data['value']; ?>
<?php endif; ?>
</td>
<?php endif; ?>
<?php endforeach; ?>
<?php if ($entry['showLink'] && $entry['link']): ?>
<td class="link"><div class="link"><?php echo $entry['link']; ?></div></td>
<?php endif; ?>
<?php if ($entry['linkEdit']): ?>
<td class="edit"><div class="linkEdit"><?php echo $entry['linkEdit']; ?></div></td>
<?php endif; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<?php else: ?>
<?php if ($this->condition): ?>
<div class="condition"><?php echo $this->condition; ?></div>
<?php else: ?>
<p class="info">There are no entries matching your search.</p>
<?php endif; ?>
<?php endif; ?>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
/**
* Blende Spalten aus, wenn Chechbox NICHT gedrueckt ist
*/
window.addEvent('domready', function()
{
var cols = $$('.mod_cataloglist .layout_simpletable tbody td');
var checkboxes = $$('.mod_cataloglist .checkbox_container input');
var colClasses = cols.get('class'); // store class names in an array
var isChecked;
var index;
var boxClass;
var thisCols = Array(); // store cols to hide / show
// hide unchecked cols on page load
checkboxes.each(function(item, index)
{
if (!item.get('checked'))
{
boxClass = item.get('class').replace('checkbox ', '');
colClasses.each(function(item, index)
{
if (item.search(boxClass) != -1) thisCols.push(cols[index]);
});
}
});
thisCols.each(function(item, index)
{
//item.setStyles({display:'none'});
item.fade('hide');
});
// Eventlistener
checkboxes.addEvents({
'click' : function()
{
index = checkboxes.indexOf(this);
isChecked = this.get('checked'); // check if checkbox is selected / not
boxClass = this.get('class').replace('checkbox ', ''); // strip down the class name to its single fieldname
thisCols = Array();
// loop through cols Array and find the cols containing the boxClass
colClasses.each(function(item, index)
{
if (item.search(boxClass) != -1) thisCols.push(cols[index]);
});
if(isChecked)
{
thisCols.each(function(item, index)
{
//item.setStyles({display:'block'});
item.fade('in');
});
}
else
{
thisCols.each(function(item, index)
{
//item.setStyles({display:'none'});
item.fade('out');
});
}
}
});
});
//--><!]]>
</script>
Oben erstelle ich ein paar Checkboxes über dem table heads, die gleich gecheckt sind -> weil der user ja erstmal alles sehen soll
Die checkboxes kriegen als Klassennamen: checkbox <?php echo $field; ?>
=> checkbox meinFelderName
Unten kommt dann der javascript block, der genau das macht wie oben erklärt.
Theoretisch kannst du die Checkboxes überall platzieren. solange sie innerhalb der .mod_cataloglist klasse bleiben und als wrapper .checkbox_container kriegen. (das sind meine selectors für mootools) (kann man auch alles ändern. musst dann halt nur anpassen)
Viele Grüße,
Tim
ps. habs grad noch getuned:
Die ausgeblendeten Spalten sollten beim Seiten-Reload gleich ausgeblendet werden.
Und noch bissel fancy stuff rein, mit dem fade(); kannst du die Spalten schön smooth ausblenden lassen.
Falls du das nicht willst, einfach im mootools Teil die auskommentierten Teile mit dem setStyles nehmen und die fades dafür auskommentieren.
Lesezeichen