Hi everybody. This is my first post on WebDeveloper, so please pardon any coloring outside of the lines.

I'm trying to perform a simple task that has become very complex. I have a php page inside of an iframe that's embedded inside a client side html page. The php page simply uses an jQuery autocomplete to retrieve a list of items from the server. I need to send the selected item from the autocomplete list back to the client side js.

I don't want to put the autocomplete in the client js because I would then have to use JSONP to return values on each keystroke and latency is horrible.

Has anyone done something like this? Please tell me so! I've worked on this for almost a week now (I know, pitiful huh?).

For reference, here's the php page that's included in the iframe inside the client-side html:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>Autocomplete</title>   

        <link href="../../jqSuitePHP/themes/redmond/jquery-ui-1.8.2.custom.css" id="skin" rel="stylesheet" type="text/css" />

        <script src="../../jqSuitePHP/js/jquery-1.6.min.js" type="text/javascript"></script>
        <script src="../../jqSuitePHP/js/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>


        <script>
            $(function ac_boxes() {
                $("#dlr").autocomplete({
                    source: "dlrAutocompleteSearch.php",
                    minLength: 2,
                    search   : function(){$(this).addClass('ui-autocomplete-loading');},
                    open     : function(){$(this).removeClass('ui-autocomplete-loading');},
                    select: function( event, ui ) {
                              
                       //This is where I need to somehow send back the result to client js or create and action that would be recognized by client....

                    }
                });
            });
        </script>

        <style>
            .dlrDashForm {
                margin: 20px 20px 0 20px;
                border: #ccc solid 1px;
                padding: 20px 20px 50px 20px;
                overflow: hidden;
            }

            .dlrDashSubLabel {
                color:#888;
                font-family: Arial;
                font-style: italic;
                font-size: 10px;
            }

        </style>

    </head>
    <body>
        <div class="dlrDashForm">
            <div class="ui-widget">
                <label for="dlr">Dealer:</label></br>
                <input id="dlr" style="width:70%"/>
            </div>
            <label for="dlr" class="dlrDashSubLabel">
                Lookup by dealer name, dealer number, rep name, or auction access number. 
            </label>
        </div>
    </body>
</html>