3 Answers, 1 is accepted
0
Hi Zaw,
RadEditor is an WYSIWYG editor for editing HTML / XHTML content. The requested feature is not part of the advertised editor's functionality but you can use the following code as a base and implement the requested functionality yourself.
The purpose of the code below is to attach an onclick event to all images in the content on submit. After that when the user clicks on an image, the onclick event will be fired and will open a window.open dialog displaying the clicked image:
<script type="text/javascript">
function OnClientLoad(editor, args)
{
editor.add_submit(function ()
{
var images = editor.get_document().getElementsByTagName("IMG"); //get all image elements in the content area
var href = null;
for (i=0; i< images.length; i++)
{
var img = images[i];
href = img.src; //get the href values of the images
var opener = 'window.open("' + href + '", null, "height=500,width=500,status=no,toolbar=no,menubar=no,location=no");return false;';
img.setAttribute("onclick", opener);
}
});
}
</script>
<telerik:radeditor runat="server" ID="RadEditor1"
OnClientLoad="OnClientLoad" >
<ImageManager ViewPaths="~/Images" UploadPaths="~/Images" />
<Content>
<IMG alt="" src="/editorQ2SP12008/Images/Deisy.jpg"><IMG alt="" src="/editorQ2SP12008/Images/pets.jpg">
</Content>
</telerik:radeditor>
<input type="submit" value="submit" />
Best regards,
Rumen
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
RadEditor is an WYSIWYG editor for editing HTML / XHTML content. The requested feature is not part of the advertised editor's functionality but you can use the following code as a base and implement the requested functionality yourself.
The purpose of the code below is to attach an onclick event to all images in the content on submit. After that when the user clicks on an image, the onclick event will be fired and will open a window.open dialog displaying the clicked image:
<script type="text/javascript">
function OnClientLoad(editor, args)
{
editor.add_submit(function ()
{
var images = editor.get_document().getElementsByTagName("IMG"); //get all image elements in the content area
var href = null;
for (i=0; i< images.length; i++)
{
var img = images[i];
href = img.src; //get the href values of the images
var opener = 'window.open("' + href + '", null, "height=500,width=500,status=no,toolbar=no,menubar=no,location=no");return false;';
img.setAttribute("onclick", opener);
}
});
}
</script>
<telerik:radeditor runat="server" ID="RadEditor1"
OnClientLoad="OnClientLoad" >
<ImageManager ViewPaths="~/Images" UploadPaths="~/Images" />
<Content>
<IMG alt="" src="/editorQ2SP12008/Images/Deisy.jpg"><IMG alt="" src="/editorQ2SP12008/Images/pets.jpg">
</Content>
</telerik:radeditor>
<input type="submit" value="submit" />
Best regards,
Rumen
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0

kyaw
Top achievements
Rank 1
answered on 18 Nov 2008, 09:40 AM
Hi Rumen,
Sorry for my incomplete information about the senario.
What i mean is, i want to call a lightbox dialog when a specific toolbar button from editor is clicked. For now, i can call RadWindow. But i want to call lightbox dialog. Is it possible??
Thanks in advance,
Zaw
Sorry for my incomplete information about the senario.
What i mean is, i want to call a lightbox dialog when a specific toolbar button from editor is clicked. For now, i can call RadWindow. But i want to call lightbox dialog. Is it possible??
Thanks in advance,
Zaw
0
Hi kyaw,
You may call a LightBox dialog by adding a custom command button to RadEditor and by using the API of LightBox. We cannot provide you with exact example with a light box, as we do not support LB scripts, but you may look at the following help topic, which describes how to add custom commands to RadEditor - http://www.telerik.com/help/aspnet-ajax/addingyourownbuttons.html.
Greetings,
Martin Ivanov
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
You may call a LightBox dialog by adding a custom command button to RadEditor and by using the API of LightBox. We cannot provide you with exact example with a light box, as we do not support LB scripts, but you may look at the following help topic, which describes how to add custom commands to RadEditor - http://www.telerik.com/help/aspnet-ajax/addingyourownbuttons.html.
Greetings,
Martin Ivanov
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.