Question

I am trying to integrate new functionality using jQuery UI’s dialog.

I have a page with a link. When a link is clicked a modal dialog with a form in it opens. That part works OK.

$("#myForm").hide();
$("#myLink").click(function(){
    $("#myForm").dialog({
        modal: true,
        draggable: false,
        resizable: false,
        width: 450,
        buttons: {
            "Submit": function() {
                // ???
            },
            "Cancel": function() {
                $(this).dialog("close");
            }
        }
    });
});

<a href="#" id="myLink">Open Dialog</a>

<div id="myForm">
    <form>
      <textarea id="myValues" rows="10"></textarea>
    </form>
</div>

Now, I need to submit the form from within my dialog and POST results to the same page. I am getting all confused with how to implement the rest. I did look at the jQuery .post() example which made me even more confused. The page is in PHP, so when the results are submitted I need to get the post value and do some server-site action.

if (isset($_POST["myValues"])) {
   // do something
}

Stuck, need help.

Answer 1

In jQuery function for “Submit” button:

$('form#myFormId').submit();

And in HTML:

<form id="myFormId" method="POST" action="processingscript.php">

Then the php script will get all the values that have been POSTed and can process them.