You can drag and drop tree nodes from a treeview to a jqGrid instance, or in fact, to any HTML element on the page using the client-side API of the treeview. Note, that you can drag multiple nodes, but Ctrl+Clicking on nodes to select multiple nodes at once.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="JQSuiteASPNETExample.examples.tree.draganddropgrid._default" %>
<%@ Register Assembly="Trirand.Web" TagPrefix="trirand" Namespace="Trirand.Web.UI.WebControls" %>

<!DOCTYPE html>
<html lang="en">
<head id="Head1" runat="server">
    <meta charset="utf-8">
    <title>jqTreeView for ASP.NET WebForms - Drag And Drop</title>
    <!-- The jQuery UI theme extension jqGrid needs -->
    <link rel="stylesheet" type="text/css" media="screen" href="/themes/ui.jqgrid.css" />
    <!-- The jQuery UI theme that will be used by the treeview  -->
    <link rel="stylesheet" type="text/css" media="screen" href="" />
    <!-- The jQuery UI theme extension jqTreeView needs -->
    <link rel="stylesheet" type="text/css" media="screen" href="/themes/ui.jqtreeview.css" />
    <!-- jQuery runtime minified -->
    <script src="" type="text/javascript"></script>    
    <!-- The jqTreeView client-side javascript -->
    <script src="/js/trirand/jquery.jqTreeView.min.js" type="text/javascript"></script>    
    <!-- The localization file we need, English in this case -->
    <script src="/js/trirand/i18n/grid.locale-en.js" type="text/javascript"></script>
    <!-- The jqGrid client-side javascript -->
    <script src="/js/trirand/jquery.jqGrid.min.js" type="text/javascript"></script>  
    <style type="text/css">    
        body, html { font-size: 80%; }    

    <form id="form1" runat="server">
    <table style="height:350">
                <trirand:JQTreeView runat="server" 
                        <trirand:JQTreeNode Text="North America" Value="1" Expanded="true" ImageUrl="/images/folder.png" ExpandedImageUrl="/images/folder-open.png">
                                <trirand:JQTreeNode Text="USA" Value="2" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Mexico" Value="3" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Canada" Value="4" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                        <trirand:JQTreeNode Text="South America" Value="5" Expanded="true" ImageUrl="/images/folder.png" ExpandedImageUrl="/images/folder-open.png">
                                <trirand:JQTreeNode Text="Brazil" Value="6" ImageUrl="/images/document.png" Selected="true"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Argentina" Value="7" ImageUrl="/images/document.png" Selected="true"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Chile" Value="8" ImageUrl="/images/document.png" Selected="true"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Costa Rica" Value="9" ImageUrl="/images/document.png" Selected="true"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Columbia" Value="10" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                        <trirand:JQTreeNode Text="Europe" Value="11" Expanded="true" ImageUrl="/images/folder.png" ExpandedImageUrl="/images/folder-open.png">
                                <trirand:JQTreeNode Text="England" Value="12" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Germany" Value="13"  ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Norway" Value="14"  ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Sweden" Value="15" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="Italy" Value="16" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                                <trirand:JQTreeNode Text="France" Value="17" ImageUrl="/images/document.png"></trirand:JQTreeNode>
                    <ClientSideEvents NodesDropped="nodesDropped" />                    
            <td valign="top">
                <trirand:JQGrid ID="JQGrid1" runat="server" Width="350px" Height="100%">
                        <trirand:JQGridColumn DataField="CustomerID" />                            
                        <trirand:JQGridColumn DataField="CompanyName" />
                        <trirand:JQGridColumn DataField="Phone" />
                        <trirand:JQGridColumn DataField="PostalCode" />
     <script type="text/javascript">        

    function nodesDropped(args, e) {
        // NodesDropped client-side event has the following arguments
        // args.draggedNodes -> array, list of nodes being currently dragged
        // args.sourceTreeView -> an instance to the client-side object of the parent treeview
        // args.destinationNode -> the reference to the destination node
        // args.destinationTreeView -> the reference to the destination treeview
        var treeView = args.sourceTreeView; // the instance to the treeview parent        
        var nodesDragged = args.draggedNodes;
        var droppedOnElement = $(;
        // check if the nodes are dropped on a grid instance
        if (droppedOnElement.parents().is(".ui-jqgrid")) {
            var listOfDraggedValues = "";
            for (var i=0; i<nodesDragged.length; i++) {
                var node = nodesDragged[i];
                var options = treeView.getNodeOptions(node);
                listOfDraggedValues += options.value + ",";
            $("#<%= JQGrid1.ClientID %>").setGridParam( { postData: { draggedNodes: listOfDraggedValues } } );            
            $("#<%= JQGrid1.ClientID %>").trigger('reloadGrid');
    <br />
    <br />
    <br />
    <trirand:codetabs runat="server" ID="tabs"></trirand:codetabs>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Configuration;
using System.Data;
using Trirand.Web.UI.WebControls;

namespace JQSuiteASPNETExample.examples.tree.draganddropgrid
    public partial class _default : System.Web.UI.Page
        protected void Page_Load(object sender, EventArgs e)
            if (JQGrid1.AjaxCallBackMode == AjaxCallBackMode.RequestData)
                DataTable gridData = GetData();

                if (Request["draggedNodes"] != null)
                    string draggedNodes = Request["draggedNodes"];
                    string[] values = draggedNodes.TrimEnd(',').Split(',');
                    foreach (string value in values)
                        JQTreeNode node = JQTreeView1.FindNodeByValue(value);

                        DataRow row = gridData.NewRow();
                        row["CustomerID"] = 10000;
                        row["CompanyName"] = node.Text;
                        row["PostalCode"] = "From treeview";

                        gridData.Rows.InsertAt(row, 0);                        

                JQGrid1.DataSource = gridData;

        protected DataTable GetData()
            // Create a new Sql Connection and set connection string accordingly
            SqlConnection sqlConnection = new SqlConnection();
            sqlConnection.ConnectionString = ConfigurationManager.ConnectionStrings["SQL2008_449777_fhsConnectionString"].ConnectionString;

            string sqlStatement = "SELECT CustomerID, CompanyName, Phone, PostalCode, City FROM Customers";

            // Create a SqlDataAdapter to get the results as DataTable
            SqlDataAdapter sqlDataAdapter = new SqlDataAdapter(sqlStatement, sqlConnection);

            // Create a new DataTable
            DataTable dtResult = new DataTable();

            // Fill the DataTable with the result of the SQL statement

            return dtResult;
Switch theme:

Theming is based on the very popular jQuery ThemeRoller standard. This is the same theming mechanism used by jQuery UI and is now a de-facto standard for jQuery based components. The benefits of using ThemeRoller are huge. We can offer a big set of ready to use themes created by professional designers, including Windows-like themes (Redmond), Apple-like theme (Cupertino), etc. In addition to that any jQuery UI controls on the same page will pick the same theme.

Last, but not least, you can always roll your own ThemeRoller theme, using the superb Theme Editor

To use a theme, simply reference 2 Css files in your Html <head> section - the ThemeRoller theme you wish to use, and the jqGrid own ThemeRoller Css file. For example (Redmond theme):

<link rel="stylesheet" type="text/css" media="screen" href="/themes/redmond/jquery-ui-1.8.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/themes/ui.jqgrid.css" />