Meta-Box über Jquery-Kontrollkästchen anzeigen

Ich habe mit Jquery und PHP herumalbern und ich versuche, eine Website für ein Sportteam einzurichten. Ich habe einen benutzerdefinierten Post-Typ namens “Matches” erstellt und darin zwei benutzerdefinierte Meta-Boxen erstellt. Eine für die Spieldetails (IE Heim- und Auswärtsmannschaft) und eine für Spielstatistiken (Tore, Schüsse usw.). Was ich momentan habe, ist ein (Is This Game Complete) Kontrollkästchen, das die Statistikoptionen (die sich in einer Div #meta_box_stats befinden) in den Meta Box Details (#dw_match_details) anzeigt / versteckt.

Der Checkbox-Datenwert wird gespeichert, funktioniert jedoch nicht richtig. Wenn es beim Laden zum Bearbeiten fertig ist und der Wert auf ‘Ein’ gesetzt ist, wird das Statistik-Meta-Feld immer noch nicht angezeigt, wenn ich versuche, den Beitrag zu bearbeiten, ich muss es abklicken und dann erneut anklicken. Hier ist mein Code (so kurz wie möglich, weil viel los ist).

Das funktioniert, da ich einen var_dump bei der Überprüfung gemacht habe und sich entsprechend auf on oder off ändert und entweder den Check anzeigt oder nicht.

Ich möchte, dass die Statistiken zunächst ausgeblendet werden, bis der Gamescore eingegeben wird. Einmal eingegeben und als abgeschlossen überprüft, sollte es immer angezeigt werden, wenn Sie die Seite bearbeiten … Ich kann nicht herausfinden, warum es nicht ist.

Hier ist mein Skript

 jQuery(document).ready(function($) { $("#dw_match_stats").hide(); $('#dw_match_details').on('change', '#dw_complete', function() { played = $(this).prop('checked'); if (played) { $('#dw_match_stats').show(); } else { $('#dw_match_stats').hide(); } }); $('#dw_match_stats').change(); });  

Wie bereits erwähnt, wird der benutzerdefinierte Datenwert “dw_complete” korrekt gespeichert und geändert.

EDIT: Hier ist ein Teil des verbleibenden Codes. Ich habe im Wesentlichen zwei Metaboxen erstellt, eine mit der Bezeichnung #dw_match_details, die die Teamauswahl und das Kontrollkästchen hat, ob das Spiel abgeschlossen ist oder nicht.

 

Match Details

ID ); $check = $values['dw_complete'][0]; ?> <input type="checkbox" id="dw_complete" name="dw_complete" />

Dann habe ich meine Statistik Metabox.

 
Goals Per Period:
  1st 2nd 3rd OT Total

Das ist der core davon, ich habe offensichtlich mehr Informationen für den Statistikbereich, denke aber, dass es irrelevant sein sollte. Wenn Sie mich brauchen, um das zu schreiben, kann ich es in eine PasteBin schreiben. Bevor ich hier vergesse sind die zwei Aufrufe um meine Metaboxen zu erstellen.

 function dw_custom_meta_boxes_match() { add_meta_box( 'dw_match_details', 'Match Details', 'dw_match_details', 'dw_match', 'normal', 'high' ); add_meta_box('dw_match_display', 'Match Statistics', 'dw_match_display', 'dw_match', 'normal', 'low' ); 

Solutions Collecting From Web of "Meta-Box über Jquery-Kontrollkästchen anzeigen"

Ich fand eine Lösung, ziemlich einfach

  

Ich habe Ihren Code vereinfacht, indem Sie das WordPress-Zeug entfernt und etwas von Ihrem Markup entfernt haben. Ich habe festgestellt, dass das change Event noch nicht ausgeführt wurde change bis ich es auf diese Weise gemacht habe:

 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    Testing jQuery     
[This data should be seen when the page loads.]

Ich habe eine Warnmeldung hinzugefügt, damit Sie sehen können, dass das change beim Laden der Seite ausgeführt wird. Ich weiß nicht, warum der zweite Aufruf von jQuery(document).ready funktioniert. Ich habe es nur auf Lerche versucht. 🙂

Dies testet die Seite, wenn das Kontrollkästchen aktiviert ist. Um die Seite zu überprüfen, wenn das Kontrollkästchen nicht aktiviert ist, ändern Sie diese Zeile:

  

Zu diesem:

  

Versuchen Sie also, Ihren jQuery-Code folgendermaßen zu ändern:

 jQuery(document).ready(function($) { $('#dw_match_details').on('change', '#dw_complete', function() { played = $(this).prop('checked'); if (played) { $('#dw_match_stats').show(); } else { $('#dw_match_stats').hide(); } }); }); jQuery(document).ready(function($) { $('#dw_match_stats').change(); });