Attend event form with ajax

时间:2019-11-26 作者:Dennis

我创建了一个Wordpress网站,里面有乐队的演唱会。所有登录的用户都可以选择是否参加过该特定的演出。类似于集合列表。fm。

所以我创建了一个新表wp_gigs_attending. 此表有3个字段:

参加id当然是主键(A.I),参加id是您参加的演出的id,用户id是您的用户id,所以是当前用户的id。

一切正常,但我在模板中添加了PHP代码,也没有ajax。当我点击表单时,页面会刷新,这看起来不是很好。

所以我想用ajax提交表单(只有一个按钮)。

single-gig.php 模板:

<?php if ( is_user_logged_in() ) {  ?>
    <div class="attended">
        <form method="post" id="attending" class="attended__form">
            <input type="submit" name="submit" value="attend" />
        </form>
    </div>
<?php } ?>

<script>
    jQuery(function(){
        jQuery(\'#attending\').on(\'submit\', function(e){
            e.preventDefault();

            jQuery.ajax({
                type: \'post\',
                url: \'<?php bloginfo(\'template_directory\'); ?>/inc/attend.php\',
                data: jQuery(\'#attending\').serialize(),
                succes: function(){
                    alert(\'form was succesfully submitted\');
                }
            })
        });
    });
</script>
在我的/inc文件夹中,我必须编写代码,检查我是否参加过那场演出。

如果我没有参加过那场演出->单击表单按钮->在表格中插入行如果我参加过那场演出->单击表单按钮->删除那行这是中的代码attended-gig.php:

//get the user id
$current_user = wp_get_current_user();
$current_user_id = $current_user->ID;

//get the post id
$current_post_id = get_the_ID();

//check if already attended
$attending = $wpdb->get_var(
    $wpdb->prepare(
        "SELECT attending_id FROM " . $wpdb->prefix . "gigs_attending
        WHERE user_id = %d AND post_id = %d LIMIT 1",
        $current_user_id, $current_post_id
    )
);

if ( $attending > 0 ) {
    $isAttending = true;
} else {
    $isAttending = false;
}


//actions
if($isAttending == false) {
    //if not attended yet, insert the user_id and post_id in the table
    $success = $wpdb->insert("wp_gigs_attending", array(
        "user_id" => $current_user_id,
        "post_id" => $current_post_id,
    ));

} else {
    //if attended yet, delete the row in the table
    $succes = $wpdb->get_var(
        $wpdb->prepare(
            "DELETE FROM " . $wpdb->prefix . "gigs_attending
            WHERE user_id = %d AND post_id = %d LIMIT 1",
            $current_user_id, $current_post_id
        )
    );
}
我知道这些查询工作正常。但我在该文件上收到一个500(内部服务器错误)。

想要的结果:

用户尚未参加该特定的演出->单击按钮->在表中插入新行->该按钮现在有一个额外的类,因此可以看到他参加了该演出删除表中的那一行->删除按钮上的额外类当用户去参加演唱会时。php,必须看到他已经参加了那场演出,所以attended 班级必须按那个按钮。

1 个回复
SO网友:Hendrik Vlaanderen

首先您需要按照ajax best practices in Wordpress. 这意味着,为您的函数添加正确的操作,并使用admin ajax url调用它们。

因此,jQuery ajax应该调用admin\\u url,在本例中,您需要发送一个“action”数据,操作的名称:“subscribe”;(wp\\u ajax\\u subscribe减去wp\\u ajax\\u)您可以将其包含在名为“action”和值为“subscribe”的隐藏输入字段中,因此您可以序列化函数从提交事件中提取它

url: \'<?php echo admin_url( \'admin-ajax.php\' )?>\',

add_action( \'wp_ajax_subscribe\', \'ja_ajax_subscribe\' );
add_action( \'wp_ajax_nopriv_subscribe\', \'ja_ajax_subscribe\' );

function ja_ajax_subscribe(){

   $result = \'some data\';

   wp_send_json_success($result);
}

相关推荐

在通过AJAX显示帖子的同时填充地图

我的网站上有一个地图搜索页面。我可以用HTML显示列表中的所有位置,但我很难同时将这些位置传递给JavaScript,以便在我的Google地图上填充PIN。我似乎只能wp_localize_script 处理初始页面加载和AJAX调用期间的工作。这是我的javascript:jQuery(document).on( \'submit\', \'#locationsearch\', function() { var form = jQuery(this); var inpu