使用WP API和Ajax更新WordPress博客名称和描述

时间:2015-12-09 20:23:13

标签: php jquery ajax wordpress wp-api

到目前为止,我已经创建了一个插件,可以创建输入表单,注册自定义端点并将支持脚本排入队列:

plugin.php

<%@ WebHandler Language="C#"  Class="TheCityofCalgary.GSA.SharePoint.GSAClick, TheCityofCalgary.GSA.SharePoint, Version=1.0.0.0, Culture=neutral, PublicKeyToken=9cc8cc252281ce26" %>
<%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

插件-的script.js

// Create Input Form
<?php
function mysite_input_form(){
?>
    <form id="site-name-form" class="site-name-form">
        <div>
            <label class="site-name-input-label" for="site-name-input">
                <?php _e( 'Site Name', 'mysite' ); ?>
            </label>
            <input type="text" name="site-name-input" id="site-name-input" class="site-name-input">
        </div>
        <input type="submit" value="<?php esc_attr_e( 'Submit', 'mysite'); ?>">
    </form>
<?php
}

// Register Custom Endpoint
add_action( 'rest_api_init', function () {
    register_rest_route( 'mysite-info/v1', '/name/', array(
        array(
            'methods'         => WP_REST_Server::READABLE,
            'callback'        => 'get_item',
        ),
        array(
            'methods'         => WP_REST_Server::EDITABLE,
            'callback'        => 'update_item',
        ),
    ));
});

//Equeue Script
function plugin_scripts(){
    //load script
    wp_register_script( 'plugin-script', plugins_url( '/js/plugin-script.js', __FILE__ ), array( 'jquery' ) );
    wp_enqueue_script( 'plugin-script' );

    //localize data for script
    wp_localize_script( 'plugin-script', 'FORM_SUBMITTER', array(
            'root' => esc_url_raw( rest_url() ),
            'nonce' => wp_create_nonce( 'wp_rest' ),
            'success' => __( 'Thanks for your submission!', 'mysite' ),
            'failure' => __( 'Your submission could not be processed.', 'mysite' ),
            'current_user_id' => get_current_user_id()
        )
    );
}
add_action( 'admin_enqueue_scripts', 'plugin_scripts' );

我正在使用&#34; PUT&#34;方法,因为我想更新数据库中博客名称的值。

我努力解决的主要问题是了解这需要做些什么。 WP API文档显示您需要回调来实际更新数据库中的值。

我认为这会奏效:

jQuery( document ).ready( function ( $ ) {
    $( '#site-name-form' ).on( 'submit', function(e) {
        e.preventDefault();

        var name = $('.site-name-input').val();

        var data = {
            name: name
        };

        $.ajax({
            method: "PUT",
            url: FORM_SUBMITTER.root + 'mysite-info/v1/name',
            data: data,
            beforeSend: function ( xhr ) {
                xhr.setRequestHeader( 'X-WP-Nonce', FORM_SUBMITTER.nonce );
            },
            success : function( response ) {
                console.log( response );
                alert( FORM_SUBMITTER.success );
            },
            fail : function( response ) {
                console.log( response );
                alert( FORM_SUBMITTER.failure );
            }
        });
    });
});

然而,当我提交输入值时,没有任何反应。它似乎甚至无法击中ajax&#34;失败&#34;案件。

请帮我弄清楚我错过了什么。

0 个答案:

没有答案