Infinite Scrolling in ASP.NET MVC and SEO

0

Well, I need to do an infinite scroll in ASP.NET MVC, but I need to separate content on demand as suggested by the blog #, so that the Google robot can index my products.

Does anyone have a light there? My structure currently looks like this:

public ActionResult GetProducts(int pageIndex, string HeadingLink)
    {
        bool isFilters = !String.IsNullOrEmpty(HeadingLink) ? true : false;

        var ParamIndex = new MySqlParameter { ParameterName = "@p_pageIndex", MySqlDbType = MySqlDbType.Int64, Value = pageIndex };
        var ParamIsFilter = new MySqlParameter { ParameterName = "@p_isFilter", MySqlDbType = MySqlDbType.Bit, Value = isFilters };
        var ParamLinkHeading = new MySqlParameter { ParameterName = "@p_linkHeading", MySqlDbType = MySqlDbType.VarChar, Value = HeadingLink };

        var query = db.Database.SqlQuery<ProductTechnicalVM>
                ("CALL db_sitenei.SP_GetTechnicalProducts(?p_pageIndex, ?p_isFilter, ?p_linkHeading);"
                , ParamIndex, ParamIsFilter, ParamLinkHeading)
            .ToList();

        return Json(query);
    }

public ActionResult ProdutosTecnicos(string link)
    {
        ProductTechnicalVM model = new ProductTechnicalVM()
        {
            Headings = _LoadSideBarHeading()
        };

        List<BreadCrumbVM> breadCrumbVM = new List<BreadCrumbVM>();
        breadCrumbVM.Add(BreadCrumbVM.CreateHome(Request.RequestContext));
        breadCrumbVM.Add(new BreadCrumbVM()
        {
            Name = "Catálogo de Produtos"
        });

        ViewBag.BreadCrumb = breadCrumbVM;

        return View(model);
    }

var pageIndexes = 1;

    $(document).ready(function () {
        GetData();

        var heightPage = $(document).height();

        $("#btn-show-more").click(function () {
            GetData();
            //$("html, body").animate({ scrollTop: $(document).height() - (heightPage - 800) }, 1000);
            $("html, body").animate({ scrollTop: $(document).height() }, 1000);
        });
    });


    function GetData() {
        $.ajax({
            type: "POST",
            url: '@Url.Action("GetProducts", "Lancamentos", new { Area = "" })',
            data: { "pageIndex": pageIndexes, "HeadingLink": $("#UrlParam").val() },
            beforeSend: function () {
                console.log("Carregando...");
                //$('#products-loading').html('<span>Aguarde..</span><img width="100" height="100" src="http://www.arabianbusiness.com/skins/ab.main/gfx/loading_spinner.gif">');},success:function(data){vartextotela="";
                var cdnimage = "http://images.nei.com.br/Asset/lm/";

                for (var i = 0; i < data.length; i++) {
                    textotela += "<div class='col-xs-4'>";
                    textotela += "<a target='_blank' style='text-decoration: none;' href='../produto/" + data[i].Link + "?id=" + data[i].Id + "'><div class='nei-product-box'>";
                    textotela += "<div class='nei-product-box-image'>";
                    textotela += "<img src='" + cdnimage + data[i].PrimaryImageId + data[i].FileExtension + "'>";
                    textotela += "</div>";
                    textotela += "<div>";
                    textotela += "<span class='nei-product-date'>" + data[i].CompanyName + "</span>";
                    textotela += "<h2 class='nei-product-title'>" + data[i].Product + "</h2>";
                    textotela += "<span class='nei-product-description'>" + data[i].DescriptionMetadata + "</span>";
                    textotela += "</div>";
                    textotela += "</div>"
                    textotela += "</div></a>";
                    console.log("Sucesso!!!");
                    pageIndexes++;
                }

                $("#products-list").html($("#products-list").html() + textotela);
            },
            error: function (result) {
                console.error('Serviço falhou: ' + result.status + ' Tipo :' + result.statusText);
            }
        });
    }

<div class="row" style="margin-top: 25px;">
    <div class="col-xs-6">
        <div id="products-loading"></div>
    </div>
    <div class="col-xs-6">
        <div id="btn-show-more" class="btn btn-success">Mostrar mais produtos</div>
    </div>
    <div class="scroll-top-wrapper ">
        <span class="scroll-top-inner">
            <i class="fa fa-2x fa-arrow-circle-up"></i>
        </span>
    </div>
</div>[![The output of my html is empty by crawl][1]][1]
    
asked by anonymous 03.11.2015 / 20:30

0 answers