I thionk you are over thinking this.
All you need to do is extend the class you wish to use as your item
renderer. In the extended class, either add an event listener or
override a handler. In this case, that class is LinkBar. The LinkBar
class has a clickHandler method already so you override that method to
do what you want.
So, an Item Renderer based on LinkBar could look like:
package Renderers
{
import flash.events.MouseEvent;
import flash.net.*;
import mx.controls.LinkBar;
public class LinkBarRenderer extends LinkBar
{
public function LinkBarRenderer()
{
super();
}
override public function set data(value:Object):void
{
super.data = value;
if(value != null)
{
var linksArray:Array = data.WebSites.split(",");
dataProvider = linksArray;
}
}
override protected function clickHandler(event:MouseEvent):void
{
navigateToURL(new URLRequest("http://"; +
event.target.label), '_blank');
}
}
}
HTH
Steve
--- In [email protected], "aramsdell2000" <aramsdell2...@...>
wrote:
>
> I have put aside the thoughts of making fancy hyperlinks, now I am
just trying to understand events in the itemrenderer. I am ashamed to
say that even after searching this subject in the forum and googling it,
I still find myself struggling.
>
> I ended up trying a LinkBar as Tino suggested
>
> in the itemrenderer:
> else if (column.dataField == "monitorlocations"){
> var linksArray:Array =
String((data["monitorlocations"])).split("\n");
> var linkbarItemRendererFactory:ClassFactory = new
ClassFactory(LinkBar);
> linkbarItemRendererFactory.properties = {dataProvider:linksArray,
direction:"vertical",enabled:true };
> column.itemRenderer = linkbarItemRendererFactory;
> column.setStyle("verticalGap",5);
> column.addEventListener(ItemClickEvent.ITEM_CLICK,
linkBarEventHandler);
>
>
> Problem is that it seems like the click event on the button on the
linkbar never makes it to the linkBarEventHandler which is a function
inside this itemrenderer. I would at least think that this event would
fire but setting a breakpoint in this eventhandler fuction, I can tell
it never makes it there. The datagrid itemclick event doesn't even get
called like it does in the other columns, which I think is a good
indication that I can bubble up the linkbar clickItem event, I just
can't figure out what I am doing wrong or even how to capture in a debug
session what happens on that click event.
>
>
> One post I read says :
>
> "Re: [flexcoders] Listem to an event sent by a DataGrid ItemRenderer
>
> In your item renderer, if you have control over the TimerEvent
creation, set the "bubbles" parameter to true. If you do not, you
may want to catch the event in the renderer and re-dispatch a new
one with bubbles set to true. This will allow your event to bubble
out, up the parental chain until it reaches your application. Then
all you need to do is register for the event at the Application level."
>
>
> Can I set the bubbles property to true somehow using the
ItemRendererFactory approach I have above? If I can't, theoretically I
can dispatch the event from the eventhandler (if I could get it to fire)
and then listen for it in the file that my datagrid is created in.
>
> Alternative to bubbling up an event, maybe somehow I can add an
eventlistener that calls a function using owner.document.myFunction?
>
>
>
>
> --- In [email protected], "valdhor" valdhorlists@ wrote:
> >
> > As far as I know the code is open source but you could add a comment
at his blog (http://www.jabbypanda.com/blog/?p=28).
> >
> > You will either have to disable the datagrids click event handler on
that specific column or figure out a way to put each link in its own
column.
> >
> > --- In [email protected], "aramsdell2000" <aramsdell2000@>
wrote:
> > >
> > > Actually I am not so sure how this will work in a datagrid. One
datagrid cell would have multiple hyperlink buttons. Right now the click
event for the datagrid behaves differently depending on which column you
click. In another column I have one link button per row. But for this
one, I would have several link buttons in one row's cell. Do I do
nothing on the datagrid's click event and then the listerner events for
the links would take over? Haven't tried anything yet, just thinking
about how to approach it.
> > >
> > > Thanks!
> > >
> > > --- In [email protected], "aramsdell2000"
<aramsdell2000@> wrote:
> > > >
> > > > Oh wow, this looks great! Thank you! This looks like what I want
to do, just curious, how do I cite it if I use it/ modified version of
it?? I can add a link to his website and blog in the code?
> > > >
> > > > --- In [email protected], "valdhor" <valdhorlists@>
wrote:
> > > > >
> > > > > Here is a quick and dirty example using the hyperlink
component from
> > > > > jabbypanda
(http://jabbypanda.com/labs/hyperLink/srcview/index.html):
> > > > >
> > > > > <?xml version="1.0" encoding="utf-8"?>
> > > > > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
> > > > > layout="absolute" width="700">
> > > > > <mx:Script>
> > > > > <![CDATA[
> > > > > import mx.collections.ArrayCollection;
> > > > >
> > > > > [Bindable] public var initDG:ArrayCollection =
new
> > > > > ArrayCollection([
> > > > > {Company: 'Apple Computer', WebSites:
> > > > > 'www.apple.com,store.apple.com,developer.apple.com'},
> > > > > {Company: 'Google', WebSites:
> > > > > 'www.google.com,code.google.com,mail.google.com'}
> > > > > ]);
> > > > > ]]>
> > > > > </mx:Script>
> > > > > <mx:DataGrid id="myGrid" dataProvider="{initDG}"
> > > > > rowCount="{initDG.length}">
> > > > > <mx:columns>
> > > > > <mx:DataGridColumn width="120"
dataField="Company"
> > > > > editable="false"/>
> > > > > <mx:DataGridColumn width="500"
dataField="WebSites"
> > > > > itemRenderer="Renderers.LinksRenderer"/>
> > > > > </mx:columns>
> > > > > </mx:DataGrid>
> > > > > </mx:Application>
> > > > >
> > > > > LinksRenderer.as:
> > > > > package Renderers
> > > > > {
> > > > > import flash.net.*;
> > > > > import htmltext.controls.HyperLink;
> > > > > import htmltext.controls.events.HyperlinkEvent;
> > > > > import mx.containers.HBox;
> > > > >
> > > > > public class LinksRenderer extends HBox
> > > > > {
> > > > > private var link1:HyperLink = new HyperLink();
> > > > > private var link2:HyperLink = new HyperLink();
> > > > > private var link3:HyperLink = new HyperLink();
> > > > >
> > > > > public function LinksRenderer()
> > > > > {
> > > > > super();
> > > > > }
> > > > >
> > > > > override public function set data(value:Object):void
> > > > > {
> > > > > super.data = value;
> > > > > if(value != null)
> > > > > {
> > > > > var linksArray:Array =
data.WebSites.split(",");
> > > > > link1.linkText = linksArray[0];
> > > > >
link1.addEventListener(HyperlinkEvent.HYPERLINK_CLICK,
> > > > > hyperLinkClicked);
> > > > > link2.linkText = linksArray[1];
> > > > >
link2.addEventListener(HyperlinkEvent.HYPERLINK_CLICK,
> > > > > hyperLinkClicked);
> > > > > link3.linkText = linksArray[2];
> > > > >
link3.addEventListener(HyperlinkEvent.HYPERLINK_CLICK,
> > > > > hyperLinkClicked);
> > > > > addChild(link1);
> > > > > addChild(link2);
> > > > > addChild(link3);
> > > > > }
> > > > > }
> > > > >
> > > > > private function
hyperLinkClicked(event:HyperlinkEvent):void
> > > > > {
> > > > > navigateToURL(new URLRequest("http://"; +
> > > > > event.target.linkText), '_blank');
> > > > > }
> > > > > }
> > > > > }
> > > > > --- In [email protected], Tino Dai <oberoc@> wrote:
> > > > > >
> > > > > > Have you looked at the class LinkBar? I think that would be
a good way
> > > > > to
> > > > > > return a multiple buttons in a cell of a datagrid.
> > > > > >
> > > > > >
http://livedocs.adobe.com/flex/3/langref/mx/controls/LinkBar.html
> > > > > >
> > > > > > -Tino
> > > > > >
> > > > > >
> > > > > > On Wed, Jan 13, 2010 at 10:11 AM, aramsdell2000
> > > > > aramsdell2000@:
> > > > > >
> > > > > > >
> > > > > > >
> > > > > > > OK, that's the problem. I don't know how to add multiple
link
> > > > > buttons
> > > > > > > through action script. And here goes my feeble attempt at
explaining
> > > > > what I
> > > > > > > did so that it makes sense:
> > > > > > >
> > > > > > > This is how I am now populating the column with multiple
hyperlinks,
> > > > > using
> > > > > > > the itemrenderer approach from Alex's Flex Closet "HTML in
an Item
> > > > > Renderer"
> > > > > > > on this website:
> > > > > > > http://blogs.adobe.com/aharui/item_renderers/
> > > > > > >
> > > > > > > var params:Array = (data[column.dataField]).split(", ");
> > > > > > > var urls:String = "";
> > > > > > > for (var i:Number=0; i < params.length; i++)
> > > > > > > {
> > > > > > > ...
> > > > > > > urls += "<a href='http://webaddress?charname=";
> > > > > > > + params[i]
> > > > > > > + "&someid="
> > > > > > > + station
> > > > > > > + "&anotherid="
> > > > > > > + org
> > > > > > > + "' target='_blank'>" + params[i] + "</a>, ";
> > > > > > > }
> > > > > > > ...
> > > > > > > cdataTag = urls;
> > > > > > > .....
> > > > > > > htmlText = cdataTag;
> > > > > > >
> > > > > > > but only a right click works to open a new window. I would
like it
> > > > > to work
> > > > > > > with just clicking on the text like a normal HTML href.
> > > > > > >
> > > > > > > So what I wanted to do was have each string be a link
button (except
> > > > > i
> > > > > > > don't really like the fact that it looks like a button). I
have been
> > > > > > > experimenting with using a single linkbutton in a
datagridcolumn for
> > > > > > > something similar:
> > > > > > >
> > > > > > > else if (column.dataField == "details"){
> > > > > > > var linkItemRendererFactory:ClassFactory = new
> > > > > ClassFactory(LinkButton);
> > > > > > >
> > > > > > > var someid:String = data["someid"];
> > > > > > > var anotherid:String = data["anotherid"];
> > > > > > >
> > > > > > > var queryExpr:String = "&SomeParameterId=" + someid +
> > > > > > > "&AnotherParameterId=" + anotherid + "restofurl";
> > > > > > > //this line isn't quite working either but I hope you get
the idea..
> > > > > > > //linkItemRendererFactory.properties =
> > > > > > >
{label:data[column.dataField],click:"callGetDetailsWebService(" +
> > > > > queryExpr
> > > > > > > + ");"};
> > > > > > >
> > > > > > > linkItemRendererFactory.properties =
{label:data[column.dataField]};
> > > > > > > column.itemRenderer = linkItemRendererFactory;
> > > > > > >
> > > > > > > I am not sure how to expand the above code to add multiple
buttons.
> > > > > Instead
> > > > > > > of using an inline? renderer, do I have to make a new link
button
> > > > > class and
> > > > > > > extend it or can I somehow write it into the custom
> > > > > > > CustomDataGridItemRenderer class I have now that extends
> > > > > > > DataGridItemRenderer.
> > > > > > >
> > > > > > > Hopefully that makes sense!
> > > > > > >
> > > > > > > Thanks!
> > > > > > > Amy
> > > > > > >
> > > > > > >
> > > > > > > --- In [email protected]
<flexcoders%40yahoogroups.com>,
> > > > > Tino Dai
> > > > > > > oberoc@ wrote:
> > > > > > > >
> > > > > > > > Some code would help
> > > > > > > >
> > > > > > > > On Tue, Jan 12, 2010 at 8:36 PM, aramsdell2000
amy.ramsd...@wrote:
> > > > > > >
> > > > > > > >
> > > > > > > > >
> > > > > > > > >
> > > > > > > > > I have a datagrid column that for each row, has
several text
> > > > > values
> > > > > > > each
> > > > > > > > > with its own hyperlink.
> > > > > > > > >
> > > > > > > > > Ex: the data in the datafield looks like: "Atext,
Btext, Ctext".
> > > > > As it
> > > > > > > is
> > > > > > > > > now, I was able to add href anchor tags but they only
open in a
> > > > > new
> > > > > > > window
> > > > > > > > > with the right mouse click. The datagrid item click
event takes
> > > > > over
> > > > > > > the
> > > > > > > > > left mouse click and I am not sure how to prevent
that. So I
> > > > > thought I
> > > > > > > would
> > > > > > > > > add multiple link buttons in the datagrid column
instead. My
> > > > > question
> > > > > > > is how
> > > > > > > > > to add these multiple buttons using an itemrenderer in
> > > > > actionscript. If
> > > > > > > I
> > > > > > > > > was adding just one I would assume it would be
> > > > > datagrdcol.itemrenderer
> > > > > > > = new
> > > > > > > > > ClassFactory(LinkButton) and then you just set the
properties of
> > > > > the
> > > > > > > link
> > > > > > > > > button. But how do you do it if there are multiple
buttons for
> > > > > the data
> > > > > > > in
> > > > > > > > > the datafield. Do you extend the LinkButton or list
data in a
> > > > > > > > > customitemrenderer class? How?
> > > > > > > > >
> > > > > > > > >
> > > > > > > > >
> > > > > > > >
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > >
> > > > >
> > > >
> > >
> >
>
