This is a migrated thread and some comments may be shown as answers.

[Solved] Strange Buttons Dont Postback

6 Answers 147 Views

TreeList

This is a migrated thread and some comments may be shown as answers.

SDI asked on 20 Oct 2013, 10:03 PM

I took your idea for a blog/forum as your sample and implemented my own. Strage behavior is the template columns for the edit and reply buttons does not fire off to the Item Command event of the Tree List. Perhaps i am missing something but all seems in check.

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanelBlog" Width="100%" Height="100%">

<asp:Label runat="server" ID="lblSelectedBlog" Text="Select an Program/Group and/or an Event to start blogging" Font-Size="Larger" />

<telerik:RadTreeList ID="RadTreeListBlogBoard" runat="server" DataKeyNames="BlogSubjectId" ClientDataKeyNames="BlogSubjectId" ParentDataKeyNames="ID"

AutoGenerateColumns="false" GridLines="Horizontal" BorderStyle="Solid" AllowPaging="true" PageSize="12">

<NoRecordsTemplate>

<asp:Label runat="server" Font-Bold="true" Font-Italic="true" Text="Click the button above to start a new blog entry." />

</NoRecordsTemplate>

<Columns>

<telerik:TreeListBoundColumn UniqueName="BlogSubjectId" DataField="BlogSubjectId" Display="false" HeaderText="BlogSubjectId"/>

<telerik:TreeListTemplateColumn UniqueName="Subject" DataField="Subject" HeaderText="Subject">

<HeaderStyle Width="180px" />

<ItemStyle Width="180px" Wrap="true"/>

<ItemTemplate>

<asp:LinkButton ID="LnkSubject" runat="server" Font-Bold="true" Font-Size="Large" CommandName="ExpandCollapse" CommandArgument="ExpandAll" Text='<%#Eval("Subject")%>' />

</ItemTemplate>

</telerik:TreeListTemplateColumn>

<telerik:TreeListBoundColumn UniqueName="FullName" DataField="FullName" HeaderText="Author">

<HeaderStyle Width="120px" />

<ItemStyle Width="120px" Wrap="false"/>

</telerik:TreeListBoundColumn>

<telerik:TreeListBoundColumn UniqueName="ModifiedDate" DataField="ModifiedDate" HeaderText="Last modified:" DataFormatString="{0:dd MMM yyyy HH:mm}">

<HeaderStyle Width="120px" />

<ItemStyle Width="120px" />

</telerik:TreeListBoundColumn>

<telerik:TreeListBoundColumn UniqueName="AddDate" DataField="AddDate" HeaderText="Date added:" DataFormatString="{0:dd MMM yyyy HH:mm}">

<HeaderStyle Width="120px" />

<ItemStyle Width="120px" />

</telerik:TreeListBoundColumn>

<telerik:TreeListTemplateColumn HeaderText=" " >

<HeaderStyle Width="75px" />

<ItemStyle Width="75px" />

<ItemTemplate>

<telerik:RadButton ID="RadButtonReply" runat="server" CommandName="ReplyEntry" ToolTip='<%# "Reply to the " + Eval("Subject") + " entry"%>' Width="24px" Height="24px">

<Image ImageUrl="../images/Blog/reply-blue-24.png" />

</telerik:RadButton>

<telerik:RadButton ID="RadButtonEdit" runat="server" CommandName="EditEntry" ToolTip='<%# "Edit the " + Eval("Subject") + " entry"%>' Width="24px" Height="24px" >

<Image ImageUrl="../images/Blog/edit-blue-24.png" />

</telerik:RadButton>

</ItemTemplate>

</telerik:TreeListTemplateColumn>

</Columns>

<DetailTemplate>

<div>

<asp:Label ID="lblBody" runat="server" Text='<%#Eval("Body")%>'></asp:Label>

</div>

</DetailTemplate>

<ClientSettings >

<ClientEvents />

</ClientSettings>

</telerik:RadTreeList>

</telerik:RadAjaxPanel>

6 Answers, 1 is accepted

answered on 21 Oct 2013, 02:16 AM

if i create a TreeListEditCommandColumn it does hit my Item Command event. Firebug doesnt come back with any JS issues either, so its very strange...

edit:

okay so i copied your in the sample and it worked. well the only thing that was different was the image.

once i put

<Image ImageUrl="../images/Blog/reply-blue-24.png" />

it failed - even though the image looked nice :) it didnt want to post back to the Item Commmand. any suggestions Telerik?

edit:
well tried all kinds of things and no postback to the ItemCommand. The following didnt work too.

<telerik:TreeListTemplateColumn UniqueName="Template Column" HeaderText=" ">

<HeaderStyle Width="75px" />

<ItemStyle Width="75px" />

<ItemTemplate>

<telerik:RadButton ID="ReplyBtn" runat="server" CommandName="Reply" Width="24px" Height="24px" AutoPostBack="true">

<Image EnableImageButton="true" IsBackgroundImage="true" ImageUrl="../images/Blog/reply-blue-24.png" />

</telerik:RadButton>

<telerik:RadButton ID="EditBtn" runat="server" Text="Edit" CommandName="EditMessage">

</telerik:RadButton>

</ItemTemplate>

</telerik:TreeListTemplateColumn>

I even tried setting CSS and still - no postback

answered on 23 Oct 2013, 02:56 PM

Hello Brain,

The rendered button should be input with type=submit. This way the command will be handled correct. When you use image button the rendering is different. You could handle the client side event of the button and use the RadTreeList client API to fire a command, in this case the TreeList will be the initiator of the PostBack and it will handle the command event.
http://www.telerik.com/help/aspnet-ajax/treelist-client-side-basics.html

Regards,
Vasil
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

answered on 25 Oct 2013, 08:40 PM

Hi Telerik

It doesnt work setting it up as your explained. As a matter of fact even my client events are not being triggered.

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanelBlog" Width="100%" Height="100%">

<telerik:RadCodeBlock ID="RadCodeBlock2" runat="server">

<script type="text/javascript">

//![CDATA[

function RadButtonReplyEntry_Clicked(sender, args) {

alert("Clicked");

}

function RadButtonReplyEntry_Clicking(sender, args) {

alert("Clicking");

}

//]]>

</script>

</telerik:RadCodeBlock>

...

<telerik:RadTreeList ID="RadTreeListBlogBoard" runat="server" DataKeyNames="BlogSubjectId" ClientDataKeyNames="BlogSubjectId" ParentDataKeyNames="ID"

AutoGenerateColumns="false" GridLines="Horizontal" BorderStyle="Solid" AllowPaging="true" PageSize="12" Width="100%" Height="100%">

<NoRecordsTemplate>

<asp:Label runat="server" Font-Bold="true" Font-Italic="true" Text="Click the button above to start a new blog entry." />

</NoRecordsTemplate>

<Columns>

<telerik:TreeListBoundColumn UniqueName="BlogSubjectId" DataField="BlogSubjectId" Display="false" HeaderText="BlogSubjectId"/>

...

<telerik:TreeListTemplateColumn HeaderText=" " >

<HeaderStyle Width="75px" />

<ItemStyle Width="75px" />

<ItemTemplate>

<telerik:RadButton ID="RadButtonReplyEntry" runat="server" UseSubmitBehavior="true" ButtonType="StandardButton" CommandName="ReplyEntry" Width="24px" Height="24px"

ToolTip='<%# "Reply to the " + Eval("Subject") + " entry"%>' OnClientClicked="RadButtonReplyEntry_Clicked" OnClientClicking="RadButtonReplyEntry_Clicking" >

<Image EnableImageButton="true" IsBackgroundImage="true" ImageUrl="../images/Blog/reply-blue-24.png" />

</telerik:RadButton>

</ItemTemplate>

</telerik:TreeListTemplateColumn>

</Columns>

<DetailTemplate>

....

</DetailTemplate>

<ClientSettings >

<ClientEvents />

</ClientSettings>

</telerik:RadTreeList>

</telerik:RadAjaxPanel>

...maybe i am missing something, code all starting to run together!!

Can you give me demo zip showing an image button working in the columns for a RadTreeList?? Posting back as an ItemCommand event.

Thanks!