none
problema con la class"active" en paginacion RRS feed

  • Pregunta

  • No conosco mucho del tema pero creo que es problema del postback.
    Cuando doy click a un numero de mi paginacion el numero no se pone en estado activo, pero el script que tengo esta por esa razón pero no funciona. si lo pone en estado activo por una fracción de segundo hasta que la pagina se recarga y me muestra los otros datos
    Hay alguna solución modificando el código que ya tengo???
    caso contrario como podria solucionarlo utilizando AJAX o Angular creo que para esos casos son esas herramientas

    Tengo el siguiente código en html(asp.net) c#

    <div class="container-fluid" style="">
      <asp:Repeater ID="rptPaging" runat="server" OnItemCommand="rptPaging_ItemCommand">
    
        <HeaderTemplate>
          <div class="container-fluid">
            <div class="row">
              <div class="col-sm-12 text-center">
                <ul id="id_pgn" class="pagination">
        </HeaderTemplate>
    
        <ItemTemplate>
          <li class="btn_pgn">
            <asp:LinkButton ID="btnPage" CommandName="Page" CommandArgument="<%# Container.DataItem %>" runat="server">
              <%# Container.DataItem %>
            </asp:LinkButton>
          </li>
        </ItemTemplate>
    
        <FooterTemplate>
          </ul>
          </div>
          </div>
          </div>
        </FooterTemplate>
      </asp:Repeater>
    </div>
    <script>
      var header = document.getElementById("id_pgn");
      var btns = header.getElementsByClassName("btn_pgn");
      for (var i = 0; i < btns.length; i++) {
        btns[i].addEventListener("click", function() {
          var current = document.getElementsByClassName("active");
          current[0].className = current[0].className.replace(" active", "");
          this.className += " active";
        });
      }
    </script>

    Como utilizo un repeater para mostrar mis datos, en mi codigo del lado del servidor tengo el siguiente codigo para la paginacion

    /// <summary>
        /// Page numeracion
        /// </summary>
        public int PageNumber
        {
            get
            {
                if (ViewState["PageNumber"] != null)
                {
                    return Convert.ToInt32(ViewState["PageNumber"]);
                }
                else
                {
                    return 0;
                }
            }
            set { ViewState["PageNumber"] = value; }
        }
        private void BindRepeater()
        {
    
            //Create the PagedDataSource that will be used in paging
            PagedDataSource pgitems = new PagedDataSource();
            pgitems.DataSource = tab_user002.DefaultView;
            pgitems.AllowPaging = true;
    
            //Control page size from here 
            pgitems.PageSize = 4;
            pgitems.CurrentPageIndex = PageNumber;
            if (pgitems.PageCount > 1)
            {
                rptPaging.Visible = true;
                ArrayList pages = new ArrayList();
                for (int i = 0; i <= pgitems.PageCount - 1; i++)
                {
                    pages.Add((i + 1).ToString());
                }
                rptPaging.DataSource = pages;
                rptPaging.DataBind();
            }
            else
            {
                rptPaging.Visible = false;
            }
    
            //Finally, set the datasource of the repeater
            rp_gs_tu.DataSource = pgitems;
            rp_gs_tu.DataBind();
        }
    
        //This method will fire when clicking on the page no link from the pager repeater
        protected void rptPaging_ItemCommand(object source, System.Web.UI.WebControls.RepeaterCommandEventArgs e)
        {
            PageNumber = Convert.ToInt32(e.CommandArgument) - 1;
            BindRepeater();
        }
    Hay alguna solución modificando el código que ya tengo???
    caso contrario como podria solucionarlo utilizando AJAX o Angular creo que para esos casos son esas herramientas



    martes, 12 de junio de 2018 7:45