asp.net wrap a div on a repeater every 3 results

Question

I don't do asp.net but project I am on is built in it so sorry if this is a really simple question:

The following code pulls the results ok fine but I would like to add a wrapper around every 3 results if possible

<asp:Repeater ID="rptPendingCourses" runat="server" OnItemDataBound="rptPendingCourses_ItemDataBound">
    <ItemTemplate>
        <div class="coursesContainer">
            <div class="coursesContent as">
                <p class="title"><a onclick="linkcourse('<%#DataBinder.Eval(Container.DataItem, "CourseID")%>');return false;" href="#" title='Launch <%# DataBinder.Eval(Container.DataItem, "CourseTitle")%>'><%# System.Web.HttpUtility.HtmlEncode((String)(DataBinder.Eval(Container.DataItem, "CourseTitle").ToString().Length > 25 ? DataBinder.Eval(Container.DataItem, "CourseTitle").ToString().Remove(22) + "..." : DataBinder.Eval(Container.DataItem, "CourseTitle")))%></a></p>
                <ajax:Rating ID="courseRating" runat="server" Visible="false" MaxRating="5" ReadOnly="true"BackColor="Transparent"StarCssClass="ratingStar png" EmptyStarCssClass="emptyRatingStar png" WaitingStarCssClass="waitingRatingStar png" FilledStarCssClass="filledRatingStar png" />
                                <div class="clear"></div>
            </div>
        </div>
    </ItemTemplate>
</asp:Repeater>

So would like it to wrap each 3 results so would be something like

<div class="courseWrapper">
  <div class="courseContainer">......</div>
  <div class="courseContainer">......</div>
  <div class="courseContainer">......</div>
</div>

<div class="courseWrapper">
  <div class="courseContainer">......</div>
  <div class="courseContainer">......</div>
  <div class="courseContainer">......</div>
</div>

Thanks in advance

CS Code:

/* Pending Courses */
rptPendingCourses.DataSource = pendingCourses();
rptPendingCourses.DataBind();

public DataSet pendingCourses()
    {
        DataSet dataSet = new DataSet();
        User user = (User)Context.Items["CurrentUser"];

        SqlConnection selectConnection = new SqlConnection(ConfigurationSettings.AppSettings["DBConnectStr"]);
        SqlDataAdapter adapter = new SqlDataAdapter("dbo.procCataloguesGetAllCoursesByRating", selectConnection);
        adapter.SelectCommand.CommandType = CommandType.StoredProcedure;

        // get results
        adapter.SelectCommand.Parameters.Add("@FilterByDomain", SqlDbType.Bit).Value = 0;
        if (user.Domain.Guid != Guid.Empty) {
            adapter.SelectCommand.Parameters.Add("@DomainID", SqlDbType.UniqueIdentifier).Value = user.Domain.Guid;
        }
        adapter.SelectCommand.Parameters.Add("@Culture", SqlDbType.VarChar, 6).Value = System.Threading.Thread.CurrentThread.CurrentCulture.Name;
        adapter.SelectCommand.Parameters.Add("@IsEnabled", SqlDbType.Bit).Value = 1;
        adapter.SelectCommand.Parameters.Add("@DomainAdminID", SqlDbType.UniqueIdentifier).Value = Guid.Empty;

        try
        {
            dataSet = new DataSet();
            adapter.Fill(dataSet);
        }
        catch (Exception exception)
        {
            dataSet.Dispose();
            dataSet = null;
            LMS_DB.LMS_DB.LogErrorEvent(exception.Message, AuditEntryType.CatalogueCoursesGetCourses);
        }
        finally
        {
            if (selectConnection.State == ConnectionState.Open)
            {
                selectConnection.Close();
            }
        }
        return dataSet;
    }

protected void rptPendingCourses_ItemDataBound(object sender, RepeaterItemEventArgs e)
    {
        DataRowView dataItem = (DataRowView)e.Item.DataItem;
        if (Convert.ToBoolean(dataItem.Row["RatingsEnabled"]))
        {
            Rating rating = (Rating)e.Item.FindControl("courseRating");
            rating.Visible = true;
            rating.CurrentRating = Convert.ToInt32(dataItem.Row["AverageRating"]);
        }

    }

Reinder Wit · Accepted Answer · 2014-04-14T06:16:13.643

4

If you use a ListView Control to display your data, you have an option to specify a <GroupTemplate> along with a GroupItemCount attribute:

<asp:ListView
        GroupItemCount="3" 
        ID="rptPendingCourses"
        runat="server"
        OnItemDataBound="rptPendingCourses_ItemDataBound">
    <LayoutTemplate>
        <div runat="server" ID="groupPlaceholder"></div>
    </LayoutTemplate>
    <GroupTemplate>
        <div class="courseWrapper">
            <asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
        </div>
    </GroupTemplate>
    <ItemTemplate>
    <div class="coursesContainer">
        <div class="coursesContent as">
            <p class="title"><a onclick="linkcourse('<%#DataBinder.Eval(Container.DataItem, "CourseID")%>');return false;" href="#" title='Launch <%# DataBinder.Eval(Container.DataItem, "CourseTitle")%>'><%# System.Web.HttpUtility.HtmlEncode((String)(DataBinder.Eval(Container.DataItem, "CourseTitle").ToString().Length > 25 ? DataBinder.Eval(Container.DataItem, "CourseTitle").ToString().Remove(22) + "..." : DataBinder.Eval(Container.DataItem, "CourseTitle")))%></a></p>
            <ajax:Rating ID="courseRating" runat="server" Visible="false" MaxRating="5" ReadOnly="true" BackColor="Transparent" StarCssClass="ratingStar png" EmptyStarCssClass="emptyRatingStar png" WaitingStarCssClass="waitingRatingStar png" FilledStarCssClass="filledRatingStar png" />
                            <div class="clear"></div>
        </div>
    </div>
    </ItemTemplate>
</asp:ListView>

Then, for the OnItemDataBound event, I think you need to change it into this:

protected void rptPendingCourses_ItemDataBound(object sender, ListViewItemEventArgs e)
{
    if (e.Item.ItemType == ListViewItemType.DataItem)
    {
        ListViewDataItem listItem = (ListViewDataItem)e.Item;
        DataRowView dataItem = (DataRowView)listItem.DataItem;
        if (Convert.ToBoolean(dataItem.Row["RatingsEnabled"]))
        {
            Rating rating = (Rating)e.Item.FindControl("courseRating");
            rating.Visible = true;
            rating.CurrentRating = Convert.ToInt32(dataItem.Row["AverageRating"]);
        }
    }
}

edited Apr 14 '14 at 06:16

answered Apr 10 '14 at 12:16

Reinder Wit

6,490
1
25
36

I would not know how ot modify that, literally just been thrown into this. If i add that code could you maybe help on that as well? – James Brandon Apr 10 '14 at 12:43
First, implement my ListView example but WITHOUT the OnItemDataBound attribute, just to see if it works. Then add the code for rptPendingCourses_ItemDataBound to your question also, so we can have a look – Reinder Wit Apr 10 '14 at 12:54
I get Parser Error Message: The server tag is not well formed on the ajax:Rating line – James Brandon Apr 10 '14 at 13:20
That's probably because there are no spaces between some of the attributes in the ajax:Rating control. I've added the spaces in my ListView sample, please update your code too... – Reinder Wit Apr 10 '14 at 13:26
thanks i am getting rptPendingCourses.DataSource = pendingCourses(); now but as you said things prob need fixing, so i am going to update the question now with all the code – James Brandon Apr 10 '14 at 13:45
Ive made those changes but still getting CS0103: The name 'rptPendingCourses' does not exist in the current context - any ideas on that? sorry. – James Brandon Apr 10 '14 at 14:21
Check out the answer on this page: http://stackoverflow.com/questions/706603/the-name-controlname-does-not-exist-in-the-current-context. Make sure the @Page directive at the top of all the markup points to the same .cs file you just changed. They should match... – Reinder Wit Apr 10 '14 at 14:27
I will check this now, it is weird as was working correctly when using the repeater but let me check your suggestion now. – James Brandon Apr 10 '14 at 14:28
It is weird, 'rptPendingCourses' should match with the ID attribute of our new asp:ListView control. Check whether that control also has runat="server".... – Reinder Wit Apr 10 '14 at 14:30
Yep i change the ID as it was incorrect, new error though.... CS1061: 'System.Web.UI.WebControls.ListViewItem' does not contain a definition for 'DataItem' and no extension method 'DataItem' accepting a first argument of type 'System.Web.UI.WebControls.ListViewItem' could be found (are you missing a using directive or an assembly reference?) The line is: DataRowView dataItem = (DataRowView)e.Item.DataItem; – James Brandon Apr 10 '14 at 14:36
I built in a check for e.Item.ItemType, please update your code to see if it works – Reinder Wit Apr 11 '14 at 06:42
Thanks for the update, seems it resolved that issue but now another lol hopefully this would be the last one... any ideas? System.InvalidOperationException: A group placeholder must be specified on ListView 'rptPendingCourses' when the GroupTemplate is defined. Specify a group placeholder by setting its ID property to "groupPlaceholder". The group placeholder control must also specify runat="server". Line 82: rptPendingCourses.DataBind(); – James Brandon Apr 11 '14 at 22:14
You must be on another version of .NET, cause I haven't seen these issues. Anyway, you need to also specify a LayoutTemplate that has a control with 'ID="groupPlaceholder' defined. I've updated my code, that should fix things... – Reinder Wit Apr 12 '14 at 14:25
Super thanks works great now, i had to close the div here
but once i done that worked as expected. Thanks for all your help, now just need to count them and display a number of how many there are :)
– James Brandon Apr 13 '14 at 12:42

asp.net wrap a div on a repeater every 3 results

1 Answers1