This is a migrated thread and some comments may be shown as answers.

Radgrid client side data binding issue

0 Answers 54 Views
Grid
This is a migrated thread and some comments may be shown as answers.
diep
Top achievements
Rank 1
diep asked on 29 May 2017, 10:38 AM

I am trying to make an example about Client side binding. I have 18 data objects and I set page size of grid to 18 but the grid just shows 11 rows on browsers. I don't know what I did wrong. Please give me your advice.

 

1.<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<br> <br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br> <br><html xmlns="http://www.w3.org/1999/xhtml"><br><head runat="server"><br>    <title></title><br></head><br><body><br>   
<form id="form1" runat="server"><br>   
<asp:ScriptManager ID="ScriptManager1" runat="server"><br>    </asp:ScriptManager><br>     <br>   
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"><br>       
<script type="text/javascript"><br>           
function pageLoad(sender, args)<br>            {<br>                var tableView = $find("<%= cartRadGrid1.ClientID %>").get_masterTableView();<br>                var data =<br>                  [<br>                     { "RecordID": 1, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 2, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 3, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 },<br>                     { "RecordID": 4, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 5, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 6, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 },<br>                     { "RecordID": 7, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 8, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 9, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 },<br>                     { "RecordID": 10, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 11, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 12, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 },<br>                     { "RecordID": 13, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 14, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 15, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 },<br>                     { "RecordID": 16, "Manufacturer": "IBM", "Productname": "foo185", "Quantity": 4 },<br>                     { "RecordID": 17, "Manufacturer": "MSFT", "Productname": "bar215", "Quantity": 8 },<br>                     { "RecordID": 18, "Manufacturer": "UHU", "Productname": "upi235", "Quantity": 12 }<br>                  ];<br>                tableView.set_dataSource(data);<br>                tableView.dataBind();<br>            }<br> <br>            function rowDataBound(sender, args)<br>            {<br>                var gridItem = args.get_item();<br>                var record = args.get_dataItem();<br><br>                var templateCell = gridItem.get_cell("TemplateColumn");<br>                $get("Manufacturer", templateCell).innerHTML = record.Manufacturer;<br>                $get("Productname", templateCell).innerHTML = record.Productname;<br><br>                var editCell = gridItem.get_cell("TemplateEditColumn");<br>                $get("Quantity", editCell).innerHTML = record.Quantity;<br>            }<br>        </script><br>    </telerik:RadScriptBlock><br> <br>    <div><br>       
<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Height="100%" Width="100%">  <br>              <telerik:RadGrid ID="cartRadGrid1"                 <br>                  runat="server"<br>                  AllowPaging="True"><br>                  <PagerStyle Mode="NumericPages" /><br>                  <MasterTableView<br>                      AutoGenerateColumns="False"<br>                      DataKeyNames="RecordID"<br>                      ClientDataKeyNames="RecordID"<br>                      Width="100%"<br>                      CommandItemDisplay="None"<br>                      PageSize="18"><br>                      <Columns><br>                          <telerik:GridBoundColumn<br>                              DataField="RecordID"<br>                              HeaderText="RecordID"<br>                              ReadOnly="True"<br>                              SortExpression="RecordID"                           <br>                              UniqueName="RecordID"<br>                              Visible="false"><br>                          </telerik:GridBoundColumn><br>                          <telerik:GridBoundColumn<br>                              DataField="ARAGRNR"<br>                              HeaderText="ARAGRNR"<br>                              SortExpression="ARAGRNR"<br>                              UniqueName="ARAGRNR"<br>                              Visible="false"><br>                          </telerik:GridBoundColumn><br> <br>                          <telerik:GridTemplateColumn UniqueName="TemplateColumn"><br>                            <HeaderTemplate></HeaderTemplate><br>                            <ItemTemplate><br>                              <span id="Manufacturer"></span><br>                              <br /><br>                              <span id="Productname"></span><br>                            </ItemTemplate><br>                          </telerik:GridTemplateColumn><br>  <br>                          <telerik:GridTemplateColumn UniqueName="TemplateEditColumn"><br>                            <HeaderTemplate></HeaderTemplate><br>                            <ItemTemplate><br>                                <span id="Quantity"></span><br>                                <asp:HyperLink ID="EditLink" runat="server" Text="Edit"></asp:HyperLink><br>                            </ItemTemplate><br>                          </telerik:GridTemplateColumn>                     <br>                      </Columns><br>                      <CommandItemTemplate><br>                          <a href="#" onclick="return false;">Add New Record</a><br>                      </CommandItemTemplate><br>                  </MasterTableView><br>                  <ClientSettings><br>                      <Selecting AllowRowSelect="true" />       <br>                      <ClientEvents OnRowDataBound="rowDataBound" OnCommand="function() {}" /><br>                  </ClientSettings>   <br>              </telerik:RadGrid><br>        </telerik:RadAjaxPanel><br>    </div><br>    </form><br></body><br></html>

No answers yet. Maybe you can help?

Tags
Grid
Asked by
diep
Top achievements
Rank 1
Share this question
or