What's New?

[CLOSED] Gridpanel Custom Sorting

  1. #1
    Jul 18, 2013, 10:49 AM

    [CLOSED] Gridpanel Custom Sorting

    Hello,

    I need to do sorting on different column which is hidden when I click on another column. My use case is, I have datetime column but I am displaying customized date&time format (string). I am not able to sort on that column I need to sort on original datetime column which is hidden on click of customized date&time column.
    Last edited by Daniil; Jul 30, 2013 at 4:04 AM. Reason: [CLOSED]
  2. #2
    Jul 18, 2013, 3:42 PM
    Hi @WHISHWORKS,

    To get custom sorting you can use a Store's RemoteSort="true" option and sort the things server side. It should be implement with a remote Proxy like a PageProxy or an AjaxProxy.

    However, I think you can avoid using of the two Columns for the same data using a DateColumn with a respective DateFormat or a common Column with a respective Renderer. The main point is that the ModelField should be with Type="Date".
  3. #3
    Jul 19, 2013, 5:48 AM
    Quote Originally Posted by Daniil View Post
    Hi @WHISHWORKS,

    To get custom sorting you can use a Store's RemoteSort="true" option and sort the things server side. It should be implement with a remote Proxy like a PageProxy or an AjaxProxy.

    However, I think you can avoid using of the two Columns for the same data using a DateColumn with a respective DateFormat or a common Column with a respective Renderer. The main point is that the ModelField should be with Type="Date".

    I need to sort on different column if user clicks on any of the grid column. Could you please help me on this
  4. #4
    Jul 19, 2013, 11:01 AM
    Then this gets actual.
    Quote Originally Posted by Daniil View Post
    To get custom sorting you can use a Store's RemoteSort="true" option and sort the things server side. It should be implement with a remote Proxy like a PageProxy or an AjaxProxy.
  5. #5
    Jul 19, 2013, 11:46 AM
    Do you always perform the sort on the same "column", no matter the column clicked?
  6. #6
    Jul 22, 2013, 6:27 AM
    Quote Originally Posted by RCN View Post
    Do you always perform the sort on the same "column", no matter the column clicked?
    Yes, I always perform on one single column if I click on any of the column.
  7. #7
    Jul 22, 2013, 7:32 AM
    Maybe, this way.

    Example
    <%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] 
            { 
                new object[] { "test1", "test2", "test3" },
                new object[] { "test4", "test5", "test6" },
                new object[] { "test7", "test8", "test9" }
            };
        }
    }
</script>

<!DOCTYPE html>
<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server">
            <Store>
                <ext:Store runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="test1" />
                                <ext:ModelField Name="test2" />
                                <ext:ModelField Name="test3" />
                            </Fields>
                        </ext:Model>
                    </Model>
                    <Sorters>
                        <ext:DataSorter Property="test3" Direction="ASC" />
                    </Sorters>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" Text="Test1" DataIndex="test1" Sortable="false" />
                    <ext:Column runat="server" Text="Test2" DataIndex="test2" Sortable="false" />
                    <ext:Column runat="server" Text="Test3" DataIndex="test3" Hidden="true" />
                </Columns>
                <Listeners>
                    <HeaderClick Handler="var store = column.grid.getStore();
                                          
                                          store.sorters.getAt(0).toggle();
                                          store.sort();" />
                </Listeners>
            </ColumnModel>
        </ext:GridPanel>
    </form>
</body>
</html>
  8. #8
    Jul 22, 2013, 11:58 AM
    In my opinion, it's "conceptually" wrong. When the user clicks on a column, it expects the sorting on that specifc column. I'd implement this functionality by adding a button that performs the sorting and setting all the columns unsortable. It would clearly indicate to the user what is going on.

    <!DOCTYPE html>
<html>
<head id="Head1" runat="server">
    <script type="text/javascript">
        var _lastSortDirection = "ASC";
        var click = function () {
            var originalRemoteSort = App._str.remoteSort;
            App._str.remoteSort = false;

            if (_lastSortDirection == "DESC") {
                _lastSortDirection = "ASC";
            }
            else {
                _lastSortDirection = "DESC";
            }

            App._str.sort('ID', _lastSortDirection);
            App._str.remoteSort = originalRemoteSort;
        }
    </script>
</head>
<body>
    <ext:ResourceManager runat="server" />
    <ext:Button Text="Sort by Invisible Column" runat="server">
        <Listeners>
            <Click Handler="click();" />
        </Listeners>
    </ext:Button>
    <ext:GridPanel runat="server" Title="Records" Frame="false" Width="500" Height="500">
        <Store> 
            <ext:Store  ID="_str" runat="server">
                <Proxy>
                    <ext:AjaxProxy Url="/Example/LoadFakeRecords/">
                        <ActionMethods Read="POST" />
                        <Reader>
                            <ext:JsonReader Root="data" />
                        </Reader>
                    </ext:AjaxProxy>
                </Proxy>
                <Model>
                    <ext:Model runat="server">
                        <Fields>
                            <ext:ModelField Name="ID" Type="int" />
                            <ext:ModelField Name="Name" Type="String" />
                            <ext:ModelField Name="Address" Type="String" />
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        </Store>
        <ColumnModel runat="server">
            <Columns>
                <ext:Column Text="Name" Sortable="false" DataIndex="Name" runat="server" />
                <ext:Column Text="Address" Sortable="false" DataIndex="Address" runat="server" />
            </Columns>
        </ColumnModel>
    </ext:GridPanel>
</body>
</html>
    namespace SandBox.Controllers
{
    public class ExampleController : System.Web.Mvc.Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public StoreResult LoadFakeRecords()
        {
            System.Threading.Thread.Sleep(TimeSpan.FromSeconds(3));
            List<Person> lst = new List<Person>();

            for (int index = 0; index < 15; index++)
            {
                lst.Add(new Person
                {
                    ID = index,
                    Name = "Name" + index,
                    Address = "Address" + index,
                });
            }

            return new StoreResult(lst, lst.Count());
        }
    }

    public class Person
    {
        public int ID { get; set; }

        public string Name { get; set; }

        public string Address { get; set; }
    }
}

Similar Threads

  1. [CLOSED] Custom Grid Sorting
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 15
    Last Post: Oct 24, 2013, 4:15 AM
  2. Grouping Feature with Custom sorting
    By glenh in forum 2.x Help
    Replies: 0
    Last Post: Jun 20, 2013, 5:44 AM
  3. [CLOSED] Custom GridPanel Sorting
    By softmachine2011 in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Jun 10, 2013, 1:09 PM
  4. Gridpanel custom sorting
    By boris in forum 1.x Help
    Replies: 11
    Last Post: Aug 23, 2011, 2:50 PM
  5. Problem with GridPanel sorting
    By magisystem in forum 1.x Help
    Replies: 3
    Last Post: Sep 09, 2010, 1:35 PM

Posting Permissions