tablerow variables vervangen door input
ik heb de volgende table:
<table>
<thead>
<tr><th>ID</th><th>Username</th><th>Level</th><th>opties</th></tr>
</thead>
<tbody>
Code (php)
</tbody>
</table>
Nou wil ik bijv. dmv rel= te gebruiken in de td's aangeven wat het is, net als dat de tr[rel=1] staat voor de gehele rij van user id 1.
Dan zou ik graag o.a level willen vervangen door een input veld waar de id als value staat.
Is dat mogelijk ? (het moet wel alleen in die ene rij staan waar dus tr[rel=1] is.
In een functie als dit:
Code (php)
1
2
3
2
3
$('body').on('click', '.editUser', function (){
var id = $(this).attr('rel');
}
var id = $(this).attr('rel');
}
Hoe kan ik meerdere rel attributen koppelen?
Code (php)
1
$('tr[rel="' + id + '"]td[rel="id"]').html('<input type="text" id="userid" value="' + id + '">');
heeft hier niet zo'n zin in. Maar ik denk dat dat ook inderdaad niet klopt ;D
Enig idee iemand ?
Gewijzigd op 20/11/2014 20:36:48 door Dennis WhoCares
Het rel attribuut is mider ersnstig maar tegenwoordig hebben we daar het data attribuut voor.
Frank Nietbelangrijk op 20/11/2014 21:33:19:
Beste Frank,
inderdaad! Hier had ik eigenlijk nog helemaal niet aan gedacht, om het dubbel te doen.
Bedankt voor het voorbeeldje ! Dit is precies wat ik zocht :)
Ger van Steenderen op 20/11/2014 23:12:33:
Ik zie daar een ernstig misbruik van het href attribuut ....
Het rel attribuut is mider ersnstig maar tegenwoordig hebben we daar het data attribuut voor.
Het rel attribuut is mider ersnstig maar tegenwoordig hebben we daar het data attribuut voor.
Waarom is dit misbruik ? Eigenlijk was dit niet precies mijn href, maar mijn href="editButton/' . $tID
De functie die ik hierin ook niet beschreven heb haalt de geklikte href op om te weten waar naartoe gepost moet worden, daarom staat er ook een return false; in.
Gewijzigd op 21/11/2014 20:37:48 door Dennis WhoCares
Frank Nietbelangrijk op 20/11/2014 21:33:19:
Dit werkt geweldig :)
Echter probeer ik dit nu toe te passen op een pages beheer pagina.
Hier doe ik hetzelfde, alleen ... Heb ik een div met display:none waarin m'n textarea staat. (Binnen mn <form> elementen uiteraard.
Deze div wordt een popup waarmee ik een ckeditor bovenop het hele scherm toon. Na het sluiten van de div, kan ik dus pas mijn page opslaan.
Nu heb ik een probleem met het maken van een nieuwe pagina.
Deze form staat bovenaan m'n table
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
<tbody>
<tr><td>#<form action="insertPage" method="post"></td>
<td><input type="text" name="new_page_title" style="width: 130px" maxlength="30"></td>
<td><a href="#" class="openEditor" title="Open Pagina Editor"><img src="<?php echo URL; ?>views/admin/css/imgs/editor.png" alt="Open Pagina Editor" border="0" width="20" height="20"></a> <button href="#" class="openEditor">Editor</button></td>
<td><input type="text" name="new_page_link" style="width: 80px" maxlength="16"></td>
<td><select name="new_page_level" style="width: 80px"><?php echo $levels; ?></td>
<td><select name="new_page_file" style="width: 80px"><option value="0">Nee</option><option value="1">Ja</option></select></td>
<td style="text-align: center"><input type="submit" value="" class="addButton"><div id="newPageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="newTextarea" class="ckeditor" name="new_page_content" style="width: 100%; height: 100%"></textarea><br><button class="closeEditor"> Sluiten </button></center></div></form></td>
<tr>
<tr><td colspan="7"></td></tr>
</tbody>
<tr><td>#<form action="insertPage" method="post"></td>
<td><input type="text" name="new_page_title" style="width: 130px" maxlength="30"></td>
<td><a href="#" class="openEditor" title="Open Pagina Editor"><img src="<?php echo URL; ?>views/admin/css/imgs/editor.png" alt="Open Pagina Editor" border="0" width="20" height="20"></a> <button href="#" class="openEditor">Editor</button></td>
<td><input type="text" name="new_page_link" style="width: 80px" maxlength="16"></td>
<td><select name="new_page_level" style="width: 80px"><?php echo $levels; ?></td>
<td><select name="new_page_file" style="width: 80px"><option value="0">Nee</option><option value="1">Ja</option></select></td>
<td style="text-align: center"><input type="submit" value="" class="addButton"><div id="newPageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="newTextarea" class="ckeditor" name="new_page_content" style="width: 100%; height: 100%"></textarea><br><button class="closeEditor"> Sluiten </button></center></div></form></td>
<tr>
<tr><td colspan="7"></td></tr>
</tbody>
Waarin ook weer deze verborgen div in zit. Nou is het probleem, de 1e keer dat ik op m'n newButton klik om te versturen, krijg ik de melding vanuit m'n controller dat new_page_content geen inhoud bevat. (In m'n post php heb ik controle of new_page_content groter is dan 1 karakter)
Als ik daarna gewoon nog een keer druk, gaat het wel goed.
Terwijl het aanpassen van m'n pages weer wel in 1 keer goed gaat. :-/
Iemand enig idee hoe dit komt?
hieronder m'n jQuery.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
$('form').submit(function(event){
event.preventDefault();
var id = $(this).attr('rel');
var url = $(this).attr('action');
var data = $(this).serialize();
var success = 'false';
$.post(url, data, function(o) {
if(o.result === 'true') {
if(url === 'insertPage') {
showAlert('success','Success!','De pagina is succesvol toegevoegd.<br>Moment geduld, de pagina wordt vernieuwd.');
success = 'true';
} else {
//De code hierin doet er nu niet toe, is voor update van een pagina.
}
} else {
showAlert('danger','Fout!',o.msg);
}
}, 'json');
if(url === 'insertPage' && success === 'true') {
setTimeout(function(){ window.location.href = 'http://localhost/admin/pages'; }, (2500));
}
});
event.preventDefault();
var id = $(this).attr('rel');
var url = $(this).attr('action');
var data = $(this).serialize();
var success = 'false';
$.post(url, data, function(o) {
if(o.result === 'true') {
if(url === 'insertPage') {
showAlert('success','Success!','De pagina is succesvol toegevoegd.<br>Moment geduld, de pagina wordt vernieuwd.');
success = 'true';
} else {
//De code hierin doet er nu niet toe, is voor update van een pagina.
}
} else {
showAlert('danger','Fout!',o.msg);
}
}, 'json');
if(url === 'insertPage' && success === 'true') {
setTimeout(function(){ window.location.href = 'http://localhost/admin/pages'; }, (2500));
}
});
Om het even nog makkelijk te houden heb ik voor een nieuwe pagina doe ik nog geen jQuery code gedaan voor het toevoegen aan de tabel. Alleen een reload van de pagina aan het einde van de code.
Gewijzigd op 01/12/2014 19:17:31 door Dennis WhoCares
Het is even geleden, maar volgens mij moet je de gegevens ophalen met ckEditor.getData() als je buiten CKE om wilt werken.
nee niet met de update button van CKEditor, maar ook met een input type="submit" button:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
foreach($this->pagesList as $key => $value) {
$editContent = '<a href="' . $value['page_id'] . '" class="openEditor" title="Open Pagina Editor"><img src="' . URL . 'views/admin/css/imgs/editor.png" alt="Open Pagina Editor" border="0" width="20" height="20"></a> <button href="' . $value['page_id'] . '" class="openEditor">Editor</button>';
$tTitle = strip_tags($value['page_title']);
$tContent = strip_tags($value['page_content']);
if(strlen($tTitle) > 13)
$tTitle = substr($value['page_title'], 0, 13) . '…';
if(strlen($tContent) > 25)
$tContent = substr($tContent, 0, 25) . '…';
if($value['page_file'] == 1) {
$tContent = 'Hardcoded pagina';
$editContent = 'Contacteer developer.';
}
echo '<tr id="static' . $value['page_id'] . '">
<td>' . $value['page_id'] . '</td>
<td>' . $tTitle . '</td>
<td>' . $tContent . '</td>
<td>' . $value['page_link'] . '</td>
<td>' . $value['page_level'] . '</td>
<td>' . $isHardcoded[$value['page_file']] . '</td>
<td><a href="' . $value['page_id'] . '" class="edit" title="Pagina Wijzigen"><img src="' . URL . 'views/admin/css/imgs/edit.png" alt="Pagina Wijzigen" border="0" width="20" height="20"></a>
<a href="' . $value['page_id'] . '" class="delete" title="Pagina Verwijderen"><img src="' . URL . 'views/admin/css/imgs/delete.png" alt="Pagina Verwijderen" border="0" width="20" height="20"></a></td>
</tr>
<form action="updatePage" method="post" id="editForm" rel="' . $value['page_id'] . '"><tr id="edit' . $value['page_id'] . '" class="editRow">
<td><input type="hidden" name="page_id" value="' . $value['page_id'] . '">' . $value['page_id'] . '</td>
<td><input type="text" name="page_title" value="' . $value['page_title'] . '" maxlength="30" style="width: 180px"></td>
<td>' . $editContent . '</td>
<td><input type="text" name="page_link" value="' . $value['page_link'] . '" maxlength="16" style="width: 80px"></td>
<td><select name="page_level" style="width: 80px">' . str_replace('value="' . $value['page_level'] . '"', 'value="' . $value['page_level'] . '" selected', $levels) . '</select></td>
<td><select name="page_file" style="width: 80px">' . str_replace('value="' . $value['page_file'] . '"', 'value="' . $value['page_file'] . '" selected', $hardcoded) . '</select></td>
<td><input type="submit" name="" value="" class="saveButton">
<a href="' . $value['page_id'] . '" class="cancel" title="Annuleren"><img src="' . URL . 'views/admin/css/imgs/cancel.png" alt="Annuleren" border="0" width="20" height="20"></a></td>
</tr><div id="pageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="textarea" class="ckeditor" name="page_content" style="width: 100%; height: 100%">' . $value['page_content'] . '</textarea><br><button class="closeEditor"> Sluiten </button></center></div></form>';
}
$editContent = '<a href="' . $value['page_id'] . '" class="openEditor" title="Open Pagina Editor"><img src="' . URL . 'views/admin/css/imgs/editor.png" alt="Open Pagina Editor" border="0" width="20" height="20"></a> <button href="' . $value['page_id'] . '" class="openEditor">Editor</button>';
$tTitle = strip_tags($value['page_title']);
$tContent = strip_tags($value['page_content']);
if(strlen($tTitle) > 13)
$tTitle = substr($value['page_title'], 0, 13) . '…';
if(strlen($tContent) > 25)
$tContent = substr($tContent, 0, 25) . '…';
if($value['page_file'] == 1) {
$tContent = 'Hardcoded pagina';
$editContent = 'Contacteer developer.';
}
echo '<tr id="static' . $value['page_id'] . '">
<td>' . $value['page_id'] . '</td>
<td>' . $tTitle . '</td>
<td>' . $tContent . '</td>
<td>' . $value['page_link'] . '</td>
<td>' . $value['page_level'] . '</td>
<td>' . $isHardcoded[$value['page_file']] . '</td>
<td><a href="' . $value['page_id'] . '" class="edit" title="Pagina Wijzigen"><img src="' . URL . 'views/admin/css/imgs/edit.png" alt="Pagina Wijzigen" border="0" width="20" height="20"></a>
<a href="' . $value['page_id'] . '" class="delete" title="Pagina Verwijderen"><img src="' . URL . 'views/admin/css/imgs/delete.png" alt="Pagina Verwijderen" border="0" width="20" height="20"></a></td>
</tr>
<form action="updatePage" method="post" id="editForm" rel="' . $value['page_id'] . '"><tr id="edit' . $value['page_id'] . '" class="editRow">
<td><input type="hidden" name="page_id" value="' . $value['page_id'] . '">' . $value['page_id'] . '</td>
<td><input type="text" name="page_title" value="' . $value['page_title'] . '" maxlength="30" style="width: 180px"></td>
<td>' . $editContent . '</td>
<td><input type="text" name="page_link" value="' . $value['page_link'] . '" maxlength="16" style="width: 80px"></td>
<td><select name="page_level" style="width: 80px">' . str_replace('value="' . $value['page_level'] . '"', 'value="' . $value['page_level'] . '" selected', $levels) . '</select></td>
<td><select name="page_file" style="width: 80px">' . str_replace('value="' . $value['page_file'] . '"', 'value="' . $value['page_file'] . '" selected', $hardcoded) . '</select></td>
<td><input type="submit" name="" value="" class="saveButton">
<a href="' . $value['page_id'] . '" class="cancel" title="Annuleren"><img src="' . URL . 'views/admin/css/imgs/cancel.png" alt="Annuleren" border="0" width="20" height="20"></a></td>
</tr><div id="pageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="textarea" class="ckeditor" name="page_content" style="width: 100%; height: 100%">' . $value['page_content'] . '</textarea><br><button class="closeEditor"> Sluiten </button></center></div></form>';
}
Gewijzigd op 01/12/2014 20:25:36 door Dennis WhoCares
Ger van Steenderen op 01/12/2014 21:20:12:
Ik zie geen textarea in je formulier
Hoi Ger,
de allerlaatste regel van de foreach, die zit ook in zo'n "popup" div.
Code (php)
1
2
2
......
</tr><div id="pageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="textarea" class="ckeditor" name="page_content" style="width: 100%; height: 100%">' . $value['page_content'] . '</textarea><br><button class="closeEditor"> Sluiten </button></center></div></form>
</tr><div id="pageEditor" class="transperant"><center><h2 style="font-size: 30px">Pagina Editor</h2><textarea id="textarea" class="ckeditor" name="page_content" style="width: 100%; height: 100%">' . $value['page_content'] . '</textarea><br><button class="closeEditor"> Sluiten </button></center></div></form>
EDIT
Ger van Steenderen op 01/12/2014 19:53:26:
Het is even geleden, maar volgens mij moet je de gegevens ophalen met ckEditor.getData() als je buiten CKE om wilt werken.
Hey Ger, bedankt voor de tip! Inderdaad als ik de ckeditor als var initialiseer met de replace, kan ik mbv de update een andere var invullen met de data.
Naderhand kan ik dus zoals je al zei met die var.getData() de inhoud van die ckeditor overnemen! :D
Gewijzigd op 02/12/2014 19:31:05 door Dennis WhoCares