Grid Column Renderer

  1. #1

    Grid Column Renderer

    Hi,

    Below is my column Renderer function. Is it possible to insert the url in the href attribute from Code Behind? I was scratching my head for about couple of hours to find a solution. The url and parameters will be changed according to the user currently logged in to the application.

    function individualDocumentTitle(value, meta, record) 
    {
                    return String.format("<div align='left'><a class='search-heading-style' href='viewer.aspx?id=" + record.data.document_name + "'>{0}</a></div><div align='left' class='individual-lists-sub-heading'>" + record.data.updated_on + "</div><div align='left' class='individual-lists-summary' align='justify'>" + record.data.summary + "</div>", value, record.id);
    }
    Any quick response much appreciated.

    Regards,
    Karthik
    Last edited by Daniil; Feb 01, 2011 at 1:38 PM. Reason: Please use [CODE] tags
  2. #2
    Hi,

    You could store this url in hidden field when a user is logged in and use value of this field in custom renderer.

    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", "test12", "test13" },
                    new object[] { "test1", "test22", "test23" },
                    new object[] { "test1", "test32", "test33" }
                };
                store.DataBind();
            }
        }
    
        protected void Login1(object sender, DirectEventArgs e)
        {
            Hidden1.Value = "User1's url";
            this.GridPanel1.GetView().Refresh();
        }
    
        protected void Login2(object sender, DirectEventArgs e)
        {
            Hidden1.Value = "User2's url";
            this.GridPanel1.GetView().Call("refresh");
        }
    </script>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
    
        <script type="text/javascript">
            var myRenderer = function(value, metadata, record) {
                var url = Hidden1.getValue();
                return url ? url : "Nobody is logged in";
            }
        </script>
    </head>
    <body>
        <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Hidden ID="Hidden1" runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
            <Store>
                <ext:Store runat="server">
                    <Reader>
                        <ext:ArrayReader>
                            <Fields>
                                <ext:RecordField Name="test" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="Test" DataIndex="test" />
                    <ext:Column Header="Url" DataIndex="">
                        <Renderer Fn="myRenderer" />
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <View>
                <ext:GridView runat="server" />
            </View>
        </ext:GridPanel>
        <ext:Button runat="server" Text="User1 login" OnDirectClick="Login1" />
        <ext:Button runat="server" Text="User2 login" OnDirectClick="Login2" />
        </form>
    </body>
    </html>
  3. #3
    Hi Daniil,

    Thanks for your quick reply. My requirement is different. As you can see the attachment every title( with hyperlink ) in the list will have different url. Every Document in the lists has "Access Privileges", so while rendering the columns I want to check whether the user has access to view the Document or not. If the user has access to a Document the url will be like "http://someweb.com" or "javascript:populateMessageBox". Below is my back end code.

        public String setDocumentAccess(String documentId, int mediaAccess, int MonthlyLetterAccess)
        {
            String url = "viewer.aspx?id=" + documentId;
            if (Request.Cookies["Auth"] != null)
            {
                if (Request.Cookies["Auth"].Values[2].ToString() == "Media User")
                {
                    if (mediaAccess > 0)
                    {
                        url = "viewer.aspx?id=" + documentId;
                    }
                    else
                    {
                        url = "javascript:DisplayWarnMessage()";
                    }
                }
                else if (Request.Cookies["Auth"].Values[2].ToString() == "Monthly Letter User")
                {
                    if (MonthlyLetterAccess > 0)
                    {
                        url = "viewer.aspx?id=" + documentId;
                    }
                    else
                    {
                        url = "javascript:DisplayWarnMessage()";
                    }
                }
            }
            return url;
        }
    Awaiting for your reply. This problem hangs on my delivery. :(

    Regards,
    Karthik

    Quote Originally Posted by Daniil View Post
    Hi,

    You could store this url in hidden field when a user is logged in and use value of this field in custom renderer.

    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", "test12", "test13" },
                    new object[] { "test1", "test22", "test23" },
                    new object[] { "test1", "test32", "test33" }
                };
                store.DataBind();
            }
        }
    
        protected void Login1(object sender, DirectEventArgs e)
        {
            Hidden1.Value = "User1's url";
            this.GridPanel1.GetView().Refresh();
        }
    
        protected void Login2(object sender, DirectEventArgs e)
        {
            Hidden1.Value = "User2's url";
            this.GridPanel1.GetView().Call("refresh");
        }
    </script>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
    
        <script type="text/javascript">
            var myRenderer = function(value, metadata, record) {
                var url = Hidden1.getValue();
                return url ? url : "Nobody is logged in";
            }
        </script>
    </head>
    <body>
        <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:Hidden ID="Hidden1" runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
            <Store>
                <ext:Store runat="server">
                    <Reader>
                        <ext:ArrayReader>
                            <Fields>
                                <ext:RecordField Name="test" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="Test" DataIndex="test" />
                    <ext:Column Header="Url" DataIndex="">
                        <Renderer Fn="myRenderer" />
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <View>
                <ext:GridView runat="server" />
            </View>
        </ext:GridPanel>
        <ext:Button runat="server" Text="User1 login" OnDirectClick="Login1" />
        <ext:Button runat="server" Text="User2 login" OnDirectClick="Login2" />
        </form>
    </body>
    </html>
    Attached Thumbnails Click image for larger version. 

Name:	GridView.png 
Views:	265 
Size:	90.4 KB 
ID:	2259  
  4. #4
    Yes, my suggestion doesn't suite these further details.

    Then bind these data - I mean urls - to the Store and use in Renderer something like this:
    record.data.url
    Please note that to update separate record without re-binding a whole store you can use Store's .UpdateRecordField() method.
    store.UpdateRecordField(...)
  5. #5
    Hi Daniil,

    It seems that I got an idea from your reply. I will give a try and let you know whether the post can be mark as solve.

    Thanks once again.

    Regards,
    Karthik
  6. #6
    Hi Daniil,

    Sorry for the delayed reply.

    I had fixed the above said issue by Binding the data from Code Behind.

    Below the "DocumentDetails" is a Data class.

            DataSource_DocumentList.SelectCommand = "select * from document_details";
            System.Data.DataView ListDataView = (System.Data.DataView)DataSource_DocumentList.Select(DataSourceSelectArguments.Empty);
            List<DocumentDetails> documentDetailList = new List<DocumentDetails>();
            for (int index = 0; index < ListDataView.Count; index++)
            {
                DataRowView DocumentRowView = ListDataView[index];
                DocumentDetails documentDetails = new DocumentDetails(DocumentRowView["id"].ToString(), DocumentRowView["title"].ToString(), DocumentRowView["summary"].ToString(), DocumentRowView["name"].ToString(), DocumentRowView["document_name"].ToString(), DocumentRowView["image_name"].ToString(), DocumentRowView["updated_on"].ToString(), DocumentRowView["media_access"].ToString(), DocumentRowView["monthly_letter_access"].ToString(), getLoggedInUserType());
                documentDetailList.Add(documentDetails);
            }
            DocumentListStore.DataSource = documentDetailList;
            DocumentListStore.DataBind();
            IndividualDocumentListTopPaging.PageSize = 15;
            IndividualDocumentListBottomPaging.PageSize = 15;
    I had manually added a custom field "userType" which holds the user type to all the record and in the clients side I will check the user type and set the anchor value while rendering the column as given below:

            function individualDocumentTitle(value, meta, record) {
                var loggedInUserType = record.data.logged_in_user_type;
                var setAnchorAtt = "href='viewer.aspx?id=" + record.data.document_name + "'";
                if (loggedInUserType == "Media User" && record.data.media_access == "0") {
                    setAnchorAtt = "href='javascript:DisplayWarnMessage()'";
                }
                else if (loggedInUserType == "Monthly Letter User" && record.data.monthly_letter_access == "0") {
                    setAnchorAtt = "href='javascript:DisplayWarnMessage()'";
                }            
                return String.format("<div align='left'><a class='search-heading-style' " + setAnchorAtt + ">{0}</a></div><div align='left' class='individual-lists-sub-heading'>" + record.data.updated_on + "</div><div align='left' class='individual-lists-summary' align='justify'>" + record.data.summary + "</div>", value, record.id);
            }
    I got this idea from your previous reply and also the "Sever Mapping" example helped me too.

    Please let me know whether the above fix has any drawback.

    Regards,
    Karthik
  7. #7
    Hi,

    At the first look your renderer looks fine.

    I guess there is no more trouble with it because you didn't 'bump' this thread:)
  8. #8
    Hi Daniil,

    Yes, so far there is no problem.

    You can mark this thread as closed.

    Regards,
    Karthik
  9. #9
    Thanks for the feedback.

Similar Threads

  1. [CLOSED] Grid Column Renderer funcation called twice
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 15
    Last Post: Jan 09, 2012, 9:55 PM
  2. [CLOSED] number renderer in grid column
    By Vasudhaika in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Dec 05, 2010, 10:01 AM
  3. [CLOSED] Tooltip / Renderer for Grid Header Column
    By csharpdev in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Dec 02, 2010, 9:16 AM
  4. [CLOSED] Grid Column Renderer for Currency £
    By CMA in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Sep 07, 2010, 4:52 PM
  5. Checkbox Column with Renderer
    By Tbaseflug in forum 1.x Help
    Replies: 5
    Last Post: Jan 13, 2009, 3:05 PM

Tags for this Thread

Posting Permissions