Input button to open custom Dialog Box

[Michele]

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)

 

 

 

[Rumen]

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.

[Michele]

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);

 

};

[Tervel]

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.

[Michele]

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);
    };
   

 

 

[Rumen]

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.