I've been trying to figure out a solution to this for ages, but getting no where. I'd like to have a form on the page which when submitted opens a lightbox and echos that form data. I've tried the below, but it doesn't seem to work. Does anyone know a solution to this? Doesn't have to be the facebox lightbox, can be any lightbox script.

Thanks very much for your response. I missed that, so I change the code to <?php echo $_GET["q"]; ?>. Though it still doesn't seem to have sorted the issue. It still doesn't echo the value in the iframe in the lightbox.

Any ideas what else I could try? Alternate solutions? Really struggling to resolve this one!

Paul_Wilkins
—
2013-03-22T20:44:19Z —
#4

boognish said:

I change the code to <?php echo $_GET["q"]; ?>

The method that the form is using is post, so PHP will have to use $POST - not $GET

boognish
—
2013-03-23T01:32:29Z —
#5

paul_wilkins said:

The method that the form is using is post, so PHP will have to use $POST - not $GET

Good spot, don't know how I ended up changing it to a GET, I changed it to <?php echo $_POST["q"]; ?>. That's two silly mistakes now!

Though the value still isn't showing up in the lightbox. I'm pretty sure my current code is not the correct way to achieve what I want. Any ideas on a solution?

Thanks!

Paul_Wilkins
—
2013-03-23T02:47:31Z —
#6

boognish said:

I'm pretty sure my current code is not the correct way to achieve what I want. Any ideas on a solution?

Well the way to submit form data to a server-side script without having the page reload, is via ajax - which with jQuery is done by replacing the form submit event with an ajax request instead.

Have to admit, not really sure what I'm doing with this. Can you tell me where I'm going wrong?

Paul_Wilkins
—
2013-03-25T11:35:48Z —
#8

Well for a start, you're updating the lightbox at the wrong place. You need to perform the update after the request to the var.php has returned its contents, which is from the request.done method. See that updateLightbox function? Place the code to update the lightbox inside of that function. That is where the content from the var.php file will be sent.

That works well, in that it sends the data to the php file, which is a good safety measure for when scripting is not available (some turn it off for security, other businesses deliberately disable it, etc...)

Now to put the scripting in there. Place the scripting at the end of the body, just before the </body> tag. That ensures that the scripting doesn't slow the loading of the page, and also allows the scripting to easily interact with the contents of the page before it finishes loading.

In this case, you're using jquery and facebox, so place the CSS link for facebox in the head, and the scripting libraries for jQuery and facebox at the end of the body. And, a script for what we're going to write next too.

Oh yes, there's just one more change that I would make to the above (my) code, and it's a formatting change.

$.post(form.action, serializedData)
.done(func);

JavaScript handles the above code as one statement, but it's not all that clear to the person viewing it, if it's supposed to be one statement or two.

The above code works the same as if it were in one line:

$.post(form.action, serializedData).done(func);

But with jQuery, it's better to separate those different aspects of things if they aren't tightly related, or may grow to handle different situations.So, indenting the .done part helps to express that the .done part is connected with the part above it, and makes it easy to add other things that the .post may need to handle too.