Related fields in a form

  • Resolved jordiwordpress

    (@jordiwordpress)


    1 year, 2 months ago

    I am creating a form and in the related field "fotografias_de" the list is shown in alphabetical order without searching or reordering. Do I need to load some kind of libraries to make it look like List view (with reordering) form or take advantage of one that is already there?

    thanks

    <!-- "fotografias_de" related custom field -->
        <label for="otros-fotografos">Otros Fotógrafos:</label>
		
        <?php
        $fotgrafo_args = array(
            'post_type' => 'fotgrafo',
            'posts_per_page' => -1,
            'orderby' => 'title',
            'order' => 'ASC',
        );

        $fotgrafo_query = new WP_Query( $fotgrafo_args );

        if ( $fotgrafo_query->have_posts() ) :
            ?>
            <select id="otros-fotografos" name="otros-fotografos[]" multiple >
                <?php while ( $fotgrafo_query->have_posts() ) : $fotgrafo_query->the_post(); ?>
                    <option value="<?php the_ID(); ?>"><?php the_title(); ?></option>
                <?php endwhile; ?>
            </select>
            <?php
            wp_reset_postdata();
        endif;
        ?>
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Paul Clark

    (@pdclark)

    You appear to be writing a custom form from scratch using WP_Query to list your options.

    To have a sortable select in a form, JavaScript is necessary.

    The Pods shortcode has a form="1" option which will output a full form with the admin-defined user interface. It uses React.

    WordPress Core enqueues have jquery-ui-sortable, which is a way of making elements sortable. It would not populate a select element; the form would need to be serialized with JavaScript.

    Chosen by Harvest is a popular jQuery plugin for turning a select into a searchable UI. It is not sortable. It has not been actively developed for 5 years.

    SortableJS is an example of another sorting library. Like jQuery UI, it creates proxy elements separate from a <select>.

    Custom sortable forms require custom logic to submit IDs of relevant selected elements in the correct order.

    See WP_Query if you’re looking to search or sort on the PHP side, or PHP usort() if there’s some sorting criteria desired on the server side that’s not provided by WP_Query.

    See pods()->save() if you’re looking for a quick way to save the relationship IDs separate from update_post_meta() or add_post_meta()

    Thread Starter jordiwordpress

    (@jordiwordpress)

    Thanks for the info, sometimes I use the pods shortcode, but in this case I also have to incorporate relationships with taxonomies.
    Reordering is good, but with the searchable option would be enough. Any solution only with search?

    Thanks again

    Plugin Support Paul Clark

    (@pdclark)

    See the documentation for Chosen for “only search”, or see jQuery :contains() or JavaScript indexOf().

    When developing custom applications, it may be most suitable to search StackOverflow.com, CodePen.io, or even GPT, rather than posting a support request to a plugin tangentially used to configure a data structure.

    Documentation for the API of the existing React fields can be found at https://docs.pods.io/code/dfv-js-api/. Source code is on GitHub, but like most React libraries, requires significant tooling and build process.

    But this question isn’t really about Pods, it’s about how to build something new that’s somewhat similar, so I’ve marked it as resolved as links to many possible solutions have been provided.

    Thread Starter jordiwordpress

    (@jordiwordpress)

    ok, thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Related fields in a form’ is closed to new replies.