Ik ben een WordPress-site aan het ontwikkelen met aangepaste sjablonen / themas, maar ik heb probleem. Ik wil Ajax gebruiken om een functie aan te roepen wanneer een gebruiker op een knop klikt. Op de ene pagina heb ik een knop als volgt: 

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

En ik heb een jQuery / Ajax-functie zoals deze: 

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); } }); }); });

De functie hierboven leeft in wp-content/themes/my-theme/js/wp_ajax_calls.js. Ik heb het script als volgt aan de site toegevoegd:

1) Ik heb dit toegevoegd aan mijn functions.php-bestand: 

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

2) Ik heb het script in de koptekst opgenomen. 

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

Wanneer ik op de knop klik zoals deze is, verschijnt de console.log-instructie. Voor zover ik weet, wil ik dat mijn ajax-functie een php-functie aanroept waarmee ik $ wpdb kan gebruiken. Ik heb dit in functions.php: 

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

Dit is waar ik in de war raak. Ik heb twee hoofdvragen:

1) Ik denk dat ik ergens add_action () “s moet hebben, maar ik weet niet waar ik heen moet plaats ze en ik weet ook niet welke haak ik moet gebruiken.

2) Bovendien, Ik wil gegevens (het bericht-ID) kunnen doorgeven aan de php-functie voor mijn db-query. Hoe geef ik een argument door aan die functie?

Ik wil zoiets als if( isset($_POST["message_whatever"]) ) twentyfifteen_message_whatever(); niet gebruiken vanwege de manier waarop ik berichten heb ingesteld.

Graag meer informatie indien nodig. Bij voorbaat dank voor uw hulp !!

Reacties

Answer

  1. Maak een child-thema zodat je niet rommelt met de code van een bestaand thema, want de volgende keer dat u het thema bijwerkt, kunt u al uw wijzigingen kwijtraken (zie Onderliggende themas )

  2. Hier is hoe u waarden doorgeeft aan uw ajax-verzoek: 

    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); } }); }); });

U kunt wat onderzoek doen ook op Nonces, om een beveiligingslaag aan uw app toe te voegen: https://codex.wordpress.org/WordPress_Nonces

  1. Eindelijk, de PHP-code om het verzoek af te handelen (ook hier moet je de nonce in het echte leven afhandelen): 

    // 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 */]); }

Reacties

  • Heel erg bedankt! Ik ' zal zeker ook nonces bekijken. : D

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *