3

クライアントがイベントの rsvp と支払いを行う機能を備えたイベントを作成できるようにするために、Wordpress プラグインを作成しました。特定のコードを配置する必要がある場所と、プラグイン フォルダー関数ファイル内に存在する関数にフォームを送信する方法について混乱しています。

現時点では、空白のアラートが返されます。

このフォームを 1 つのイベントのページに表示しています。

<div id="rsvpContent">  
  <form id="Attendevent" action="">
   <input id="attend" name="attend" type="checkbox" value="yes" /><label for="attent">Yes, I plan to attend.</label>
 </form>

次に、これを一般的な header.php ファイルに配置しました。

 $("#attend").click(function(){
    var form = $("#Attendevent").serialize();

    $.ajax({
      type:'POST',
      data:{"action":"Attending","data": form },
      url: "<?php bloginfo('url'); ?>/wp-admin/admin-ajax.php",
      beforeSend: function(){
        alert(form);
      },
      success: function(data) {
            alert(data);
      }

    }); 

 });

次に、この関数をプラグイン フォルダー内のメイン関数ページに配置しました。

function eventAttent() {
$wpdb->show_errors();
            if($_POST['attend'] == 'yes') {
                $wpdb->insert('wp_event_attendants',
                array( 'event_id' => get_the_ID(),'user_id' => $current_user->ID));
 echo $wpdb->print_error();
                }
            }


 add_action('wp_ajax_Attending', 'eventAttend');
 add_action('wp_ajax_nopriv_Attending', 'eventAttend');

ユーザーが「出席」チェックボックスをクリックしたときに、この関数を呼び出すにはどうすればよいですか?

4

2 に答える 2

3

このリンクは、テーマを ajax 化するための非常に優れたソースです。

このコードを子テーマの functions.php に入れます。

// enqueue your custom js       
 function my_js_method() {
    // for jquery ui
       wp_enqueue_style( 'jqueryUI_style', get_stylesheet_directory_uri() . '/customCSS/jquery-ui.css' );
        wp_enqueue_script(
            'handleFormAjax-script',
            get_stylesheet_directory_uri() . '/handleFormAjax.js',
            array( 'jquery' )
        );
    // add the appropriate hook
    add_action( 'wp_enqueue_scripts', 'my_scripts_method' );


    // declare the URL to the file that handles the AJAX request (wp-admin/admin-ajax.php)
    wp_localize_script( 'handleFormAjax-script', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
    }


    // AJAX handler snippet
    function myHandlerMethod(){
      if (is_admin())
    echo "woow working like a charm";
    die();
    }
    //add the hooks for your handler function
    add_action('wp_ajax_myHandlerMethod', 'myHandlerMethod');
    // for users who are not logged in
    add_action('wp_ajax_nopriv_myHandlerMethod', 'myHandlerMethod');

それに加えて、フォームは次のようになります。

<form id="assetForm" action= "/wp-admin/admin-ajax.php" method="post">
    <input type="hidden" name="action" value="myFunction"/>
    <button id="sbmBtn">SUBMIT </button>
</form>

最後に、js 関数は、functions.php で定義したハンドラ関数をアドレス指定する必要があります。

var data = jQuery("#myForm :input").serializeArray();

    jQuery.post(jQuery("#myForm").attr("action"),data, function(info) {
        // success code ;
                });
于 2013-09-16T16:47:49.487 に答える
2

このコードを試してください。これは私のテスト済みコードです。私と一緒にうまく働いています..しかし、それはファイルのアップロードを処理しません。

HTML

<form id="form_name" name="form_name" >
<span id='errfrmMsg' style='margin:0 auto;'></span>
  //form attributes just as input boxe.
  <input type="hidden" name="action" value="anyName" />
  <input id="submit_button" onclick="submit_form();" type="button" value="Send" />
</form>

jクエリ

function submit_form()
{
  jQuery.post(the_ajax_anyName.ajaxurl_anyName,
   jQuery("#form_name").serialize(),
     function(response_from_the_action_function){
                jQuery("#errfrmMsg").html(response_from_the_action_function).css({"display":"block"});
      }
   );
}

Functions.phpのPHPコード

wp_register_script("ajax-anyName", get_bloginfo('template_directory')."/js/custom_js.js", array( "jquery"));
wp_enqueue_script('ajax-anyName');
wp_localize_script("ajax-anyName","the_ajax_anyName", array("ajaxurl_anyName" => admin_url("admin-ajax.php")));
// add actions
add_action( "wp_ajax_anyName", "ajax_action_anyName" );
add_action( "wp_ajax_nopriv_anyName", "ajax_action_anyName" );

function ajax_action_anyName(){ 
  //Form processing code in PHP


}
于 2013-03-22T05:53:46.787 に答える