WebGrid Styling RSS

• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  WebGrid Styling

  Nov 15, 2012 07:19 PM|LINK

  I am having difficulty styling my webgrid table to list the records 4 items per 1 row. I am using paging so I need it to be in a Grid.

  Currently I have the following which place one record per row:

              tableStyle: "grid", 
              headerStyle: "head", 
              rowStyle: "grid th, grid td",

              .grid { width: 950px; text-align:center; border: 1px solid #000000; margin:0px; border-width:0px;  } 
              .head { display: none;  }
              .grid th, .grid td { font-family: Verdana; font-size: small; border:0px solid #000000; height:40px; }

• • Reply
  

  Mikesdotnett...

  All-Star

  154955 Points

  19872 Posts

  Moderator

  MVP

  Re: WebGrid Styling

  Nov 15, 2012 08:33 PM|LINK

  The WebGrid will only display one record per row. If you want to display 4, you will have to render a table yourself.

  Regards, Mike
  Beginning ASP.NET Web Pages with WebMatrix | My Site | Twitter
  • Marked as answer by Angie xu - MSFT on Nov 22, 2012 05:20 AM
• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 15, 2012 08:37 PM|LINK

  Can I then use webgrid paging of so many records per page within my own defined table?

• • Reply
  

  Mikesdotnett...

  All-Star

  154955 Points

  19872 Posts

  Moderator

  MVP

  Re: WebGrid Styling

  Nov 15, 2012 08:40 PM|LINK

  You will have to construct your own paging. That's quite easy to do: http://www.mikesdotnetting.com/Article/150/Web-Pages-Efficient-Paging-Without-The-WebGrid

  Regards, Mike
  Beginning ASP.NET Web Pages with WebMatrix | My Site | Twitter
  • Marked as answer by Angie xu - MSFT on Nov 22, 2012 05:20 AM
• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 15, 2012 09:05 PM|LINK

  That's a great data for paging. I wish I would have known it sooner.

  Thank you

• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 15, 2012 10:04 PM|LINK

  Hi,

  I am getting the following error:

  var photos = db.Query(sql, offset, pageSize);

  Incorrect syntax near 'OFFSET'. Invalid usage of the option NEXT in the FETCH statement.

   

   

  var sql = "SELECT Count(*) FROM galary where imagestatus=0";
  
      count = (int)db.QueryValue(sql);
      totalPages = count/pageSize;
      if(count % pageSize > 0){
          totalPages += 1;
      }
       sql = "SELECT id, description, imagename, photodate FROM galary where imagestatus=0 order by id desc OFFSET @0 ROWS FETCH NEXT @1 ROWS ONLY;";

• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 16, 2012 12:31 AM|LINK

  Does "OFFSET" clause only works with sql sever 2012 ?

  I am using 2008!

   

  Regards

• • Reply
  

  Mikesdotnett...

  All-Star

  154955 Points

  19872 Posts

  Moderator

  MVP

  Re: WebGrid Styling

  Nov 16, 2012 04:45 AM|LINK

  No - it only works with SLQ Server Compact edition. If you are using SLQ Server, you have ot use ROW_NUMBER for paging: http://msdn.microsoft.com/en-us/library/ms186734.aspx

  http://www.codeproject.com/Articles/12338/Using-ROW_NUMBER-to-paginate-your-data-with-SQL-Se

  Regards, Mike
  Beginning ASP.NET Web Pages with WebMatrix | My Site | Twitter
• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 16, 2012 06:56 PM|LINK

  Since I am using razor syntax, what are max and results

  @if ((Request.QueryString["start"] == null) || (Request.QueryString["start"] == "0"))
  { 
       <text><< prev | <a href = "mypage.cshtml?start=2">next >></a></text>
  
  }else{
       int start = (Request.QueryString["start"]).AsInt() + 1;
       int next = (Request.QueryString["start"]).AsInt() + results;
       int prev = (Request.QueryString["start"]).AsInt() - results;
       if (next > max)
       { 
            <text><a href = "mypage.cshtml?start=@prev"><< prev</a> | next >></text>
  
       }else{ 
            <text><a href = "mypage.cshtml?start=@prev"><< prev</a> | <a href = "galary?start=@next">next >></a></text>
            
       }
  }

  • Edited by engcanada on Nov 16, 2012 06:58 PM
• • Reply
  

  engcanada

  Member

  23 Points

  147 Posts

  Re: WebGrid Styling

  Nov 17, 2012 03:45 PM|LINK

  I found the last thread in the follwoing link to perform the paging task the best:

  http://forums.asp.net/t/1678597.aspx/1?Razor+Syntax+AND+Paging