Support forums » Products » Cute Editor for ASP » Custom Dialog Box

Custom Dialog Box

  •  10-19-2007, 4:01 PM

    Custom Dialog Box

    Reply Quote
    Using: CuteEditor for ASP 6
     
    Goal:
    1. Create a Custom Button on the Toolbar,
    2. Custom Button will open a Custom Dialog Box,
    3. Custom Dialog Box will list all pre-built webpages for linking,
    4. Selected link will be returned to the calling editor formatted as a <a href=...,
    5. If text was selected in the calling editor prior to pressing the Custom Button, it will remain as the text between the <a> and the </a>,
    6. If an image was selected in the calling editor prior to pressing the Custom Button, it will remain as the image between the <a> and the </a>,
    7. If nothing was selected in the calling editor prior to pressing the Custom Button, the selected webpage link's name (supplied via a db qry) will be returned between the <a> and the </a>.
    So far I have created the
     
      Custom Button: editor.CustomAddons = "<img title=""Add a Standalone Page Link"" style=""margin-left: 10px; class=""CuteEditorButton"" onmouseover=""CuteEditor_ButtonCommandOver(this)"" onmouseout=""CuteEditor_ButtonCommandOut(this)"" onmousedown=""CuteEditor_ButtonCommandDown(this)"" onmouseup=""CuteEditor_ButtonCommandUp(this)"" ondragstart=""CuteEditor_CancelEvent()"" onclick=""ShowMyDialog(this)"" src=""/modules/images/standalone_page_link.gif"" />"
     
       Code for opening the Custom Dialog Box:
    <script type="text/javascript">  
         function ShowMyDialog(button) {
          var editor = CuteEditor_GetEditor(button);
          var newwin=editor.ShowDialog(null,"/modules/manage/addStandalonePageLink.asp?dpt=<%=Request.QueryString("dpt")%>&_rand="+new Date().getTime(),editor,"dialogWidth:292px;dialogHeight:140px");
         }
        </script>
     
       Custom Dialog Box:
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title>Standalone Pages</title>
      <meta http-equiv="Page-Enter" content="blendTrans(Duration=0.1)" />
      <meta http-equiv="Page-Exit" content="blendTrans(Duration=0.1)" />
      <link href="http://cutesoft.net/modules/CuteEditor_files/style/dialog.css" type="text/css" rel="stylesheet" />
      <!--[if IE]>
       <link href="http://cutesoft.net/modules/CuteEditor_Files/style/IE.css" type="text/css" rel="stylesheet" />
      <![endif]-->
      <script type="text/javascript" src="http://cutesoft.net/modules/CuteEditor_Files/Scripts/Dialog/DialogHead.js"></script>
      <script language="javascript" type="text/javascript">
       function button_click() {
        var editor = Window_GetDialogArguments(window);
        var selectedPage = document.getElementById('allPages');
        var selectedText = editor.GetSelection().createRange();
        editor.PasteHTML('<a href="http://cutesoft.net/websites/index.asp?dpt=<%=Request.QueryString("dpt")%>&pageID='+selectedPage.options[selectedPage.selectedIndex].value+'">'+selectedText+'</a>'); //selectedPage.options[selectedPage.selectedIndex].text
        window.close();
       }
       
       function Window_GetDialogArguments(win) {
        var top = win.top;
        var opener = top.opener;
        
        if(top.dialogArguments) {
         return top.dialogArguments;
        }
        
        if(opener == null) {
         return top.document._dialog_arguments;
        }
        
        return opener.document._dialog_arguments;
       }
      </script>
      <style type="text/css">
       .btn {
        border: 1px solid buttonface;
        padding: 1px;
        cursor: default;
        width:14px;
        height: 12px;
        vertical-align: middle;
       }
       select,input,td {
        font-family: MS Sans Serif;
        font-size: 9pt;
        vertical-align: top;
        cursor: hand;
       }
      </style>
     </head>
     <body style="margin:0px;border-width:0px;padding:4px;">
      <form name="frmStandalonePageLinks" id="frmStandalonePageLinks" method="post" action="" onSubmit="">
       <div>
        <fieldset style="padding: 2px;">
         <legend>Insert Standalone Page Link</legend>
          <select size="3" name="allPages" id="allPages" style="width: 255; margin: 10px;">
           <%=strPageLinks%>
          </select>
        </fieldset>
       </div>
       <div style="margin: 10px 7px 0 0; width: 100%; text-align: right;">
        <input class="inputbuttoninsert" type="button" value=" Insert " style="width: 80px;" onClick="button_click();" />&nbsp;&nbsp;
        <input class="inputbuttoncancel" type="button" value=" Cancel " style="width: 80px;" onClick="window.close();" />
       </div>
      </form>
     </body>
     <script type="text/javascript" src="http://cutesoft.net/modules/CuteEditor_Files/Scripts/Dialog/DialogFoot.js"></script>
    </html>
     
       Returned Link: I have it to the point of returning the page link with the db qry name between the <a> and the </a>.
     
    My question then, is how do I grab the selected text from within the Custom Dialog Box?
    After reading several posts, I've tried:
       var selectedText = editor.GetSelection();
       and
       var selectedText = editor.GetSelection().createRange();
       The returned value is [object]
     
    Thoughts?
    Work Hard! Play Harder!!
View Complete Thread