Ext  technology + Grid + HyperLink column...

Posted on 2009-07-10
Last Modified: 2012-05-07
I built an ascx that contains a grid.
I need to add a column that the values inside will be links.
The column is :
 {name: 'Title', type: 'string'}  -----> instead of string, somthing like "URL", or "HyperLink"
This doesn't work, so how can it be done?
(the code is below...)
<script language="javascript">
    var record =[
        {name: 'RequestId', type: 'float'},
        {name: 'Id', type: 'string'},
        {name: 'Title', type: 'string'}  ***********HERE I NEED TO CHANGE TO HYPERLINK-TEXT/URL
    var xmlStore = new{            
        url     : "Services/ExtService.aspx?serviceMethod=GetData",
        reader  : new{
            record      : Suppliers, 
            totalRecords: "results"}, record
    var pagingBar = new Ext.PagingToolbar({
        pageSize    : 10,
        displayInfo : true,
        displayMsg  : '',
        store       : xmlStore
    var sm = new Ext.grid.RowSelectionModel({
        singleSelect: true,
        listeners: {
            rowselect: function(sm, row, rec) {
    var reportsGrid = new Ext.grid.GridPanel({
        cm : new Ext.grid.ColumnModel([
            {RequestID: 'RequestId', dataIndex: 'RequestorId', hidden: true},
            {header: 'a',sortable: true, dataIndex: 'Id'},
            {header: 'b',sortable: true, dataIndex: 'Title'}                
        plugins             : expander,
        collapsible         : false,
        animCollapse        : false,
        sm                  : sm,
        enableHdMenu        : false,
        enableColumnResize  : false,
        store               : xmlStore,
        height              : 400,
        width               : 850,
        viewConfig          : {forceFit : true, scrollOffset:2},
        autoExpandColumn    : 'SecondarySubject',
        frame               : true,
        title               :'results',
        bbar                : pagingBar,
        {text:,'show', tooltip:'show', tooltipType: 'title'}, 
        {text:'back', handler: back, tooltip:'new search', tooltipType: 'title'}

Open in new window

Question by:udir
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
LVL 40

Accepted Solution

mrjoltcola earned 500 total points
ID: 24824303
What is the actual content of the Title field in the Ext record?

I use links in Ext grids but usually use a renderer on the fly. Can you try this method?

			var listColumnModel = new Ext.grid.ColumnModel
					{header: "Full Name", width: 90, sortable: true, dataIndex: 'fullName'},
					{header: "Date of Birth", width: 80, sortable: true, dataIndex: 'birthDateString'},
					{header: "Actions", width: 60, sortable: false, fixed: true, dataIndex: '', renderer: renderActions}
			function renderActions(value, meta, record)
				var editUrl = baseUri + 'detail/edit.action?id=' +;
				var html = '<a href="' + editUrl + '"><img src="' + baseUri + '/images/icon/edit.png" width="18" height="18" ext:qtip="Edit"/></a>';
				return html;

Open in new window


Author Comment

ID: 24824523
what is your -  baseUri?
i get an error:  is not define
LVL 40

Expert Comment

ID: 24824612
I define it to a struts tag (which is in a sitemesh master page):

       var baseUri = '<s:url value="/"/>';

But that maps to the context root of the application

       var baseUri = '/myapp/';

Author Comment

ID: 24824748
Thanks a lot

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question