Tworzę witrynę WordPress przy użyciu niestandardowych szablonów / motywów, ale mam kłopot. Chcę używać Ajax do wywoływania funkcji, gdy użytkownik kliknie przycisk. Na jednej stronie mam taki przycisk: 

<p class="form-submit"> <input name="message_read" type="submit" class="submit button mark-as-read" value= "Mark as read" /> </p>

I mam taką funkcję jQuery / Ajax: 

jQuery(document).ready(function() { jQuery(".mark-as-read").click(function () { console.log("The function is hooked up"); jQuery.ajax({ type: "POST", url: "/wp-admin/admin-ajax.php", data: { action: "mark_message_as_read", }, success: function (output) { console.log(output); } }); }); });

Powyższa funkcja znajduje się w wp-content/themes/my-theme/js/wp_ajax_calls.js. Dodałem skrypt do strony w ten sposób:

1) Dodałem to do mojego pliku functions.php: 

wp_enqueue_script( "ajax calls", get_template_directory_uri() ."/js/wp_ajax_calls.js", array("jquery"), "1.0", true);

2) Skrypt umieściłem w nagłówku. 

<script type="text/javascript" src="https://mysite//wp-content/themes/twentyfifteen/js/wp_ajax_calls.js"></script>

Kiedy klikam przycisk bez zmian, pojawia się instrukcja console.log. Zgodnie z moim zrozumieniem chcę, aby moja funkcja Ajax wywoływała funkcję php, która pozwoli mi użyć $ wpdb. Mam to w functions.php: 

function mark_message_as_read() { global $wpdb; // do stuff. }

W tym miejscu jestem zdezorientowany. Mam dwa główne pytania:

1) Myślę, że gdzieś powinno być jakieś add_action () „, ale nie wiem gdzie umieść je, a także nie wiem, jakiego haka użyć.

2) Ponadto Chcę móc przekazywać dane (identyfikator wiadomości) do funkcji php dla mojego zapytania db. Jak mogę przekazać argument do tej funkcji?

Nie chcę używać czegoś takiego jak if( isset($_POST["message_whatever"]) ) twentyfifteen_message_whatever(); ze względu na sposób skonfigurowania wiadomości.

W razie potrzeby chętnie udzielę więcej informacji. Z góry dziękuję za pomoc !!

Komentarze

Odpowiedź

  1. Utwórz motyw potomny, aby nie zadzierać kod istniejącego motywu, ponieważ następnym razem „zaktualizujesz motyw”, możesz utracić wszystkie zmiany (zobacz Motywy potomne )

  2. Oto jak przekazać wartości do żądania Ajax: 

    jQuery(document).ready(function() { jQuery(".mark-as-read").click(function () { console.log("The function is hooked up"); jQuery.ajax({ type: "POST", url: "/wp-admin/admin-ajax.php", data: { action: "mark_message_as_read", // add your parameters here message_id: $(".your-selector").val() }, success: function (output) { console.log(output); } }); }); });

Możesz trochę poszukać na Nonces, aby dodać warstwę zabezpieczeń do aplikacji: https://codex.wordpress.org/WordPress_Nonces

  1. Na koniec kod PHP do obsługi żądania (tutaj również powinieneś obsłużyć kod jednorazowy w prawdziwym życiu): 

    // register the ajax action for authenticated users add_action("wp_ajax_mark_message_as_read", "mark_message_as_read"); // register the ajax action for unauthenticated users add_action("wp_ajax_nopriv_mark_message_as_read", "mark_message_as_read"); // handle the ajax request function mark_message_as_read() { $message_id = $_REQUEST["message_id"]; // add your logic here... // in the end, returns success json data wp_send_json_success([/* some data here */]); // or, on error, return error json data wp_send_json_error([/* some data here */]); }

Komentarze

  • Dziękuję bardzo! ' zdecydowanie przyjrzę się również liczbom nonces. : D

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *