aspx Tutorial

NET Articles,jQuery demo, with jQuery, online tutorial,Jquery, SilverLight, Javascript,,JSON, MVC,.NET Articles,demo, Web Services,
Advertise Here


Get our toolbar!


Posted by Aamir Hasan   on Saturday, July 9, 2011 Total Views:  

In my previous example, i have told you how to add confirm pop up and Repeater server control in ASP.NET using jQuery. In this example, I will elaborate my last example and shows you how to display total price in footer of Repeater control using jQuery.

Here’s an example.

Design code

<html xmlns="">

<head runat="server">

    <title>Display total amount in Repeater footer in using jquery</title>




            width: 500px;

            font-size: .80em;

            font-family: "Helvetica Neue" , "Lucida Grande" , "Segoe UI" , Arial, Helvetica, Verdana, sans-serif;

            margin: 0px;

            padding: 0px;

            color: #666;


        #table1 th


            border-bottom: 1px solid #eee;

            border-top: 1px solid #eee;

            height: 29px;

            text-align: left;

            padding-left: 10px;

            background-color: #fafafa;


        #table1 td


            border-bottom: 1px solid #eee;

            padding-left: 10px;



    <script src="" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            var Amount = 0;

            $("#table1 tr").each(function (index) {

                var value = $(this).find("td:nth-child(3)").html();

                if (value != null && value != "" && !isNaN(value))

                    Amount = Amount + parseFloat($(this).find("td:nth-child(3)").html());


            $("#total").text("Total Price: " + Amount.toFixed(2));





    <form id="form1" runat="server">


        <asp:Repeater ID="Repeater1" runat="server">


                <table id="table1">



















                        <%# ((Book)Container.DataItem).Title %>



                        <%# ((Book)Container.DataItem).Author %>



                        <%# ((Book)Container.DataItem).Price %>








                        <th colspan="2">




                            <div id="total">













Code behind

protected void Page_Load(object sender, EventArgs e)


        Repeater1.DataSource = Display();




    public List<Book> Display()


        List<Book> Obj = new List<Book>()


            new Book{ Title="ASP.NET C#", Author="Aamir Hasan", Price= 101.1F},

            new Book{ Title="ASP.NET Control", Author="Aamir Hasan", Price= 120.1F},

            new Book{ Title="ASP.NET Development", Author="Aamir Hasan", Price= 140.1F},

            new Book{ Title="ASP.NET Desing Pattern", Author="Aamir Hasan", Price= 50.1F},

            new Book{ Title="Sharepoint 2010 Administration", Author="Aamir Hasan", Price= 70.1F},

            new Book{ Title="Sharepoint 2010 Development", Author="Aamir Hasan", Price= 80.1F},

            new Book{ Title="jQuery", Author="Aamir Hasan", Price= 90.1F},

            new Book{ Title="HTML 5", Author="Aamir Hasan", Price= 20.1F},

            new Book{ Title="Javascript", Author="Aamir Hasan", Price= 40.1F},

            new Book{ Title="ASP.NET C#", Author="Aamir Hasan", Price= 70.1F}



        return Obj;



    public class Book


        public string Title { get; set; }

        public string Author { get; set; }

        public float Price { get; set; }





Repeater-jQuery-Confirm-Footer-totalAmount.rar (1.82 kb)

See Live Demo

Protected by Copyscape Online Plagiarism Tool

Comments (1) -

Waldo Kanney
Waldo Kanney United States
7/13/2015 8:12:56 AM #

Hi everyone, it's my first pay a visit at this web site, and article is really fruitful in favor of me, keep up posting such content.|

Add comment

  Country flag

  • Comment
  • Preview

Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5