0

i want to display a particular post data on same page through its id when i change value in select. the code for select is done and somewhat like below after which i am stuck can i get any help on how to display the data.

<select class="form-control" id="selectid" name="selectid" > 
<?php 

global $query_string;
//   query_posts ('posts_per_page=20');
query_posts(array(
'post_type' => 'postname',
'posts_per_page' => '1000'
)); 

while (have_posts()) : the_post();                                              
the_title("<option>", "</option>");
endwhile;
?>                                              
</select>

the below image may help to understand betterenter image description here

closed as too broad by Jacob Peattie, Nathan Johnson, fuxia Aug 9 at 15:58

Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

1

I think this should work for you:

<?php 
    $posts = get_posts( array(
        'post_type'      => 'postname',
        'posts_per_page' => '1000'
    ) );
?>
<select class="form-control" id="selectid" name="selectid" > 
    <?php foreach( $posts as $post ) : ?>
        <option value="<?php esc_attr_e( $post->ID ); ?>"><?php esc_html_e( $post->post_title ); ?></option>
    <?php endforeach; ?>                                         
</select>
<!-- Post info -->
<div id="post_info">
</div>

And the javascript part (you will need to enqueue a script dependent on 'jquery', or use another library that supports ajax).

/* script.js, requires jQuery */
;(function($) {
    $(document).ready(function() {
        var postInfoElement = $("#post_info");
        $("#selectid").change(function() {
            var postId = $(this).val();
            $.ajax({
                type: "POST",
                data: "action=get_sigle_post&post_id=" + postId,
                url:  "/wp-admin/admin-ajax.php", // Careful with this, use 'wp_localize_script' along with the script enqueue method instead.
                success: function(response) {
                    if (!response.success) {
                        // Something went wrong, response.data should contain an error message
                        return false;
                    }
                    var post = response.data;
                    // Do whatever you need to do with "post" and "postInfoElement" variables
                }
            });
        });
    });
})(jQuery);

And finally you will need an ajax handler

// Define this somewhere within your plugin or theme's functions file.
add_action( 'wp_ajax_get_sigle_post', 'my_func_get_sigle_post' );
add_action( 'wp_ajax_nopriv_get_sigle_post', 'my_func_get_sigle_post' ); // For non-logged in users

function my_func_get_sigle_post() {
    $post_id = isset( $_POST['post_id'] ) ? ( int ) $_POST['post_id'] : 0;
    if ( ! $post_id ) wp_send_json_error( 'Invalid post id' );
    $post = get_post( $post_id );
    if ( ! $post ) wp_send_json_error( 'Could not retrieve the requested post' );
    // Add or remove $post's attributes here

    // Send the ajax response
    wp_send_json_success( $post );
}

Don't forget to use a nonce to enhance security.

  • i want to display post data on same page when i select any value from dropdown – cyrus Aug 6 at 13:53
  • You will need to use ajax for managing that. And, you didn't mention that in your question. – Eduardo Escobar Aug 6 at 13:54
  • i did man but sorry if you didn't understand what i mean – cyrus Aug 6 at 13:55
  • i've modified a question i hope now it's understandable – cyrus Aug 6 at 14:07
  • great and thanks – cyrus Aug 6 at 14:14

Not the answer you're looking for? Browse other questions tagged or ask your own question.