Cleaning up the List Widget Template

Posted by Community Admin on 04-Aug-2018 21:34

Cleaning up the List Widget Template

All Replies

Posted by Community Admin on 08-Aug-2011 00:00

Alright,

Here is my issue. I'm trying to create a simple list template that just prints out the content for each list item. It works fine - but there seems to be a lot of unnecessary code that is added to the source. See below:

            <input id="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ctrl0_listItemsControl_ClientState" name="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ctrl0_listItemsControl_ClientState" type="hidden" /><span id="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ctrl0_listItemsControl" style="display:none;"></span>
     
    <input id="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ClientState" name="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ClientState" type="hidden" /><span id="ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl" style="display:none;"></span>
<span></span>

And there is some additional JavaScript that gets added:

Sys.Application.add_init(function()
 
    $create(Telerik.Web.UI.RadListView, "UniqueID":"ctl00$Cycle$C001$ctl00$ctl00$ctl00$listsControl$ctrl0$listItemsControl","_clientSettings":,"_currentPageIndex":0,"_pageCount":1,"_pageSize":10,"clientStateFieldID":"ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ctrl0_listItemsControl_ClientState", null, null, $get("ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ctrl0_listItemsControl"));
 
);
 
Sys.Application.add_init(function()
 
    $create(Telerik.Web.UI.RadListView, "UniqueID":"ctl00$Cycle$C001$ctl00$ctl00$ctl00$listsControl","_clientSettings":,"_currentPageIndex":0,"_pageCount":1,"_pageSize":10,"clientStateFieldID":"ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl_ClientState", null, null, $get("ctl00_Cycle_C001_ctl00_ctl00_ctl00_listsControl"));
 
);


Both of these are not needed for my purpose. How do I clean this up? I tried switching the RadListView to be a Repeater but then the list did not render at all. There is also a div tag that encloses my control - it is also unnecessary. Not as intrusive as the inputs and JavaScript, but still unnecessary.

Here is my Widget Template:

<%@ Control Language="C#" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.PublicControls.BrowseAndEdit" Assembly="Telerik.Sitefinity" %>
 
<telerik:RadListView id="listsControl" runat="server"
                     ItemPlaceholderId="ListContainer"
                     EnableEmbeddedSkins="false"
                     EnableEmbeddedBaseStylesheet="false">
    <LayoutTemplate>
            <asp:PlaceHolder id="ListContainer" runat="server" />
    </LayoutTemplate>
    <ItemTemplate>
        <telerik:RadListView ID="listItemsControl" runat="server"
                ItemPlaceholderID="ItemsContainer"
                EnableEmbeddedSkins="false"
                EnableEmbeddedBaseStylesheet="false">
            <LayoutTemplate>
                <ul>
                    <asp:PlaceHolder ID="ItemsContainer" runat="server" />
                </ul>
            </LayoutTemplate>
            <ItemTemplate>
                <li>
                        <asp:Literal runat="server" Text='<%# Eval("Content") %>' />
                </li>
            </ItemTemplate>
        </telerik:RadListView>
    </ItemTemplate>
</telerik:RadListView>

Posted by Community Admin on 11-Aug-2011 00:00

Hi Conrad Ehinger,

The extra inputs that you see rendered from the RadListView controls are coming from ASP.NET. The first one is the ControlState which cannot be disabled (the hidden inputs). The second one is the initialization of the RadListView client components. Since the RadListView for ASP.NET Ajax implements IScriptControl it needs this JS to initialize its client side component. This html cannot be removed.

If you want to build a RadListView with repeaters you have to create your own view for the control and there use repeater controls instead.

Greetings,
Radoslav Georgiev
the Telerik team

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 28-Nov-2011 00:00

Radoslav,

I know this response is long past due - but how do I reference the same data source that the RadListView is referencing?

Thanks,

Chris

Posted by Community Admin on 01-Dec-2011 00:00

Hello Chris,

The datasource is not a property it is assigned  when the NeedsDataSource event (ListsControl_NeedDataSource) of the RadListView is raised. This handler can be overridden if you inherit from the lists control. Inside we pass the datasource as bellow:

/// <summary>
/// This method is called when the Lists control needs a data source to populate data.
/// </summary>
/// <param name="sender">The RadListView which needs data</param>
/// <param name="e"></param>
protected virtual void ListsControl_NeedDataSource(object sender, RadListViewNeedDataSourceEventArgs e)
    this.ListsControl.DataSource = this.GetLists();

GetLists method passes a collection of list items filtered by the criteria selected in the designer of the control.

All the best,
Radoslav Georgiev
the Telerik team
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

This thread is closed