Working with HTML data- attribute

Sample HTML –

 
<td class="areaCell" data-expandstatus="false">Some text</td>

JQuery part –

 
//getter
var expandstatus = currentRow.attr('data-expandstatus');
//setter
currentRow.attr("data-expandstatus", "true"); 

//Or
//getter
var expandstatus = $(this).data('expandstatus');
//setter
//Functionable setter not found.

Advertisements

Lazy Load on scroll – Complete example

<!--HTML part -->
<div class="container" id="container">
</div>
//JQuery Part- 
$(function() {
  //--> Handle window scroll event
  $(window).scroll(function () {
     //jQuery scrollTop function will return the area hidden on the top of the page.
     var CurrentScroll = $(this).scrollTop(); 
     //detect scroll down or up
     if (CurrentScroll > LastScroll) {
        //Code for down-ward scrolling (scroll bar going to down).
        var diff = CurrentScroll - scrollAmount;
        //Let user scroll at least 200px
        if (diff >= 200) {
           LoadMorePosts();
           scrollAmount = CurrentScroll;
        }
     }
     else {
       //up-ward scrolling
       scrollAmount = 0;
     }
     //Updates last scroll position
     LastScroll = CurrentScroll;
   });
   //<-- Handle window scroll event


    //--> AJAX call to laod posts in lazy style
    function LoadMorePosts() {
        var fd = new FormData();
        fd.append("PageCount", pageCount);
        $.ajax({
            url: '/Home/GetNextPosts?sid=' + '@ViewBag.SID',
            type: "POST",
            data: fd,
            processData: false,  // tell jQuery not to process the data
            contentType: false,   // tell jQuery not to set contentType
            beforeSend: function () {
            },
            success: function (response) {
                if (response.Complete == 'yes') {
                    pageCount++;
                    var posts = response.Posts;
                    if (posts.length>0) {
                        $.each(posts, function () {
                            $('#container').append('<div class="row"> <div class="col-lg-12"><h2>' + this.PostTitle + '</h2></div></div>');
                        });
                    }
                }
                else {
                }
            },
            error: function (request, status, error) {
            },
            complete: function () {
            }
        });
    }
    //<----AJAX call to laod posts in lazy style

});

ASP.NET MVC Controller Code (C#)-

public class HomeController : Controller
{
   public JsonResult GetNextPosts(FormCollection data)
   {
      int pageCount = Convert.ToInt32(data["PageCount"]);
      List<BlogPost> posts = BlogContentManager.GetPosts(null, pageCount);
      return Json(new{Complete="yes", Posts= posts}, JsonRequestBehavior.AllowGet);
   }
}

Data Access Layer (Model)

public static List<BlogPost> GetPosts(Int32? categoryId,int pageCount)
{
    List<BlogPost> contents = new List<BlogPost>();

    //Return next 5 posts
    int startNumber = (pageCount * 5) + 1;
    int endNumber = (pageCount * 5) + 5; 

    using (SqlConnection connection = new SqlConnection(ConnectionString))
    {
        string sqlSelect = String.Empty;
        if (categoryId == null)
        {
            sqlSelect = @"  SELECT PostId,PostTitle,PostContent,CategoryId,CategoryName, PublishDateTime
                            FROM
	                            (
		                            SELECT ROW_NUMBER() OVER( ORDER BY dbo.BlogPosts.PostId DESC ) AS row, dbo.BlogPosts.PostId, dbo.BlogPosts.PostTitle, dbo.BlogPosts.PostContent, dbo.BlogPosts.CategoryId, dbo.Category.CategoryName, dbo.BlogPosts.PublishDateTime
		                            FROM dbo.Category INNER JOIN dbo.BlogPosts ON dbo.Category.CategoryId = dbo.BlogPosts.CategoryId
	                            )
                            AS data WHERE row BETWEEN "+ startNumber +" AND "+ endNumber +" ORDER BY PostId DESC";
        }
        else
        {
            sqlSelect = @"  SELECT PostId,PostTitle,PostContent,CategoryId,CategoryName, PublishDateTime
                            FROM
	                            (
		                            SELECT ROW_NUMBER() OVER( ORDER BY dbo.BlogPosts.PostId DESC ) AS row, dbo.BlogPosts.PostId, dbo.BlogPosts.PostTitle, dbo.BlogPosts.PostContent, dbo.BlogPosts.CategoryId, dbo.Category.CategoryName, dbo.BlogPosts.PublishDateTime
		                            FROM dbo.Category INNER JOIN dbo.BlogPosts ON dbo.Category.CategoryId = dbo.BlogPosts.CategoryId where dbo.BlogPosts.CategoryId="+ categoryId + @"
	                            )
                            AS data WHERE row BETWEEN " + startNumber + " AND " + endNumber + " ORDER BY PostId DESC";
        }

        using (SqlCommand command = new SqlCommand(sqlSelect, connection))
        {
            connection.Open();
            using (SqlDataReader reader = command.ExecuteReader(CommandBehavior.CloseConnection))
            {
                while (reader.Read())
                {
                    contents.Add(FillEntity(reader));
                }

                if (!reader.IsClosed)
                {
                    reader.Close();
                }
            }
        }
    }

    return contents;
}