We're using the free trial to perform a trial run of converting to Telerik since ComponentArt has abandoned their UI Framework product. The most used control in our system is the grid control.  With the ComponentArt grid we bind it to a DataView and everything is passed once to the client where it's formatted, paginated, searchable, etc.  There is no AJAXing of data or postbacks - the data can be navigated and interacted with on the client side quickly and easily.

The closest I can get with a Telerik grid is pagination and formatting but all interaction with the grid causes a postback and reloading of the data.  Is AJAX simply a requirement of using the Telerik grid or is there a way to get similar functionality where all the data is sent once and then everything happens on the client?  I'd rather not create a bunch of web services since we have close to a 100 unique grids in the app that all work this way.

Sample ComponentArt grid code:
ComponentArt grid data binding:

Telerik grid trial implementation:
Telerik grid data binding:

Thanks in advance for your help.  Also, sorry if this information is somewhere else in the forums - I did several searches but nothing seemed relevant.

Hello Sir,

Please provide me Help .

I want to call  function RowClick(sender, eventArgs) on Simple Link Buttton  not  to call <ClientEventsOnRowClick="RowClick" OnRowDblClick="RowDblClick"  OnGridCreated="GridCreated" OnCommand="GridCommand"   />


My code is details on   below.
  <script type="text/javascript">
        <!--
            var hasChanges, inputs, dropdowns, editedRow;

            function RowClick(sender, eventArgs) {

               
                 var a;
                var aa;
                var gridElement = sender.get_element();
                
                inputs = gridElement.getElementsByTagName("input");
                for (var i = 0; i < inputs.length; i++) {
                    var lowerType = inputs[i].type.toLowerCase();
                    if (lowerType == "text") {
                        a = inputs[i].id
                        aa = document.getElementById(a).value;
                    }

                }
                // alert("awanish");
                if (editedRow && hasChanges) {
                    alert('a');
                    hasChanges = false;
                    if (confirm("Update changes?")) {

                        PageMethods.fneditData(a, aa, editedRow, OnGetMessageSuccess, OnGetMessageFailure);
                        $find("<%= grdT101.MasterTableView.ClientID %>").updateItem(editedRow);
                    }
                }
            }
            function GetMessage() {

                PageMethods.Message(OnGetMessageSuccess, OnGetMessageFailure);

            }
            function OnGetMessageSuccess(result, userContext, methodName) {
                window.location = window.location;
                //////                
            }

            function OnGetMessageFailure(error, userContext, methodName) {

                alert(error.get_message());

            }
            function RowDblClick(sender, eventArgs) {
                editedRow = eventArgs.get_itemIndexHierarchical();
                $find("<%= grdT101.MasterTableView.ClientID %>").editItem(editedRow);
            }

            function GridCommand(sender, args) {
                if (args.get_commandName() != "Edit") {
                    editedRow = null;
                }
            }

            function GridCreated(sender, eventArgs) {
                var gridElement = sender.get_element();
                var elementsToUse = [];
                inputs = gridElement.getElementsByTagName("input");
                for (var i = 0; i < inputs.length; i++) {
                    var lowerType = inputs[i].type.toLowerCase();
                    if (lowerType == "hidden" || lowerType == "button") {
                        continue;
                    }

                    Array.add(elementsToUse, inputs[i]);
                    inputs[i].onchange = TrackChanges;
                }

                dropdowns = gridElement.getElementsByTagName("select");
                for (var i = 0; i < dropdowns.length; i++) {
                    dropdowns[i].onchange = TrackChanges;
                }

                //setTimeout(function() { if (elementsToUse[0]) elementsToUse[0].focus(); }, 100);
            }

            function TrackChanges(e) {
                hasChanges = true;
            }
     -->    
    </script>

<telerik:RadGrid runat="server" ID="grdT101"  Skin="Office2007"
            AutoGenerateColumns="false"   OnRowDrop="grdPendingOrders_RowDrop"
              AllowPaging="True"   AllowMultiRowSelection="true" BorderWidth="0"
            Width="100%"  PageSize="30" EnableHeaderContextMenu="true"  
            GridLines="Both"  onitemcommand="grdT101_ItemCommand" AllowAutomaticUpdates="True" >
                <%--<ItemStyle BackColor="#ffffff" />
                <HeaderStyle BackColor="#ffffff" />--%>                
                <MasterTableView DataKeyNames="T101_ID"  EditMode="InPlace" Width="100%"  >
                    <Columns>
                        <%--<telerik:GridBoundColumn HeaderText="ID"  ReadOnly="True" DataField="T201_ID" HeaderStyle-Width="3%"  />--%>
                        <telerik:GridTemplateColumn HeaderStyle-Width="3%" HeaderText="ID" HeaderStyle-Font-Bold="true" >

<ItemTemplate>

<%#Container.ItemIndex+1 %>

</ItemTemplate>

</telerik:GridTemplateColumn>

                        <telerik:GridBoundColumn  HeaderText="Act Exp(T101 - C101A)" DataField="C101A" HeaderStyle-Font-Bold="true" HeaderStyle-Width="94%"  ItemStyle-Width="94%" UniqueName="C101A" />
<telerik:GridTemplateColumn HeaderStyle-Width="3%">
<ItemTemplate>
<asp:LinkButton ID="cxc" runat="server" CommandArgument='<%#Eval("T101_ID") %>' CommandName="DeleteRow"  OnClientClick="if(!confirm('Are you sure to delete this record ?'))return false;" ><img src="../../images/delete.gif" /></asp:LinkButton>
  <asp:LinkButton ID="lnkbutton" runat="server" Text="LinkButton" CommandName="RowClick"></asp:LinkButton>
</ItemTemplate>
</telerik:GridTemplateColumn>

</Columns>
<CommandItemTemplate>
<asp:TextBox ID="txtC101A" runat="server"></asp:TextBox>
</CommandItemTemplate>
 </MasterTableView>
                <ClientSettings  AllowRowsDragDrop="True" AllowColumnsReorder="true" ReorderColumnsOnClient="true">
                    <Resizing AllowColumnResize="true" />
                    <Selecting AllowRowSelect="True" EnableDragToSelectRows="false"/>
                    <ClientEvents OnRowDropping="onRowDropping" OnRowClick="RowClick" OnRowDblClick="RowDblClick"
                    OnGridCreated="GridCreated" OnCommand="GridCommand"   />
                    <Scrolling  UseStaticHeaders="true"/>                   
                </ClientSettings>
                <PagerStyle Mode="NumericPages" PageButtonCount="4" />
            </telerik:RadGrid>


Please Provide help It is very-2 urgent

Your support will be highly appreciated.

Thank You,

Hi!
Is there a way to obtain the menu dynamic with the property "RenderMode = auto" on the window resize event and not only on the loading of the page?
Thank you!

hi,

I have a project with a page that contains 2 radgrids.
in code behind I open a radwindow that does an update on a row in one grid, and changes the status, so that it appears in the other grid.

this is the code for opening the window




Now, upon returning he fires the clientside Refresh function which contains following code:

  <telerik:RadCodeBlock ID="Block2" runat="server">
        <script type="text/javascript">
            function RefreshGrid() {

                var grdGeneralOverview = $find("<%= grdGeneralOverview.ClientID %>").get_masterTableView();
                grdGeneralOverview.rebind();

                var grdApproveDecline = $find("<%= grdApproveDecline.ClientID %>").get_masterTableView();
                grdApproveDecline.rebind();
      </script>
    </telerik:RadCodeBlock>

The OnNeedDatasource functions for both grids in code behind are fired, and the datasources contain the updated data for both grids.

However, and this is the catch, on the screen only the second grid is updated (grdApproveDecline 
)
if I switch the 2 rebinds around, the other gets updated on screen.

Does anyone know why this happens?

I am wondering what the ID field in the Hyperlink Manager does exactly. I tried looking it up and saw that it might have to deal with tracking the number of clicks the hyperlink has had. If that's all the ID field does, is there a way to remove the field from the list there. I would prefer to not have to download the entire EditorDialogues and edit those if there is a way.

http://i.imgur.com/94anKwY.png link to a picture of the hyperlink manager with the ID field visible

Is there a demo for Drag and Drop Functionality in Master Details Grid. If not not can you provide one. Please

Thanks,
Siva

I want to binding binaryimage from sql server.But it is not show. 

My Insert code

ASPX file

And my table 
ID : int
IDCate: int
Name: nvarchar(50)
Pic: image (I try varbinary, text but it's not working)

P/S sorry for my english.

Dear Telerik-Staff,

I want to make my RadGrid occupy 100% of a RadPane's height, the grid is in.

I have taken the WebMail-Demo: The relevant part looks like this:

The AJAX-Code for the OnClientResized-Event looks like this:

I have a site containing my RadGrid (it is not nested into any other controls except the contentplaceholder) and on this site I add the following in the PageLoad-Event:

And finally the AjaxRequest-Event looks like this:


Now to my problem:

When I access the page the RadGrid doesn't occupy the total height of the rightPane. When clicking on the splitbar, the grid is resized properly in its height and width. So this perfectly works.

But I can't get it to run on the initial page load. When I call the RaisePostbackEvent of the AjaxManager the page crashes saying that a negative value for the width and height of the pane is not allowed (caused in the AjaxRequest-Event when subtracting 2 from the rightPane's width).

Then I did the following: Set the leftPane to Collapsed (Collapsed="true"). When accessing the page with this setting, the leftPane is collapsed and the Resized-Event is raised on initial page load. This works as expected but not if I have the leftPane set to Collapsed="false" on the initial PageLoad.

I hope that you can help me. I've spent the entire day trying to fix this. Do you have any idea for me??

Best regards,
Marco

I have gantt chart Its work fine in chrome browser but in Firefox and IE its not show correctly. Please check attached screen shot. I tried to set MonthView-SlotWidth but its not fix my issue.

Hi Team,

I am having three text boxes in the form.
I need to populate the other two text box values based on the value in the first text box value.
These values are coming from database.
ASPX FILE:

  <tr class="FormContainer">
                    <td style="white-space: nowrap;">
                        Terminal ID:
                    </td>
                    <td>
                        <telerik:RadTextBox ID="txtTerminalId" runat="server" >
                             
                        </telerik:RadTextBox>
                        <asp:RequiredFieldValidator ID="txtTerminalIdValidator" runat="server" Display="Dynamic"
                            ControlToValidate="txtTerminalId" ErrorMessage="TerminalId can not be empty!"></asp:RequiredFieldValidator>
                       
                    </td>
                </tr>                <tr class="FormContainer">
                    <td style="white-space: nowrap;">
                        Terminal Name:
                    </td>
                    <td>
                        <telerik:RadTextBox ID="txtTerminalName" runat="server"></telerik:RadTextBox>
                       
                    </td>
                </tr>                <tr class="FormContainer">
                    <td style="white-space: nowrap;">
                        Terminal Address:
                    </td>
                    <td>
                        <telerik:RadTextBox ID="txtTerminalAddress" runat="server"></telerik:RadTextBox>
                       
                    </td>
                </tr>
When i Type Terminal Id in the textbox,Terminal name and terminal address needs to populate automatically.
These values are coming from the database.

protected void plantIdChanged(object sender, EventArgs e)
    {
       
        Int64 plant_id = Convert.ToInt64(txtTerminalId.Text);        var depots = loadingManager.GetLoadingSite(plant_id).FirstOrDefault(x => x.Plant_ID == plant_id);
        if (depots != null)
        {
            txtTerminalName.Text = depots.PlantText;
            txtTerminalAddress.Text = depots.Street + " " + depots.Zipcode;
        }
       
    }
   
plantIdChanged method is used for get terminal name and terminal address from database based on the terminalid(plant_id).
Need to implement it in Onblur event of the text box.

Can any one please help,how to implement this.