Passing a php variable to a modal using AJAX

Question

I'm trying to pass a variable to my modal using AJAX but it's not working.

PHP code

echo '<img src="./images/see.png" class="open-modalPropietari" data-target="#modalPropietari" data-id="' . $id . '" >';

JS code

$(document).on('click', '.open-modalPropietari', function() {
                var id = $(this).data('id');
                $.ajax({
                    type: "POST",
                    url: "propietaris.php",
                    data: {id: id},
                    success: function() {
                        $('#modalPropietari').modal('show');
                    }
                });
            });

it does execute the success (after 6-8 seconds) but it doesn't pass the variable.

I've looked at other posts on this forum but I can't find the solution.

Im pretty new at web development so I've no clue what's wrong.

what is the actual html markup of ` data-id="' . $id . '" >` when you view the source of the page in the console. Is it valid? When you inspect the post request what do you see being sent to the server? — epascarello
– epascarello, Commented Nov 5, 2013 at 15:09
What is the markup of the img tag when the page renders? In what way does this fail? You're not "passing a variable using AJAX" (which is an odd mix of terminology here), you're just rendering a page with a variable, sending that value back to the server, and then showing a modal (which has nothing to do with the variable). When you debug this, where does it fail? — David
– David, Commented Nov 5, 2013 at 15:11
console.log(id) before $.ajax call, and var_dump($_POST) on server side for debug — pszaba
– pszaba, Commented Nov 5, 2013 at 15:13
the var_dump returns "array(0) { } ", and i tried to see the id before the ajax call, and it's showing the variable — gbestard
– gbestard, Commented Nov 5, 2013 at 15:28

Timmetje · Accepted Answer · 2013-11-05 15:47:05Z

1

EDIT: It seems you wrote your question wrong so Ill try helping to debug:

First replace your $.ajax with this

  $.post( "propietaris.php", { id: id })
  .done(function( data ) {
    console.log(data);
  }).fail(function() {
    console.log("error");
  });

And var_dump($_POST); in your propietaris.php

When post is succesfull your console will show the post result page. See if it contains your postdata.

edited Nov 5, 2013 at 15:47

answered Nov 5, 2013 at 15:12

Timmetje

7,70521 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

gbestard Over a year ago

actually it's echo '<img src="./images/see.png" class="open-modalPropietari" data-target="#modalPropietari" data-id="' . $id . '" >';

gbestard Over a year ago

var_dump still "array(0) { } "

Timmetje Over a year ago

nvm: The vardump array must be seen AFTER post, Now you probably see it before POST. So do a var_dump($_POST);. Change console.log("succes") to console.log(data) This will show your return page after post in console.

Timmetje Over a year ago

yeah including your vardump somewhere...what does it say? If it contains your postvar, it worked.

Timmetje Over a year ago

Good ;) So youve succesfully sent the id from php->html from html->php ;)

|

Collectives™ on Stack Overflow

Passing a php variable to a modal using AJAX

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related