| Page 1 of 1 | [ 7 posts ] |
|
Hi,
I am using DataTable (YUI3) in my project and i wanted to make the contents of one of the columns as a hyperlink that opens a Rich Text Area. Can anyone please tell me as to how this can be done? YUI().use("datatable-sort","datatable-scroll", function(Y) { var cols = [ {key:"FirstName", label:"FirstName", sortable:true}, {key:"LastName",label:"LastName"}, {key:"Company", label:"Company", sortable:true}, {key:"Telephone", label:"Telephone"}, {key:"Address", label:"Address"}, {key:"Expertise", label:"Expertise"} }) If i had to make the lastname column to be hyperlinked what is to be done? Thanks in advance |
Juan Ignacio DopazoYUI Contributor
|
Hey!
You can put a link in a DataTable cell by using a formatter (see http://yuilibrary.com/yui/docs/datatable/#formatters). In this case, you can have the formatter return a string with an <a> element by setting the allowHTML configuration to true. For example: Code: var table = new Y.DataTable({ columns: [ /* some columns */ { key: 'someKey', allowHTML: true, formatter: function (o) { // you can escape the content to avoid XSS vulnerabilities var value = Y.Escape.html(o.value); return '<a href="#' + value + '">' + value + '</a>'; } ], data : data }); Last edited by jdopazo on Thu Jun 21, 2012 7:38 am, edited 1 time in total. |
|
Hey Juan,
Thank you for the reply!!! It worked like a charm. I am having a problem with the rich text editor now. I am using the following to render a RTE : YUI().use('yui2-editor', function(Y) { var myEditor = new Y.YUI2.widget.Editor('editor', { height: '400px', width: '600px', dompath: true, //Turns on the bar at the bottom animate: true //Animates the opening, closing and moving of Editor windows }); myEditor.render(); }); I have placed this in between <div> tags with the id as editor. What i want to attempt is to open this RTE when the link on the datatable is clicked. As you suggested i tried to do this by providing the div id in <a href> of the datatable. The problem with this is that the RTE is on the screen while the datatable spills out of the screen. I tried to set the visibility as false and load it but, it still does not help. Any suggestions as to how this can be done? I would like the RTE to splash on the screen (preferably like an alert). Thanks again!!! |
Juan Ignacio DopazoYUI Contributor
|
From your description I guess you probably want to have a RTE inside a YUI3 Panel. In order to do that you just have to keep a couple of things in mind:
- render the RTE after the Panel was rendered - render the RTE when the Panel is visible Otherwise you'll probably run into display issues like the one you mention. But apart from that, it's just a matter of doing something like this: Code: var panel = new Y.Panel({ bodyContent: '', centered: true, width: 300, height: 400 }); panel.render(); var editor = new Y.YUI2.widget.Editor(panel.getStdModNode('body').getDOMNode(), { height: '100px', width: '296px' }); editor.render(); |
|
Hi Juan,
Thanks again for the reply. I am still facing some issues with the rendering of the RTE. If possible can you please point me to a working example that you know of? Regards, Rohit |
Juan Ignacio DopazoYUI Contributor
|
This seems to work for me in modern browsers: http://jsfiddle.net/juandopazo/EzMmW/
I don't have older browsers around to check. |
|
Hi Juan,
I tried everything with the code that you had posted except for the way you had posted it. I put <div> tags and played around a lot only to find it not work. Now, it is working. Thanks a ton sir!!! Regards, Rohit |
| Page 1 of 1 | [ 7 posts ] |
| You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum |
© 2006-2013 Yahoo! Inc. All rights reserved.
All code on this site is licensed under the BSD License unless stated otherwise.
About This Site · Security Contact Info
Powered by phpBB® Forum Software © phpBB Group