Hi,
I am trying to get a click event on my sortable panels and I am not having the best of luck. Basically I have 3 columns (i.e. #main-content1) that can have 1 - 4 panels in each column and I need to go to a specific page based on what panel is clicked.
I am using the following:
@(Html.Kendo().Sortable()
.For("#main-content1")
.ConnectWith("#main-content2,#main-content3")
.Cursor("move")
.PlaceholderHandler("placeholder")
.HintHandler("hint")
)
@(Html.Kendo().Sortable()
.For("#main-content2")
.ConnectWith("#main-content1,#main-content3")
.Cursor("move")
.PlaceholderHandler("placeholder")
.HintHandler("hint")
)
@(Html.Kendo().Sortable()
.For("#main-content3")
.ConnectWith("#main-content1, #main-content2")
.Cursor("move")
.PlaceholderHandler("placeholder")
.HintHandler("hint")
)
This is what I am using to render the tiles:
@helper renderTiles(IPublishedContent Section)
{
var title = Section.GetPropertyValue<string>("Title", String.Empty);
var link = Section.GetPropertyValue<string>("link", String.Empty);
var id = Section.GetPropertyValue("Icon", -1);
<div id = "blogs" class="widget">
<h3>@title<span class="collapse k-icon k-i-arrowhead-n"></span></h3>
<div class="widget-image">
@if(ImageId != -1)
{
<img src="@Umbraco.TypedMedia(id).Url" alt="=@Umbraco.TypedMedia(id).Name"/>
}
</div>
</div>
}
I have tried the following:
$(document).ready(function ()
{
$("#blogs").on("click", function (e)
{
alert("Hello");
});
}
But I only get an alert on the first panel in the first column.
Any ideas/pointers would be appreciated.
Thanks