logo
Ask your WordPress questions! Pay money and get answers fast! (more info)

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.

$25
Wordpress Bootstrap Modal

Currently using the bootstrap.js to produce some modals but having some difficulty.

I want to load a post into the modal window when clicked.

I've got the following code so far:

JS:
<script type="text/javascript">

    $(function() {

      $('[data-toggle="modal"]').click(function(e) {

        e.preventDefault();

        var href = $(this).attr('href');

        if (href.indexOf('#') == 0) {

          $(href).modal('open');

        } else {

        $.get(href, function(data) {

          $('<div class="modal">' + data + '</div>').modal();

        });

        }

      });

    });

</script>


Link which loads the modal:
<a href="<?php bloginfo('template_url');?>/modal.php?ID=<?php the_ID(); ?>" data-toggle="modal">Modal</a>


And modal.php:



<div class="modal-header">

	<a class="close" data-dismiss="modal">&times;</a>

	<h3>Modal header 2</h3>

</div>

<div class="modal-body">



<?php

$post_id = $_GET['ID'];

$queried_post = get_post($post_id);

$title = $queried_post->post_title;

echo $title;

echo $queried_post->post_content;

?>

</div>

<div class="modal-footer">

	<a class="btn" data-dismiss="modal">Close</a>

</div>


When the Link is clicked the modal opens and the following error appears.

Fatal error: Call to undefined function

How do I get around this and load the content from the specified post?

This question has been answered.

floy | 01/23/13 at 11:15am Edit
Tutorial: How to assign prize money


(8) Responses

See a threaded view of answers?

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

  • avatar
    Last edited:
    01/23/13
    11:20am
    John Cotton says:

    You shouldn't do an ajax call to WordPress like that.

    For a start, (although I can't see what other code you have) you're probably not loading WordPress it's self and it's probably get_post that's causing the error.

    There's a really good explanation of how ajax works with WordPress here:

    http://codex.wordpress.org/AJAX

    Have a read and then ask any questions you have as a follow-up

    JC

    PS Big Clue: you need to hook in to the wp_ajax_...hook and return your HTML through that. See the code on this page:

    http://codex.wordpress.org/AJAX_in_Plugins

  • avatar
    Last edited:
    01/23/13
    11:25am
    Arnav Joy says:

    try adding following lines at top of modal.php

    if (!function_exists('get_option'))
    require_once('../../../wp-config.php');

    correct path if it is not correct..

  • avatar
    Last edited:
    01/23/13
    11:46am
    Sébastien | French WordpressDesigner says:

    what is that ? :

     $post_id = $_GET['ID'];


    if you want to use the ID of the current post you must use $post->ID

    edit :
    there is no get_variable "ID"... you have a get_variable "ID" ?
    Have you test this $_GET['ID'] ?
    This code return everything ?

    if you want to return the ID of the current post you must to use $post->ID or the function get_the_ID()

    Previous versions of this answer: 01/23/13 at 11:45am | 01/23/13 at 11:46am

  • avatar
    Last edited:
    01/23/13
    11:27am
    floy says:

    Thanks Arnav! That worked!

  • avatar
    Last edited:
    01/23/13
    11:33am
    floy says:

    Passing the ID of the post to be pulled into the modal window between the page and modal.php....

  • avatar
    Last edited:
    01/23/13
    11:34am
    John Cotton says:

    Client side


    

    
<script type="text/javascript">
    

    
    $(function() {
    

    
      $('[data-toggle="modal"]').click(function(e) {
    

    
        e.preventDefault();
    

    
        var href = $(this).attr('href');
    

    
        if (href.indexOf('#') == 0) {
    

    
          $(href).modal('open');
    

    
        } else {
    
data.action = 'my_modal_box';
    
data.ID =$(this).data('ID');
    

    
        $.get(href, data, function(response) {
    

    
          $('<div class="modal">' + response+ '</div>').modal();
    

    
        });
    

    
        }
    

    
      });
    

    
    });
    

    
</script>


    Server side
    <a href="<?php admin_url( 'admin-ajax.php' ) ;?>" data-ID=<?php the_ID(); ?>" data-toggle="modal">Modal</a>






    

    
function my_modal_box() {
    

    

    

    
}



    add_action('wp_ajax_my_modal_box', 'my_modal_box');
    add_action('wp_ajax_nopriv_my_modal_box', 'my_modal_box');

  • avatar
    Last edited:
    01/23/13
    11:47am
    floy says:

    It works with Arnavs solution.

    Your not understanding the question.

  • avatar
    Last edited:
    01/23/13
    11:52am
    floy says:

    Is there anyway to get it to output the post data using the following?


    
<?php
    
query_posts('p=SOMEPOSTIDHERE');
    
while (have_posts()): the_post();
    
   the_title();
    
   the_content();
    
endwhile;
    
?>


    Returns nothing.

This question has expired.



Arnav Joy had additional discourse to offer.

Gabriel Reguly, Francisco Javier Carazo Gil, floy voted on this question.



Current status of this question: Completed



Please log in to add additional discourse to this page.





Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.