[jQuery] Passing Form Data To Thickbox via CakePHP

[jQuery] Passing Form Data To Thickbox via CakePHP


I am attempting to write a preview page for a form using Thickbox as
the preview window. I want to be able to see the data that's
currently in the form without submitting it to the database first. I
need to gather up the field data in a javascript call so that I do not
have to submit the form, and from there I need to pass the data to a
CakePHP page in POST variables. I then have to have the output of all
of this displayed in the Thickbox iframe. I can get pieces of this to
work, but I simply cannot figure out a nice way to make it all work
together.
Here's a sort of rundown of something like what I'm trying to
accomplish:
------------------------------------------------------------------------
<script>
    function showPreview1()
    {
        jQuery.post("/displays/showTempDisplay/",
            { id: jQuery( '#id' ).val(),
                name: jQuery( '#name' ).val(),
                address: jQuery( '#address' ).val(),
                email: jQuery( '#email' ).val(),
            });
    }
    function showPreview2()
    {
        jQuery( '#infoInputForm' ).attr('action', '/displays/
showTempDisplay/');
        jQuery( '#infoInputForm' ).submit();
    }
</script>
<form id="infoInputForm" action="/data_entry/saveInfo/" method="post"
enctype="multipart/form-data">
    <div id="input_info">
        

<label>Name:&nbsp;</label><input name="name" type="text" value="<?
=$data['name']?>"/>


        

<label>Address:&nbsp;</label><input name="address" type="text"
value="<?=$data['address']?"/>


        

<label>Email:&nbsp;</label><input name="email" type="text"
value="<?=$data['email']?>"/>


        <br /><br />
        

<a class="thickbox" href="javascript:showPreview1();">Click here
to view ad</a>


        

<input class="thickbox" type="button" name="previewBtn"
value="Preview Ad" onclick="showPreview2();" />


    </div>
    <input type="hidden" name="id" value="<?=$data['id']?>" />
    <br />
    <input type="button" name="saveIt" value="Continue"
onclick="validateFields();" />
</form>
------------------------------------------------------------------------
Note that showTempDisplay() in displays_controller.php is expecting to
parse $_POST variables with the names of these fields.
Selecting the link that activates showPreview1() will cause the
Thickbox progress bar to appear, but then nothing else happens. Same
thing happens if I have the link activate showPreview2().
Clicking the button to activate showPreview2() will show the desired
form with the current data, but does so in the current browser window
rather than a Thickbox window.
If I have the button activate showPreview1(), a Thickbox window
appears, but with a blank version of the current form page.
I'm honestly stumped at this point. I'm a new to all of these
technologies (Cake, jQuery, Thickbox, etc.), and I just haven't been
able to find any adequate examples or documentation to help me resolve
this issue. Anyone out there who might be able to help? What am I
missing here?
Thanks in advance.