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

Row double click edit and Row click edit update on Grid

4 Answers 291 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Indira
Top achievements
Rank 1
Indira asked on 02 Mar 2010, 12:37 AM
Hi,

I would like to achieve this with AllowAutomaticUpdate/Delete/Insert set to false and with no declarative datasource.  Basically I would like to bind the data to the grid in the code behind with a business object and would like to bring the grid rows in edit mode on a client double click and update it on a rowckick after validating the input values.

I truly appreciate your help in this regard with a sample project.

Thanks!

4 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 02 Mar 2010, 10:16 AM
Hi,

You can make a call to the RadAjaxManager AjaxRequest  from the js ,where you can execute server side code  to update your record.

JS:
  function RowClick(sender, eventArgs) { 
            if (editedRow && hasChanges) { 
                hasChanges = false
                if (confirm("Update changes?")) { 
 
                    $find("<%=RadAjaxManager1.ClientID%>").ajaxRequest("update") 
                } 
            } 
        } 

C#
 protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e) 
    { 
        if (e.Argument == "update"
        { 
            SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ToString()); 
            
            string cmdText; 
            foreach(GridEditableItem editedItems in RadGrid1.EditItems) 
             { 
               conn.Open(); 
               cmdText = "Update Products set ProductName='" + ((TextBox)editedItems["ProductName"].Controls[0]).Text + " 'where ProductID='" + editedItems.GetDataKeyValue("ProductID").ToString() + "'"
               SqlCommand cmd = new SqlCommand(cmdText, conn); 
               cmd.ExecuteNonQuery(); 
               conn.Close(); 
            } 
            
            RadGrid1.Rebind(); 
 
        } 
    } 


Hope this helps.

Thanks,
Princy
0
Indira
Top achievements
Rank 1
answered on 02 Mar 2010, 02:25 PM

Thanks for the reply.

I was not intending to use RadAjaxManager. I have tried posting back by implementing PostBackEventHandler.RaisePostBackEvent(), then it is erroring out with " this.Rows" being null or empty.

 

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">  
        <script type="text/javascript">  
        <!--  
         var hasChanges, inputs, dropdowns, editedRow;  
              
         function RowClick(sender, eventArgs)  
         {  
           
             if(editedRow && hasChanges)  
             {  
                    hasChanges = false;  
                    if(confirm("Update changes?"))  
                 {  
                    doPostBack("<%= RadGridRecLayoutPage.UniqueID %>", "RowClicked:" + this.Rows[editedRow].ItemIndex);  
 
                 }  
             }  
         }  
 
         function RowDblClick(sender, eventArgs)  
         {  
 
             editedRow = eventArgs.get_itemIndexHierarchical();  
             $find("<%= RadGridRecLayoutPage.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:RadCodeBlock> 
<telerik:RadGrid ID="RadGridRecLayoutPage" Width="97%"   
            ShowStatusBar="True" AllowSorting="True" PageSize="25" AllowPaging="True" 
            runat="server"   
        AutoGenerateColumns="False" ondatabound="RadGridRecLayoutPage_DataBound"   
        onitemupdated="RadGridRecLayoutPage_ItemUpdated"   
          
        onitemcreated="RadGridRecLayoutPage_ItemCreated"   
        onupdatecommand="RadGridRecLayoutPage_UpdateCommand"   
        onitemcommand="RadGridRecLayoutPage_ItemCommand">  
            <MasterTableView TableLayout="Auto" EditMode="InPlace"   
                EnableViewState="true">  
                <Columns> 
                <telerik:GridBoundColumn UniqueName="PageIndex" DataField="PageIndex" HeaderText="PageIndex" ReadOnly="True" Visible="false" /> 
                <telerik:GridBoundColumn UniqueName="Location" DataField="StartingLocation" HeaderText="Location"   
                 HeaderStyle-Width="10%" ReadOnly="true" /> 
                <telerik:GridBoundColumn UniqueName="FieldName" DataField="FieldName" HeaderText="Field Name"   
                 HeaderStyle-Width="28%" ColumnEditorID="FieldNameGridTextBoxColumnEditor" />                  
                <telerik:GridNumericColumn UniqueName="FieldLength" DataField="FieldLength" HeaderText="Length"   
                 HeaderStyle-Width="10%" ColumnEditorID="FieldLengthGridNumericColumnEditor" /> 
                 <telerik:GridBoundColumn UniqueName="FieldType" DataField="FieldType" HeaderText="Type" HeaderStyle-Width="10%" ColumnEditorID="FieldTypeGridTextBoxColumnEditor" /> 
                 <telerik:GridBoundColumn UniqueName="FieldName" DataField="FieldName" HeaderText="Comments"   
                 HeaderStyle-Width="45%" ColumnEditorID="FieldCommentsGridTextBoxColumnEditor" /> 
               
                   
                 
              </Columns> 
            </MasterTableView> 
            <ClientSettings> 
                <ClientEvents OnRowClick="RowClick" OnRowDblClick="RowDblClick" 
                    OnGridCreated="GridCreated" OnCommand="GridCommand" /> 
            </ClientSettings> 
        </telerik:RadGrid> 
<telerik:GridTextBoxColumnEditor ID="FieldCommentsGridTextBoxColumnEditor" TextBoxStyle-Height="30px" TextBoxMode="MultiLine" runat="server" TextBoxStyle-Width="300px" /> 
        <telerik:GridTextBoxColumnEditor ID="FieldTypeGridTextBoxColumnEditor" runat="server" TextBoxStyle-Width="50px" /> 
        <telerik:GridTextBoxColumnEditor ID="FieldNameGridTextBoxColumnEditor" runat="server" TextBoxStyle-Width="180px" />                
        <telerik:GridNumericColumnEditor ID="FieldLengthGridNumericColumnEditor" runat="server" NumericTextBox-Width="50px" /> 

public partial class UserControl1 : System.Web.UI.UserControl, IPostBackEventHandler  
    {  
 void IPostBackEventHandler.RaisePostBackEvent(string eventArgument)  
        {  
            string[] postBackEventArgumentData = eventArgument.Split(':');  
            switch (postBackEventArgumentData[0])  
            {  
                case "RowClicked":  
                    GridDataItem item = RadGridRecLayoutPage.Items[int.Parse(eventArgument.Split(':')[1])];  
                    Response.Write(String.Format("Page Id:{0}", item.GetDataKeyValue("PageIndex")));  
                    break;  
            }  
 
        }  
0
Princy
Top achievements
Rank 2
answered on 08 Mar 2010, 07:06 AM
Hi,

Please use the code snippet instead to pass the index:

 function RowClick(sender, eventArgs) { 
          if (editedRow && hasChanges) { 
                hasChanges = false
                if (confirm("Update changes?")) { 
                    doPostBack("<%= RadGrid1.UniqueID %>""RowClicked:" + sender.get_masterTableView().get_dataItems()[editedRow]._itemIndexHierarchical);   
                     
                     
                } 
            } 
        } 


Thanks,
Princy
0
Moon
Top achievements
Rank 2
answered on 13 Apr 2010, 03:56 PM
You say to use this:

                   doPostBack("<%= RadGrid1.UniqueID %>", "RowClicked:" + sender.get_masterTableView().get_dataItems()[editedRow]._itemIndexHierarchical);      
    
 

How do you determine the value of [editedrow]?
Tags
Grid
Asked by
Indira
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Indira
Top achievements
Rank 1
Moon
Top achievements
Rank 2
Share this question
or