This is a migrated thread and some comments may be shown as answers.

Input button to open custom Dialog Box

5 Answers 88 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Michele
Top achievements
Rank 2
Michele asked on 16 Oct 2008, 06:45 PM
I have a few buttons that open the dialogs using:

function

 

triggerdialog(dialog){

var editor = $find("<%=RadEditor1.ClientID%>");
editor.fire(dialog);

}


I created a custom .ascx dialog to upload and convert videos. I want to use the same triggerdialog function to open my new dialog window.

However, when I pass in my custom dialog name it give me an error and will not open.

How can this be accomplished?
I looked at showExternalDialog  but it seems that this is used for aspx files. I have an ascx file.

code below:

 

<

 

script type="text/javascript">

 

 

 

 

 

Telerik.Web.UI.Editor.CommandList[

"VideoUpload"] = function(commandName, editor, args)

 

{

args.destid = document.getElementById(

'HiddenFieldDestId').value;

 

args.username = document.getElementById(

'HiddenFieldUserName').value;

 

args.HiddenPageID = document.getElementById(

'HiddenPageID').value;

 

 

editor.get_dialogOpener().set_additionalQueryString(

"&username=" + args.username + "&destid=" + args.destid);

 

 

 

var myCallbackFunction = function(sender, args)

 

{

 

 

var insertvideo = '<object type="application/x-shockwave-flash" data="FlowPlayerWhite.swf"'

 

 

 

 

+

'width="320" height="240">'

 

 

 

 

+

'<param name="allowScriptAccess" value="sameDomain" />'

 

 

 

 

+

'<param name="movie" value="FlowPlayerWhite.swf" />'

 

 

 

 

+

'<param name="quality" value="high" />'

 

 

 

 

+

'<param name="scale" value="Scale" />'

 

 

 

 

+

'<param name="wmode" value="transparent" />'

 

 

 

 

+

'<param name="flashvars" value="config={videoFile: ' + args.video + ' , showMenu: false , loop: false , showLoopButton: false}" />'

 

 

 

 

+

'</object>';

 

 

editor.pasteHtml(insertvideo);

}

 

editor.showDialog(

"VideoUpload", args, myCallbackFunction);

 

};

 

 

 

 

//]]>

 

 

 

 

 

</script>

 

 

 

 

 

 

Serverside_____


 

 

Dim editHTMLDefinition As New DialogDefinition("./VideoUpload.ascx", New DialogParameters())

 

editHTMLDefinition.Modal =

True

 

 

 

editHTMLDefinition.VisibleTitlebar = True

 

 

 

editHTMLDefinition.VisibleStatusbar = True

 

 

 

editHTMLDefinition.Width = Unit.Pixel(570)

 

editHTMLDefinition.Height = Unit.Pixel(380)

editHTMLDefinition.VisibleStatusbar =

False

 

 

 

RadEditor1.AddDialogDefinition("VideoUpload", editHTMLDefinition)

 

 



 

5 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 17 Oct 2008, 01:08 PM
Hi Michele,

The showExternalDialog method allows you to open aspx / html based custom dialogs. If you want to open ascx control as dialogs you should use the showDialog method. You can find guidance how to open ascx dialogs in the following help article Add Custom Dialogs as well as this live example: Custom Dialogs.

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Michele
Top achievements
Rank 2
answered on 17 Oct 2008, 02:36 PM
I looked at the two links several times. However it does not tell me how to open the custom dialogs from an external button.

it opens the dialog box from within the radeditor toolbar.

I need to produce the same effect as the editor.fire(dialog)

Telerik.Web.UI.Editor.CommandList["InsertSpecialLink"] = function(commandName, editor, args) /// how do I convert this to a onclientclick??


 

function test(){

 

 

var args;

 

 

args.destid =

'_destinationId';

 

args.username =

'_UserName';

 

editor.get_dialogOpener().set_additionalQueryString(

"&username=" + args.username + "&destid=" + args.destid);

 

 

 

 

var myCallbackFunction = function(sender, args)

 

{

 

 

var insertvideo = 'test';

 

 

editor.pasteHtml(insertvideo);

}

 

//How do I get editor??????????????

editor.showDialog(

"VideosUpload", args, myCallbackFunction);

 

};


0
Tervel
Telerik team
answered on 17 Oct 2008, 02:48 PM
Hi Michele,

Please open a support ticket and send us your page (or a complete project) with your editor, custom button, and client code.
We need to look at it, then we will rework it to execute properly and send it back to you.

Best regards,
Tervel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Michele
Top achievements
Rank 2
answered on 17 Oct 2008, 02:58 PM
I got the dialog box to open using the following code.
I cant seem to get the args portion working. How do I use the args?
Thank you


 

 

 var args;
   
    function test(){
        
   
    var editor = $find("<%=RadEditor1.ClientID%>"); //get a reference to RadEditor client object
       
     args.destid = '_destinationId';
     args.username  = '_UserName';
   
    
     editor.get_dialogOpener().set_additionalQueryString("&username=" + args.username + "&destid=" + args.destid); 
  
   
    var myCallbackFunction = function(sender, args)
        {
            
        var insertvideo = '<object type="application/x-shockwave-flash" data="FlowPlayerWhite.swf"'
            +'width="320" height="240">'
            +'<param name="allowScriptAccess" value="sameDomain" />'
            +'<param name="movie" value="FlowPlayerWhite.swf" />'
            +'<param name="quality" value="high" />'
            +'<param name="scale" value="Scale" />'
            +'<param name="wmode" value="transparent" />'
            +'<param name="flashvars" value="config={videoFile: ' + args.video + ' , showMenu: false , loop: false , showLoopButton: false}" />'
            +'</object>';
       
            editor.pasteHtml(insertvideo);
        }
       
       editor.showDialog("VideosUpload", args, myCallbackFunction);
    };
   

 

 

0
Accepted
Rumen
Telerik team
answered on 20 Oct 2008, 10:12 AM
Hi Michele,

Please, note that the args variable should be of type object if you would like to assign properties to it, e.g.

var args = {};
...
args.destid = '_destinationId';
args.username  = '_UserName';

...

editor.showDialog("VideosUpload", args, myCallbackFunction);

For your convenience I have attached here a sample working project where the dialog works as expected launched from a external button.


Kind regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Editor
Asked by
Michele
Top achievements
Rank 2
Answers by
Rumen
Telerik team
Michele
Top achievements
Rank 2
Tervel
Telerik team
Share this question
or