Mit Hilfe von jQuery ein - /ausblenden Umschalten in eine Tabelle

Ich versuche mich anzupassen, Andy Langton ' s show/hide/mini-Akkordeon (http://andylangton.co.uk/jquery-show-hide) arbeiten innerhalb einer Tabelle. Ich bin zu wollen, erstellen Sie eine Liste der Ereignisse mit einer Bestätigung an jeden event. Bei Klick auf den "bestätigen" - Taste in der letzten Zelle oder die Zeile, ich möchte das Formular im Zusammenhang mit diesem speziellen event enthüllt werden.

Andy ' s code verwendet

$('.toggle')
    .prev()
    .append('<a href="#" class="toggleLink">'+showText+'</a>');

dynamisch hinzufügen der toggle link (der button "bestätigen") kurz vor der versteckten form. Dies, jedoch, fügt den link in der Tabelle Zeile und nicht in einer Zelle. Daher habe ich es geändert

$('.toggle')
    .prev()
    .append('<td><a href="#" class="toggleLink">'+showText+'</a></td>');

Der link ist nun in der richtigen Stelle, aber jetzt tut sich nicht auf die ein - /ausblenden des Formulars. Wenn es falsch platziert der Funktionalität gearbeitet, trotz der nicht ganz richtig ist. Ich denke, dass der Selektor-Aufruf der Kniehebel ist nicht richtig, aber ich weiß nicht, wie man es richtig. Es ist derzeit

$(this)
    .parent()
    .next('.toggle')
    .toggle('slow');

Dies ist im wesentlichen, wie die Quelle aussieht...

<table id="training-events">
<tr>
   <th>Date /Time</th>
   <th>Event /Venue</th>
   <th>Cost</th>
   <th>Confirm</th>
</tr>
<tr class="event" valign="top">
    <td class="date">Mon, 10 August 2009<br>03:30 PM - 05:30 PM</td>
    <td><h5>Regional Director Meeting</td>
    <td>No Charge</td>
    <td><a href="#" class="toggleLink">Cancel</a></td>
</tr>
<tr style="display: none;" class="toggle">
   <td colspan="4">
      ** FORM **
   </td>
</tr>
</table>
InformationsquelleAutor Dekken | 2009-07-31
Schreibe einen Kommentar