This article provides only sample code that demonstrates invoking and handling commands with GenericCollectionBinder. For detailed explanation please consult Invoking and handling binder item commands article.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Stores.aspx.cs" Inherits="Stores" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="sitefinity" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %>
<head runat="server">
<title>Stores with Generic Collection client binder</title>
</head>
<form id="form1" runat="server">
<asp:ScriptManager ID="scriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Name="MicrosoftAjax.js" Path="~/Sitefinity/Scripts/MicrosoftAjax.js" />
<asp:ScriptReference ScriptMode="Inherit" Path="~/Sitefinity/Scripts/MicrosoftAjaxTemplates.js" />
<asp:ScriptReference ScriptMode="Inherit" Path="~/Sitefinity/Scripts/MicrosoftAjaxAdoNet.js" />
</Scripts>
</asp:ScriptManager>
<ul id="storesList" runat="server">
</ul>
<sitefinity:GenericCollectionBinder id="storesBinder" runat="server"
TargetId="storesList"
ServiceUrl="~/Sitefinity/Services/Commerce/Stores.svc"
BindOnLoad="true"
OnClientItemEditCommand="OnEditCommand"
OnClientItemDeleteCommand="OnDeleteCommand"
OnClientItemSelectCommand="OnSelectCommand"
DataKeyNames="Id"
DataMembers="Name, Id">
<Containers>
<sitefinity:BinderContainer ID="BinderContainer1" runat="server" RenderContainer="false" TemplateHolderTag="UL">
<li>
<a sys:href="javascript:void(0);" class="selectCommand">{{Name}}</a>
<input type="button" value="Edit" class="editCommand" />
<input type="button" value="Delete" class="deleteCommand" />
</li>
</sitefinity:BinderContainer>
</Containers>
</sitefinity:GenericCollectionBinder>
<script type="text/javascript">
function OnEditCommand(sender, commandArgs) {
alert(commandArgs.get_itemIndex());
}
function OnDeleteCommand(sender, commandArgs) {
alert(commandArgs.get_itemIndex());
}
function OnSelectCommand(sender, commandArgs) {
alert(commandArgs.get_itemIndex());
}
</script>
</body>
</html>