Custom Fields
Re-Envisioned
Support MB Relationships Show data from related post/term after selection

  • Creator
    Topic
  • #16442
    brandonjp
    Participant

    I’m trying to create a display on an Admin Edit Post form that will show meta from a relational field after the related post/term is selected.

    Is there a built-in way to do this?

    If not, Any tips on creating this? (I’m guessing I’ll use JS to make a custom request to get the data and populate a Custom HTML MB field)

Viewing 2 replies - 1 through 2 (of 2 total)
  • Author
    Replies
  • #16457
    Anh Tran
    Keymaster

    Hi,

    Do you mean showing the data dynamically, based on the user selection of related posts/terms? If yes, then I think you’ll have to do that your way with JS + custom HTML field.

    #16518
    brandonjp
    Participant

    I ended up accomplishing this using a Custom HTML field & a little PHP and JS.

    If anyone else ends up needing direction on this, here are a few links. This is not a drop-in solution for you but hopefully helps get you started.

    PHP to handle an incoming AJAX request for term metadata & return JSON:

    /**
    // ————————-
    // Fetch Taxonomy Term & Meta
    // ————————-
    // GOAL: When a user selects a taxonomy term (from a MetaBox.io field) this helps fetch
    // the term & it's metadata and returns JSON so the JS can load it into a Custom HTML block
    // ————————-
    // FORUM – https://metabox.io/support/topic/show-data-from-related-post-term-after-selection/
    // PHP – https://gist.github.com/21fed6266453de7ba76b3d2bc0e5a06f
    // JS – https://gist.github.com/3b636d0c7e55ce6dc58ceba3de9a974e
    // ————————-
    **/
    // Gets meta data for a term and returns JSON
    function get_json_term_meta()
    {
    global $wpdb;
    $termID = $_GET['termID'];
    $field = $_GET['field'];
    if (!empty($termID)) {
    if (empty($field)) {
    $data = get_term_meta($termID);
    $term = get_term($termID);
    // add the term name
    $data['term_name'] = [$term->name];
    if (!empty($data['related_customer'])) {
    $relCustomer = get_term($data['related_customer'][0]);
    // add the customer name
    $data['related_customer_name'] = [$relCustomer->name];
    }
    } else {
    $data = get_term_meta($termID, $field);
    }
    echo wp_send_json($data);
    }
    wp_die();
    }
    add_action('wp_ajax_get_json_term_meta', 'get_json_term_meta');
    // Gets a term and returns JSON
    function get_json_term()
    {
    global $wpdb;
    $termID = $_GET['termID'];
    $field = $_GET['field'];
    if (!empty($termID)) {
    if (empty($field)) {
    $data = get_term($termID);
    } else {
    $data = get_term($termID, $field);
    }
    echo wp_send_json($data);
    }
    wp_die();
    }
    add_action('wp_ajax_get_json_term', 'get_json_term');

    view raw
    wp-mb-tax-admin.php
    hosted with ❤ by GitHub

    JS to fetch the taxonomy term metadata and place it into the page:

    // ————————-
    // Fetch Taxonomy Term & Meta
    // ————————-
    // GOAL: When a user selects a taxonomy term (from a MetaBox.io field) this fetches the
    // term & it's metadata and loads it into a Custom HTML block
    // ————————-
    // FORUM – https://metabox.io/support/topic/show-data-from-related-post-term-after-selection/
    // PHP – https://gist.github.com/21fed6266453de7ba76b3d2bc0e5a06f
    // JS – https://gist.github.com/3b636d0c7e55ce6dc58ceba3de9a974e
    // ————————-
    // fetch taxonomy metadata and load it into view
    let get_job_tax_html = function get_job_tax_html(tax) {
    let htmlField = `.${tax}_html`;
    jQuery(`${htmlField}`).slideUp();
    // jQuery(`${htmlField}`).addClass('hidden');
    jQuery(`${htmlField} .rwmb-input > *`).empty();
    let termID = jQuery('#' + tax).val();
    if (termID !== '') {
    let data = {
    action: 'get_json_term_meta',
    termID: termID
    };
    let jqReq = jQuery.get(ajaxurl, data);
    jqReq.done(function(response) {
    // console.log(tax, response);
    jQuery.each(response, function(key, val) {
    // use this on first run to create the HTML to place inside the Custom HTML field
    // jQuery(`<span class="${key}">${val[0]}</span>`).appendTo(`${htmlField} .rwmb-input`);
    // as long as html structure is in place, this will inject the matching data
    if (val.length) jQuery(`${htmlField} .rwmb-input .${key}`).text(val[0]);
    });
    // jQuery(`${htmlField}`).removeClass('hidden');
    jQuery(`${htmlField}`).slideDown();
    });
    }
    }
    // PM – fetch term meta on init & then again on change
    get_job_tax_html('job_pm_taxonomy');
    jQuery('select#job_pm_taxonomy').change(function() {
    get_job_tax_html('job_pm_taxonomy');
    });
    // Contact – fetch term meta on init & then again on change
    get_job_tax_html('job_contact_taxonomy');
    jQuery('select#job_contact_taxonomy').change(function() {
    get_job_tax_html('job_contact_taxonomy');
    });

    view raw
    wp-mb-tax-admin.js
    hosted with ❤ by GitHub

    Add Custom HTML field with html to support the incoming term metadata (I also give it a custom class):

    After selecting a taxonomy it populates the Custom HTML like so:

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.