Cannot access Preview button in Report View from button in DIV on same ASPX page

Question

<div id='popup'>       
  <input id='btnConfirm'/>                 
</div>                                    

   $("#btnConfirm").click(function () {                                 


                var frame = $('#[id$=ReportViewer1ParameterArea]'); //get the frame       

                //s57 is a table element in the viewer                            
                frame.contents().find("#Preview")                     
                .click(                  
                    function () {                         
                        alert('hover!');                 
                    }                    
                );                   



            });                       

Below is part of the HTML rendered by Telerik Report Viewer

<iframe id="ctl00_ctl00_MainContent_MainContent_ReportViewer1ParametersArea"               scrolling="auto" width="100%" height="0px" frameborder="0" align="left"               src="/Telerik.ReportViewer.axd?instanceID=0001be3494c046c69b091014203c2914&culture=en-US&uiculture=en-US&optype=Parameters" style="height: 26px;">               
<table id="parametersTable" cellspacing="0" cellpadding="0" border="0" style="width:100%;border-collapse:collapse;">               
<tr id="parametersRow">                 
<td valign="middle" align="center" rowspan="2">              
<input id="Preview" type="submit" onclick="return ParametersPage.Validate();"             value="Preview" name="Preview">              
</td>              
</tr>                

Question :
I need to access the Preview button ID="Preview" in the Report Viewer from a DIV that contains button with ID= btnConfirm on the ASPX page as given above in the JQuery script. The ASPX page contains the Telerik Report Viewer. I put code in the $("#btnConfirm").click(function () event but that does not work. Can you give me ideas please?

Answer 1

Try using this selector:

var frame = $('[id$="ReportViewer1ParameterArea]"');

Removing the # and adding quotes " around the value.

Answer 2

The below code is what I developed to make my code work:

var reportFrame = document.getElementById('ctl00_ctl00_MainContent_MainContent_ReportViewer1ParametersArea');
var reportDocument = reportFrame.contentWindow.document;

var body = reportDocument.getElementsByTagName("body")[0];
$(body).contents().find("#Preview").click();