Welcome Guest Search | Active Topics | Sign In | Register

Dialog Box Formatting Questions Options
Darrell Reinke
Posted: Tuesday, May 8, 2012 5:04:39 PM
Rank: Advanced Member
Groups: Member

Joined: 7/18/2008
Posts: 76
Good Afternoon,

I am hoping this is an easy question to answer. I have the following dialog box below that dynamically displays .ASPX pages. All is working fine, however, when the dialog box displays the scrollbar within the content panl on the dialog page always appears even though their is plenty of room within the dialog box to display the rendered content. I understand that when you use dialog.setContentUrl(sLink) you display that aspx page inside an IFRAME. There is an attribute you can set on an IFRAME called scrolling=no to not have the scroll bars appear. How would you accomplish that within your dialog object? I tried setting it in the <ContentFameStyle /> csstext, but that didn't work (I really didn't expect it to anyway).

One last question: Is is possible to dynamically change the content in the footer template through Javascript? (I don't think so, but I thought is was worth asking)

Thank you for you assistance.

Code: HTML/ASPX
<eo:Dialog ID="dlgLookup" runat="server" BorderColor="#335C88" BorderStyle="Solid" BorderWidth="1px" CloseButtonUrl="00070101" ControlSkinID="None" HeaderHtml="" MinimizeButtonUrl="00070102" ResizeImageUrl="00020014" RestoreButtonUrl="00070103" ShadowColor="Gray"
      ShadowDepth="8" AnchorElementID="aDlg" Height="465px" Width="730px" OffsetX="1" OffsetY="-10" EnableKeyboardNavigation="True" CancelButton="btnCostingFinished" ContentUrl="pcnDlgFutureLookup.aspx">
      <HeaderStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 11px; background-image: url(00070104); padding-bottom: 3px; padding-top: 3px; font-family: tahoma" />
      <ContentStyleActive CssText="border-top: #335c88 1px solid; background-color: white" />
      <ContentFrameStyle CssText="scrolling=no" />
      <ContentTemplate>
      </ContentTemplate>
      <FooterTemplate>
         <table border="0" cellpadding="0" cellspacing="0">
            <tr>
               <td align="center" style="width: 570px; padding-top: 3px;">
                  <table border="0" cellpadding="0" cellspacing="0">
                     <tr>
                        <td>
                        </td>
                        <td style="font-family: Tahoma; font-size: 8pt">
                           You can either double click on the team member or Press <font color="blue">Select Team Member</font> button to return the value.
                        </td>
                     </tr>
                  </table>
               </td>
            </tr>
         </table>
      </FooterTemplate>
      <FooterStyleActive CssText="background-color: #e5f1fd; padding-bottom: 8px;" />
   </eo:Dialog>


Code: JavaScript
function searchOptions(asType) {

         var sLink = "";
         var sCaption = "";
         var dlgLookup = eo_GetObject("&lt;%=dlgLookup.ClientID %&gt;");

         try {
         
            switch (asType) {
               case "TEAM_MEMBER":
                  sLink = "pcnDlgFormLookup.aspx";
                  sCaption = "&lt;table width=85% cellspacing=0 cellpadding=0&gt;&lt;tr&gt;&lt;td align=center&gt;&lt;font style='font-family:tahoma; font-weight:bold; font-size: 9pt; color:white;'&gt;Find Team Member&lt;/font&gt;&lt;/td&gt;&lt;tr&gt;&lt;table&gt;";
                  dlgLookup.resize(730,470);
                  break;

               case "future_dept": case "future_rpt":case "future_wrk":

                  //Determine the Type of Department to default within Lookup Window
                  var sLimitBy = "NORMAL";
                  var sDeptType = "CORPORATE";
                  var rblJobTitleTypes = document.getElementsByName("&lt;%=rblJobTitleTypes.ClientID %&gt;");

                  if (rblJobTitleTypes[1].checked) {
                     sDeptType = "CORPORATE";
                     if (asType == "future_rpt") {
                        sLimitBy = "CITY_OFFICE";
                     }
                  } //End if (rblJobTitleTypes[1].checked) {

                  if (rblJobTitleTypes[2].checked) {
                     if (asType == "future_rpt") {
                        //This location is always the city office location
                        sDeptType = "CORPORATE";
                        sLimitBy = "CITY_OFFICE";
                     }
                     else {
                        sDeptType = "PROPERTY";
                     } //if (asType == "future_rpt") {
                  } //End if (rblJobTitleTypes[2].checked) {

                  //alert(asType + " " + sDeptType);

                  switch (asType) {
                     case "future_dept":
                        sCaption = "&lt;table width=85% cellspacing=0 cellpadding=0&gt;&lt;tr&gt;&lt;td align=center&gt;&lt;font style='font-family:tahoma; font-weight:bold; font-size: 9pt; color:white;'&gt;Find a Future Department&lt;/font&gt;&lt;/td&gt;&lt;tr&gt;&lt;table&gt;";
                        break;
                     case "future_rpt":
                        sCaption = "&lt;table width=85% cellspacing=0 cellpadding=0&gt;&lt;tr&gt;&lt;td align=center&gt;&lt;font style='font-family:tahoma; font-weight:bold; font-size: 9pt; color:white;'&gt;Find a Future Reporting Location&lt;/font&gt;&lt;/td&gt;&lt;tr&gt;&lt;table&gt;";
                        break;
                     case "future_wrk":
                        sCaption = "&lt;table width=85% cellspacing=0 cellpadding=0&gt;&lt;tr&gt;&lt;td align=center&gt;&lt;font style='font-family:tahoma; font-weight:bold; font-size: 9pt; color:white;'&gt;Find a Future Work Location&lt;/font&gt;&lt;/td&gt;&lt;tr&gt;&lt;table&gt;";
                        break;
                  }

                  dlgLookup.resize(610, 500);
                  var sLink = "pcnDlgFutureLookup.aspx?searchType=" + asType + "&access_level=none&deptType=" + sDeptType + "&limitby=" + sLimitBy;

                 break;
            }
            
            dlgLookup.setContentUrl(sLink);
            dlgLookup.show(true, sCaption);
         }
         catch (errorObject) {
            msg = "There was an error on this page.\n\n"
            msg += "An internal programming error may keep\n"
            msg += "this page from displaying properly.\n"
            msg += "Click OK to continue viewing this page.\n\n"
            msg += "Description: " + errorObject.description + "\n\n"
            alert(msg);
            return false;
         } //End catch(errorObject) {

      } //End function searchOptions(asType) {   
eo_support
Posted: Wednesday, May 9, 2012 8:57:51 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,195
Hi,

You won't be able to turn off iframe scrollbar via CSS. You can use JavaScript to get that iframe (check the rendered HTML source to find the iframe id) and set whatever property you wish to set on the iframe.

Is is possible to dynamically change the content in the footer template through Javascript. You just do it the same way you do it anywhere else ---- get the DOM object and use the DOM object to do whatever you want to do. It has nothing to do with the dialog here.

Thanks!
Darrell Reinke
Posted: Wednesday, May 9, 2012 8:59:36 AM
Rank: Advanced Member
Groups: Member

Joined: 7/18/2008
Posts: 76
Thank you for the information. Should have thought of that myself.... :)
Darrell Reinke
Posted: Wednesday, May 9, 2012 9:37:31 AM
Rank: Advanced Member
Groups: Member

Joined: 7/18/2008
Posts: 76
Found what was causing the scroll bar to appear in the dialog box. I had the height:100%; set in my CSS style sheet in the body{} section. Took it out and the scroll bar disappeared.



You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.