Add target="_Blank" to NavigateURL

[Michel]

Hello,

I have the RadImageGallery implemented using the following:

<telerik:RadImageGallery ID="ImageGallery" RenderMode="Auto" runat="server" LoopItems="true" ShowLoadingPanel="true" AllowPaging="false" DisplayAreaMode="Image" OnNeedDataSource="ImageGallery_NeedDataSource" DataTitleField="ImageTitle" DataDescriptionField="ImageDescription" DataImageField="ImageURL"></telerik:RadImageGallery>

         

the Code behind is like this:

Protected Sub ImageGallery_ItemDataBound(sender As Object, e As ImageGalleryItemEventArgs) Handles ImageGallery.ItemDataBound         Dim item As ImageGalleryItem = TryCast(e.Item, ImageGalleryItem)
  Dim db As New DBCorrDefense.DBDCDataContext()
  For Each item In ImageGallery.Items
    Dim EmData = db.CDSP_Get_URLByImageTitle(item.Title).FirstOrDefault
    If EmData Is Nothing Then
    Else
      item.NavigateUrl = EmData.URL
    End If
  Next
     db.Dispose()
     db = Nothing
End Sub

Protected Sub ImageGallery_NeedDataSource(sender As Object, e As Telerik.Web.UI.ImageGalleryNeedDataSourceEventArgs) Handles ImageGallery.NeedDataSource
 Dim db As New DBCorrDefense.DBDCDataContext()
ImageGallery.DataSource = db.CDSP_Get_AllSlides()
 End Sub

 

How is it possible to allow the NavigateURL to open in a new blank page when i click on the ImageItem? currently it is opening in the same page

Thanks

[Viktor Tachev]

Hello Mike,

I am afraid that the behavior you describe is not available out of the box.

By default when you define a NavigateUrl property for an item the window.location property is changed when the user clicks on the ImageArea. If you would like to change the behavior you would need to use custom logic.

You can override the mousedown event for the ImageArea. You can prevent the default logic and open the url manually in a new tab.

Regards,
Viktor Tachev
Telerik by Progress

[Michel]

Hi Viktor,

Please, How can i do so if i don't have the get_navigateurl function?

 

Thanks

[Viktor Tachev]

Hello Mike,

Note that the behavior is not supported by RadImageGallery our of the box. Thus, you would need to use custom logic to implement it.

One approach is to handle the mousedown event for the ImageArea element. Then, you can cancel the default event and implement your custom logic matching the specific requirements.


Regards,
Viktor Tachev
Telerik by Progress

[Michel]

I am not sure we are on the same page Viktor.

How can i add or append target="_blank" to a imageitem from code-behind?

 

Thanks

[Viktor Tachev]

Hi Mike,

In order to implement the behavior you would need to use custom client-side logic. Please examine the thread linked below that describes how you can implement similar behavior.

• http://www.telerik.com/forums/imagegalleryitem-navigateurl#E4AjevGTDkaT-G53PrP7Nw

Regards,
Viktor Tachev
Telerik by Progress

[Michel]

Dear Viktor,

All the ImageGallery is coming from the Database through dynamic code (even the target)

the example you provided is only on client side.

How to implement the same logic from code behind?

Thanks

[Viktor Tachev]

Hello Mike,

You would need to use client-side logic in order to implement the behavior.

Alternatively , you can construct the complete RadImageGallery dynamically and use templates. In each template you should add the corresponding image with the link manually.

Check out the following resources that describe the templates in RadImageGallery in more detail:

• http://demos.telerik.com/aspnet-ajax/image-gallery/examples/functionality/templates/defaultcs.aspx
• http://docs.telerik.com/devtools/aspnet-ajax/controls/imagegallery/functionality/templates

Regards,
Viktor Tachev
Telerik by Progress

[Michel]

Dear Viktor, please can you advise on this issue. It is not working not image is being displayed and i cannot get to add HTML content. below is my code

Thanks for your help

ascx:

<telerik:RadImageGallery ID="PresentationView_RadImageGallery" RenderMode="Auto" runat="server" LoopItems="true" ShowLoadingPanel="False" AllowPaging="false" DisplayAreaMode="Image" >
<ImageAreaSettings Height="350px" ResizeMode="Fill" /><ToolbarSettings Position="None" />
<ClientSettings AllowKeyboardNavigation="true"><AnimationSettings SlideshowSlideDuration="3000">
<NextImagesAnimation Type="CollapsingHorizontalStripes" Easing="Random" Speed="2500" /><PrevImagesAnimation Type="CollapsingVerticalStripes" Easing="Random" Speed="2500" /></AnimationSettings><br>                </ClientSettings></telerik:RadImageGallery>

 

code behind:

 

1.

Private Class ImageGalleryContentTemplate
    Public Property BackgroundImage() As [String]
        Get
            Return m_BackgroundImage
        End Get
        Set
            m_BackgroundImage = Value
        End Set
    End Property
    Private m_BackgroundImage As [String]
    Public Property HTMLTemplate() As [String]
        Get
            Return m_HTMLTemplate
        End Get
        Set
            m_HTMLTemplate = Value
        End Set
    End Property
    Private m_HTMLTemplate As [String]

    Public Sub InstantiateIn(container As Control)
        container.Controls.Add(New RadMediaPlayer())
    End Sub
End Class

Protected Sub Page_Init(sender As Object, e As EventArgs)
    Dim igItem As New ImageGalleryItem()
    igItem.ImageUrl = "/static/media/carousel/Dan_Zarate_Banner.png"
    PresentationView_RadImageGallery.Items.Add(igItem)

    Dim igti As New ImageGalleryTemplateItem()
    Dim template As New ImageGalleryContentTemplate()
    igti.ContentTemplate = template
    PresentationView_RadImageGallery.Items.Add(igti)
End Sub

[Eyup]

Hi Mike,

For adding link elements in the description of the image gallery control you can check:
http://www.telerik.com/forums/description-box-00238fb8e723#yzWfE6Tyf0ifW3cTTp7Lgw

Additional samples which you may deem helpful you can find here:
http://www.telerik.com/support/code-library/aspnet-ajax/image-gallery

In addition, RadImageGallery is very similar to RadMediaPlayer control when creating programmatically:
http://demos.telerik.com/aspnet-ajax/media-player/examples/applicationscenarios/video-gallery/defaultcs.aspx
http://www.telerik.com/support/code-library/programmatic-creation-and-configuration-of-the-media-player-control

I hope this will prove helpful.

Regards,
Eyup
Telerik by Progress

[Michel]

Dear Eyup,

Thanks for your reply. the issue is that i want to add custom code based on Query results (i.e. target="_Blank",or target="_Parent" to the NavigateURL Field).

I am not sure why the code is not working with me.

I appreciate your help

Thanks

Mike

[Viktor Tachev]

Hello Mike,

Please note that the behavior is not supported out of the box. Thus, implementing it would require custom solution that falls outside the scope of our standard support services.

If you would like to request the functionality to be added as a built-in feature please submit a request in the feedback portal.

• https://feedback.telerik.com/Project/108/Feedback/List/Feature%20Request

In case you would like to have a custom function implemented for you I would recommend contacting our professional services team.



Regards,
Viktor Tachev
Telerik by Progress