Forums

Board index » YUI 2.x: » General

Page 1 of 1   [ 7 posts ]
New Topic | Post Reply | Print view

Prasath M

  • Username: prasathm
  • Joined: Thu Apr 19, 2012 1:20 am
  • Posts: 22
  • Twitter: prasath116
  • IRC: Prasath M
  • Offline
  • Profile
Tags:

YUI 2 Datatable custom row formatting

Post Posted: Thu Jun 28, 2012 7:58 pm
+0-
Without pagination row formatting is working.
If I apply pagination to that datatable, pagination works but row formatting is not working.
I need to apply pagination and custom row formatting.
if possible please give some solution. My code is



<style type="text/css">

/* Class for marked rows */
.yui-skin-sam .yui-dt tr.mark,
.yui-skin-sam .yui-dt tr.mark td.yui-dt-asc,
.yui-skin-sam .yui-dt tr.mark td.yui-dt-desc,
.yui-skin-sam .yui-dt tr.mark td.yui-dt-asc,
.yui-skin-sam .yui-dt tr.mark td.yui-dt-desc {
background-color: #a33;
color: #fff;
}
color: #fff;
}
</style>
<!--end custom header content for this example-->
</head>
<body class="yui-skin-sam">
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->

<div id="productTable" >productTable</div>
<script type="text/javascript">

YAHOO.util.Event.onDOMReady(function () {
YAHOO.example.Basic = function() {

var myColumnDefs = [
{key:"lineNo", label:"lineNo" , formatter:YAHOO.widget.DataTable.formatNumber,sortable: true,editor: new YAHOO.widget.TextboxCellEditor({disableBtns: false})},
{key:"issueName", label:"issueName",editor: new YAHOO.widget.TextboxCellEditor({disableBtns:true})}

];
var myDataSource = new YAHOO.util.DataSource("welcome/init");
myDataSource.connMethodPost = true;
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
resultsList: "marketBeanList",
fields: [{key:"issueName"},

{key:"lineNo"}
]
};
var myConfigs = {
paginator: new YAHOO.widget.Paginator({
rowsPerPage: 490,
template: YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
rowsPerPageOptions: [10,25,50,100,490,500],
pageLinks: 15
}),
sortedBy : {key:"lineNo", dir:YAHOO.widget.DataTable.CLASS_ASC},
draggableColumns:true
};


var myRowFormatter = function(elTr, oRecord) {
if (oRecord.getData('issueName') == 'GBP') {
YAHOO.util.Dom.addClass(elTr, 'mark');
}
return true;
};


var myDataTable = new YAHOO.widget.DataTable("productTable",
myColumnDefs, myDataSource,myConfigs,{formatRow: myRowFormatter});



myDataTable.subscribe("cellClickEvent", myDataTable.onEventShowCellEditor);

return {
oDS: myDataSource,
oDT: myDataTable
};
}();

});

</script>
<!--END SOURCE CODE FOR EXAMPLE =============================== -->
<!--MyBlogLog instrumentation-->
<script type="text/javascript" src="http://track2.mybloglog.com/js/jsserv.php?mblID=2007020704011645"></script>
</body>
</html>

Please give some solution.

John Lindal

YUI Contributor

  • Username: jafl
  • Joined: Mon Nov 02, 2009 2:33 pm
  • Posts: 352
  • Location: Los Angeles, CA
  • Twitter: jafl5272
  • GitHub: jafl
  • Gists: jafl
  • Offline
  • Profile

Re: YUI 2 Datatable custom row formatting

Post Posted: Mon Jul 02, 2012 7:47 am
+1-
Cell formatting is independent of pagination. If you post your code on jsfiddle, I can take a look.

Prasath M

  • Username: prasathm
  • Joined: Thu Apr 19, 2012 1:20 am
  • Posts: 22
  • Twitter: prasath116
  • IRC: Prasath M
  • Offline
  • Profile
Tags:

Re: YUI 2 Datatable custom row formatting

Post Posted: Mon Jul 02, 2012 11:22 pm
+0-
Thank you John Lindal.
But you cant invoke my datasource.
Datasource is from controller side.
How do I post in jsfiddle?

John Lindal

YUI Contributor

  • Username: jafl
  • Joined: Mon Nov 02, 2009 2:33 pm
  • Posts: 352
  • Location: Los Angeles, CA
  • Twitter: jafl5272
  • GitHub: jafl
  • Gists: jafl
  • Offline
  • Profile
Tags:

Re: YUI 2 Datatable custom row formatting

Post Posted: Tue Jul 03, 2012 7:47 am
+0-
Good point. jsfiddle doesn't handle server-side.

Looking at your code, I see that you are passing 5 arguments to the DataTable constructor, but the API docs specify that there are only 4 arguments.

{formatRow: myRowFormatter} needs to be merged into myConfigs.

Prasath M

  • Username: prasathm
  • Joined: Thu Apr 19, 2012 1:20 am
  • Posts: 22
  • Twitter: prasath116
  • IRC: Prasath M
  • Offline
  • Profile

Re: YUI 2 Datatable custom row formatting

Post Posted: Tue Jul 03, 2012 6:58 pm
+0-
How to merge row formatter in myconfigs?
please post the merged code..


Thank you for ur reply

John Lindal

YUI Contributor

  • Username: jafl
  • Joined: Mon Nov 02, 2009 2:33 pm
  • Posts: 352
  • Location: Los Angeles, CA
  • Twitter: jafl5272
  • GitHub: jafl
  • Gists: jafl
  • Offline
  • Profile
Tags:

Re: YUI 2 Datatable custom row formatting

Post Posted: Tue Jul 03, 2012 8:10 pm
+1-
As simple as this:

var myConfigs = {
paginator: new YAHOO.widget.Paginator({...}),
sortedBy : {key:"lineNo", dir:YAHOO.widget.DataTable.CLASS_ASC},
draggableColumns:true,
formatRow: myRowFormatter
};

Prasath M

  • Username: prasathm
  • Joined: Thu Apr 19, 2012 1:20 am
  • Posts: 22
  • Twitter: prasath116
  • IRC: Prasath M
  • Offline
  • Profile

Re: YUI 2 Datatable custom row formatting

Post Posted: Wed Jul 04, 2012 6:39 pm
+0-
Thank you so much. I got it.
Page 1 of 1   [ 7 posts ]
New Topic | Post Reply | Print view
Display posts from previous:  Sort by  
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

Recent Forums Posts

Recent YUI Blog Posts

Online Users

© 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