Permalink
Browse files

Adding workaround file to DataTable tests. Moving DT examples from Lo…

…ader into onDOMReady callbacks.
  • Loading branch information...
1 parent 7db2919 commit 97d033242aaec55d9b8d95ea3bd897b5c80764ce @lsmith lsmith committed Nov 9, 2009
Showing with 518 additions and 478 deletions.
  1. +2 −1 yui2.8/examples/datatable/dt_autocomplete_caja.html
  2. +1 −0 yui2.8/examples/datatable/dt_basic_caja.html
  3. +3 −2 yui2.8/examples/datatable/dt_bhm_caja.html
  4. +2 −1 yui2.8/examples/datatable/dt_cellediting_caja.html
  5. +2 −1 yui2.8/examples/datatable/dt_cellselect_caja.html
  6. +2 −1 yui2.8/examples/datatable/dt_clientpagination_caja.html
  7. +1 −0 yui2.8/examples/datatable/dt_clientsorting_caja.html
  8. +124 −120 yui2.8/examples/datatable/dt_colshowhide_caja.html
  9. +1 −0 yui2.8/examples/datatable/dt_complex_caja.html
  10. +1 −0 yui2.8/examples/datatable/dt_contextmenu_caja.html
  11. +1 −0 yui2.8/examples/datatable/dt_ddrows_caja.html
  12. +2 −1 yui2.8/examples/datatable/dt_dynamicdata_caja.html
  13. +263 −254 yui2.8/examples/datatable/dt_dynamicfilter_caja.html
  14. +1 −0 yui2.8/examples/datatable/dt_enhanced_caja.html
  15. +1 −0 yui2.8/examples/datatable/dt_fixedscroll_caja.html
  16. +94 −93 yui2.8/examples/datatable/dt_formatting_caja.html
  17. +1 −0 yui2.8/examples/datatable/dt_highlighting_caja.html
  18. +1 −0 yui2.8/examples/datatable/dt_localfilter_caja.html
  19. +1 −0 yui2.8/examples/datatable/dt_nestedheaders_caja.html
  20. +1 −0 yui2.8/examples/datatable/dt_polling_caja.html
  21. +2 −1 yui2.8/examples/datatable/dt_row_coloring_caja.html
  22. +1 −0 yui2.8/examples/datatable/dt_rowdatamod_caja.html
  23. +3 −2 yui2.8/examples/datatable/dt_rowexp_basic_caja.html
  24. +1 −0 yui2.8/examples/datatable/dt_rowselect_caja.html
  25. +1 −0 yui2.8/examples/datatable/dt_tabview_caja.html
  26. +2 −1 yui2.8/examples/datatable/dt_xhrjson_caja.html
  27. +1 −0 yui2.8/examples/datatable/dt_xhrpostxml_caja.html
  28. +1 −0 yui2.8/examples/datatable/dt_xhrtext_caja.html
  29. +1 −0 yui2.8/examples/datatable/dt_xpath_caja.html
View
3 yui2.8/examples/datatable/dt_autocomplete_caja.html
@@ -28,6 +28,7 @@
<script type="text/javascript" src="yui/autocomplete/autocomplete-min.js"></script>
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
@@ -130,7 +131,7 @@
}
];
- myDataSource = new YAHOO.util.DataSource("assets/php/ylocal_proxy.php?");
+ myDataSource = new YAHOO.util.DataSource("../yui2.8/examples/datatable/assets/php/ylocal_proxy.php?");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.connXhrMode = "queueRequests";
myDataSource.responseSchema = {
View
1 yui2.8/examples/datatable/dt_basic_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
5 yui2.8/examples/datatable/dt_bhm_caja.html
@@ -29,6 +29,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
@@ -59,7 +60,7 @@
<!--BEGIN SOURCE CODE FOR EXAMPLE =============================== -->
-<iframe id="yui-history-iframe" src="assets/html/blank.html"></iframe>
+<iframe id="yui-history-iframe" src="../yui2.8/examples/datatable/assets/html/blank.html"></iframe>
<input id="yui-history-field" type="hidden">
<div id="dt-pag-nav"></div>
@@ -68,7 +69,7 @@
<script type="text/javascript">
(function () {
// Create the DataSource
- var myDataSource = new YAHOO.util.DataSource("assets/php/json_proxy.php?");
+ var myDataSource = new YAHOO.util.DataSource("../yui2.8/examples/datatable/assets/php/json_proxy.php?");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
resultsList: "records",
View
3 yui2.8/examples/datatable/dt_cellediting_caja.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "#">
+<!doctype html>
<html>
<head>
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
3 yui2.8/examples/datatable/dt_cellselect_caja.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "#">
+<!doctype html>
<html>
<head>
@@ -24,6 +24,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
3 yui2.8/examples/datatable/dt_clientpagination_caja.html
@@ -28,6 +28,7 @@
<script type="text/javascript" src="yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
@@ -72,7 +73,7 @@
{key:"number", label:"Number"}
];
- var myDataSource = new YAHOO.util.DataSource("assets/php/json_proxy.php?");
+ var myDataSource = new YAHOO.util.DataSource("../yui2.8/examples/datatable/assets/php/json_proxy.php?");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
resultsList: "records",
View
1 yui2.8/examples/datatable/dt_clientsorting_caja.html
@@ -24,6 +24,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
244 yui2.8/examples/datatable/dt_colshowhide_caja.html
@@ -1,6 +1,10 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "#">
<html>
<head>
+<link type="text/css" rel="stylesheet" href="yui/fonts/fonts.css">
+<link rel="stylesheet" type="text/css" href="yui/button/assets/skins/sam/button.css">
+<link rel="stylesheet" type="text/css" href="yui/container/assets/skins/sam/container.css">
+<link rel="stylesheet" type="text/css" href="yui/datatable/assets/skins/sam/datatable.css">
<style type="text/css">
/* custom styles for this example */
#dt-example {width:45em;margin:0 auto;}
@@ -91,130 +95,130 @@
</div>
</div>
-<script type="text/javascript" src="yui/yuiloader/yuiloader.js"></script>
-<script type="text/javascript" src="./assets/js/data.js"></script>
-<script type="text/javascript">
-var loader = new YAHOO.util.YUILoader();
-loader.insert({
- require: ["fonts", "dragdrop", "container", "button", "datatable"],
- base: 'yui/',
- filter: 'debug',
- allowRollup: false,
- onSuccess: function() {
- YAHOO.example.ColumnShowHide = function() {
- // Define Columns
- var myColumnDefs = [
- {key:"address"},
- {key:"city"},
- {key:"state"},
- {key:"amount"},
- {key:"active"},
- {key:"colors"},
- {key:"last_login", formatter:YAHOO.widget.DataTable.formatDate}
- ];
-
- // Create DataSource
- var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.addresses);
- myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
- myDataSource.responseSchema = {
- fields: ["address","city","state","amount","active","colors",{key:"last_login",parser:"date"}]
- };
-
- // Create DataTable
- var myDataTable = new YAHOO.widget.DataTable("columnshowhide", myColumnDefs, myDataSource, {draggableColumns:true});
-
- // Shows dialog, creating one when necessary
- var newCols = true;
- var showDlg = function(e) {
- YAHOO.util.Event.stopEvent(e);
+<script src="yui/yahoo-dom-event/yahoo-dom-event.js"></script>
+<script src="yui/element/element.js"></script>
+<script src="yui/button/button.js"></script>
+<script src="yui/dragdrop/dragdrop.js"></script>
+<script src="yui/container/container.js"></script>
+<script src="yui/datasource/datasource.js"></script>
+<script src="yui/datatable/datatable.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
+<script type="text/javascript" src="assets/js/data.js"></script>
+<script>
+YAHOO.util.Event.onDOMReady(function () {
+ YAHOO.example.ColumnShowHide = (function() {
+ // Define Columns
+ var myColumnDefs = [
+ {key:"address"},
+ {key:"city"},
+ {key:"state"},
+ {key:"amount"},
+ {key:"active"},
+ {key:"colors"},
+ {key:"last_login", formatter:YAHOO.widget.DataTable.formatDate}
+ ];
- if(newCols) {
- // Populate Dialog
- // Using a template to create elements for the SimpleDialog
- var allColumns = myDataTable.getColumnSet().keys;
- var elPicker = YAHOO.util.Dom.get("dt-dlg-picker");
- var elTemplateCol = document.createElement("div");
- YAHOO.util.Dom.addClass(elTemplateCol, "dt-dlg-pickercol");
- var elTemplateKey = elTemplateCol.appendChild(document.createElement("span"));
- YAHOO.util.Dom.addClass(elTemplateKey, "dt-dlg-pickerkey");
- var elTemplateBtns = elTemplateCol.appendChild(document.createElement("span"));
- YAHOO.util.Dom.addClass(elTemplateBtns, "dt-dlg-pickerbtns");
- var onclickObj = {fn:handleButtonClick, obj:this, scope:false };
+ // Create DataSource
+ var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.addresses);
+ myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
+ myDataSource.responseSchema = {
+ fields: ["address","city","state","amount","active","colors",{key:"last_login",parser:"date"}]
+ };
+
+ // Create DataTable
+ var myDataTable = new YAHOO.widget.DataTable("columnshowhide", myColumnDefs, myDataSource, {draggableColumns:true});
- // Create one section in the SimpleDialog for each Column
- var elColumn, elKey, elButton, oButtonGrp;
- for(var i=0,l=allColumns.length;i<l;i++) {
- var oColumn = allColumns[i];
-
- // Use the template
- elColumn = elTemplateCol.cloneNode(true);
-
- // Write the Column key
- elKey = elColumn.firstChild;
- elKey.innerHTML = oColumn.getKey();
-
- // Create a ButtonGroup
- oButtonGrp = new YAHOO.widget.ButtonGroup({
- id: "buttongrp"+i,
- name: oColumn.getKey(),
- container: elKey.nextSibling
- });
- oButtonGrp.addButtons([
- { label: "Show", value: "Show", checked: ((!oColumn.hidden)), onclick: onclickObj},
- { label: "Hide", value: "Hide", checked: ((oColumn.hidden)), onclick: onclickObj}
- ]);
-
- elPicker.appendChild(elColumn);
- }
- newCols = false;
- }
- myDlg.show();
- };
- var hideDlg = function(e) {
- this.hide();
- };
- var handleButtonClick = function(e, oSelf) {
- var sKey = this.get("name");
- if(this.get("value") === "Hide") {
- // Hides a Column
- myDataTable.hideColumn(sKey);
- }
- else {
- // Shows a Column
- myDataTable.showColumn(sKey);
+ // Shows dialog, creating one when necessary
+ var newCols = true;
+ var showDlg = function(e) {
+ YAHOO.util.Event.stopEvent(e);
+
+ if(newCols) {
+ // Populate Dialog
+ // Using a template to create elements for the SimpleDialog
+ var allColumns = myDataTable.getColumnSet().keys;
+ var elPicker = YAHOO.util.Dom.get("dt-dlg-picker");
+ var elTemplateCol = document.createElement("div");
+ YAHOO.util.Dom.addClass(elTemplateCol, "dt-dlg-pickercol");
+ var elTemplateKey = elTemplateCol.appendChild(document.createElement("span"));
+ YAHOO.util.Dom.addClass(elTemplateKey, "dt-dlg-pickerkey");
+ var elTemplateBtns = elTemplateCol.appendChild(document.createElement("span"));
+ YAHOO.util.Dom.addClass(elTemplateBtns, "dt-dlg-pickerbtns");
+ var onclickObj = {fn:handleButtonClick, obj:this, scope:false };
+
+ // Create one section in the SimpleDialog for each Column
+ var elColumn, elKey, elButton, oButtonGrp;
+ for(var i=0,l=allColumns.length;i<l;i++) {
+ var oColumn = allColumns[i];
+
+ // Use the template
+ elColumn = elTemplateCol.cloneNode(true);
+
+ // Write the Column key
+ elKey = elColumn.firstChild;
+ elKey.innerHTML = oColumn.getKey();
+
+ // Create a ButtonGroup
+ oButtonGrp = new YAHOO.widget.ButtonGroup({
+ id: "buttongrp"+i,
+ name: oColumn.getKey(),
+ container: elKey.nextSibling
+ });
+ oButtonGrp.addButtons([
+ { label: "Show", value: "Show", checked: ((!oColumn.hidden)), onclick: onclickObj},
+ { label: "Hide", value: "Hide", checked: ((oColumn.hidden)), onclick: onclickObj}
+ ]);
+
+ elPicker.appendChild(elColumn);
}
- };
-
- // Create the SimpleDialog
- YAHOO.util.Dom.removeClass("dt-dlg", "inprogress");
- var myDlg = new YAHOO.widget.SimpleDialog("dt-dlg", {
- width: "30em",
- visible: false,
- modal: true,
- buttons: [
- { text:"Close", handler:hideDlg }
- ],
- fixedcenter: true,
- constrainToViewport: true
- });
- myDlg.render();
+ newCols = false;
+ }
+ myDlg.show();
+ };
+ var hideDlg = function(e) {
+ this.hide();
+ };
+ var handleButtonClick = function(e, oSelf) {
+ var sKey = this.get("name");
+ if(this.get("value") === "Hide") {
+ // Hides a Column
+ myDataTable.hideColumn(sKey);
+ }
+ else {
+ // Shows a Column
+ myDataTable.showColumn(sKey);
+ }
+ };
+
+ // Create the SimpleDialog
+ YAHOO.util.Dom.removeClass("dt-dlg", "inprogress");
+ var myDlg = new YAHOO.widget.SimpleDialog("dt-dlg", {
+ width: "30em",
+ visible: false,
+ modal: true,
+ buttons: [
+ { text:"Close", handler:hideDlg }
+ ],
+ fixedcenter: true,
+ constrainToViewport: true
+ });
+ myDlg.render();
- // Nulls out myDlg to force a new one to be created
- myDataTable.subscribe("columnReorderEvent", function(){
- newCols = true;
- YAHOO.util.Event.purgeElement("dt-dlg-picker", true);
- YAHOO.util.Dom.get("dt-dlg-picker").innerHTML = "";
- }, this, true);
-
- // Hook up the SimpleDialog to the link
- YAHOO.util.Event.addListener("dt-options-link", "click", showDlg, this, true);
-
- return {
- oDS: myDataSource,
- oDT: myDataTable
- };
- }();
- }
+ // Nulls out myDlg to force a new one to be created
+ myDataTable.subscribe("columnReorderEvent", function(){
+ newCols = true;
+ YAHOO.util.Event.purgeElement("dt-dlg-picker", true);
+ YAHOO.util.Dom.get("dt-dlg-picker").innerHTML = "";
+ }, this, true);
+
+ // Hook up the SimpleDialog to the link
+ YAHOO.util.Event.addListener("dt-options-link", "click", showDlg, this, true);
+
+ return {
+ oDS: myDataSource,
+ oDT: myDataTable
+ };
+ })();
});
</script>
</body>
View
1 yui2.8/examples/datatable/dt_complex_caja.html
@@ -28,6 +28,7 @@
<script type="text/javascript" src="yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_contextmenu_caja.html
@@ -27,6 +27,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_ddrows_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
3 yui2.8/examples/datatable/dt_dynamicdata_caja.html
@@ -28,6 +28,7 @@
<script type="text/javascript" src="yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
@@ -66,7 +67,7 @@
};
// DataSource instance
- var myDataSource = new YAHOO.util.DataSource("assets/php/json_proxy.php?");
+ var myDataSource = new YAHOO.util.DataSource("../yui2.8/examples/datatable/assets/php/json_proxy.php?");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
resultsList: "records",
View
517 yui2.8/examples/datatable/dt_dynamicfilter_caja.html
@@ -2,9 +2,13 @@
<html>
<head>
<!-- Combo-handled YUIS files:-->
-<link rel="stylesheet" type="text/css" href="yui/reset/reset.css">
-<link rel="stylesheet" type="text/css" href="yui/base/base.css">
-<link rel="stylesheet" type="text/css" href="yui/fonts/fonts.css">
+<link rel="stylesheet" type="text/css" href="yui/reset/reset-min.css">
+<link rel="stylesheet" type="text/css" href="yui/base/base-min.css">
+<link rel="stylesheet" type="text/css" href="yui/fonts/fonts-min.css">
+<link rel="stylesheet" type="text/css" href="yui/menu/assets/skins/sam/menu.css">
+<link rel="stylesheet" type="text/css" href="yui/button/assets/skins/sam/button.css">
+<link rel="stylesheet" type="text/css" href="yui/paginator/assets/skins/sam/paginator.css">
+<link rel="stylesheet" type="text/css" href="yui/datatable/assets/skins/sam/datatable.css">
<style type="text/css">
#doc {
@@ -241,258 +245,263 @@
</div>
</div>
-<!-- Combo-handled YUI JS files: -->
-<script type="text/javascript" src="yui/yuiloader/yuiloader.js"></script>
-<script type="text/javascript">
-var loader = new YAHOO.util.YUILoader();
-loader.insert({
- require: ["reset", "fonts", "menu", "button", "connection", "paginator", "datatable"],
- base: 'yui/',
- //filter: 'debug',
- allowRollup: false,
- onSuccess: function() {
- var Dom = YAHOO.util.Dom,
- Event = YAHOO.util.Event,
- XHRDataSource = YAHOO.util.XHRDataSource,
- Button = YAHOO.widget.Button,
- ButtonGroup = YAHOO.widget.ButtonGroup,
- DataTable = YAHOO.widget.DataTable,
- Paginator = YAHOO.widget.Paginator,
- CF; // CustomFilter
-
- /**
- * CF creates a paginated DataTable of United States population data
- * which can be filtered by state and/or by gender.
- */
- CF = {
- /**
- * The three state Menu Buttons are stored in this array.
- */
- menuButtons: [],
-
- /**
- * Filter settings (gender/states) are stored here. These
- * settings are then used to create the query string.
- */
- settings: {
- gender: 'Both',
- state1: '',
- state2: '',
- state3: ''
- },
-
- /**
- * Initialize all the Buttons/Menu Buttons and the DataTable.
- */
- init: function () {
- var myColumnDefs,
- myDataSource,
- myConfigs,
- genderButtons,
- // Get the three United States select menu elements (of course these start out as Input Elements)
- menuEls = Dom.getElementsByClassName('menuButton', 'input', 'stateSelectContainer');
-
- // Create the three Menu Buttons for the United States select menus.
- Dom.batch(menuEls, this.createMenuButton);
-
- // Create the Radio Buttons for selecting a gender filter.
- genderButtons = new ButtonGroup('genderRadioContainer');
-
- // Subscribe to the checked change event which enables us
- // to save the new setting and request new data for the DataTable.
- genderButtons.subscribe('checkedButtonChange', CF.genderButtonsCheckedChange);
-
- // Define the DataTable's columns
- myColumnDefs = [
- {key: "name", label: "Statistic Name"},
- {key: "state1", label: "State 1", formatter: 'number'},
- {key: "state2", label: "State 2", formatter: 'number'},
- {key: "state3", label: "State 3", formatter: 'number'}
- ];
-
- // Create a new DataSource
- myDataSource = new XHRDataSource("assets/php/dynamicfilter/data.php?");
-
- // data.php just happens to use JSON. Let the DataSource
- // know to expect JSON data.
- myDataSource.responseType = XHRDataSource.TYPE_JSON;
-
- // Define the structure of the DataSource data.
- myDataSource.responseSchema = {
- resultsList: "records",
- fields: [
- {key: "name"},
- {key: "state1"},
- {key: "state2"},
- {key: "state3"}
- ],
- metaFields: {
- totalRecords: "totalRecords"
- }
- };
-
- // Set the DataTable configuration
- myConfigs = {
- initialLoad: false,
- dynamicData: true,
- paginator: new Paginator({
- rowsPerPage: 25,
- containers: 'statePaginator'
- }),
-
- // This configuration item is what builds the query string
- // passed to the DataSource.
- generateRequest: this.requestBuilder
- };
-
- // Create the DataTable.
- myDataTable = new DataTable("stateTable", myColumnDefs, myDataSource, myConfigs);
-
- // Define an event handler that scoops up the totalRecords which we sent as
- // part of the JSON data. This is then used to tell the paginator the total records.
- // This happens after each time the DataTable is updated with new data.
- myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
- oPayload.totalRecords = oResponse.meta.totalRecords;
- return oPayload;
- }
-
- // Store the DataTable and DataSource for use elsewhere in this script.
- CF.myDataSource = myDataSource;
- CF.myDataTable = myDataTable;
-
- // Initial load
- CF.settings.state1 = "04000US01";
- CF.fireDT(false);
- },
-
- /**
- * Create a Menu Button. Once the Menu Button is created, attached a
- * selectedMenuItemChange event listener.
- * @param {Object} el
- * An HTML Input Element used in creating a Menu Button from markup.
- */
- createMenuButton: function (el) {
- var buttonKey = CF.menuButtons.length;
- CF.menuButtons[buttonKey] = new Button(el, {
- type: 'menu',
- menu: Dom.getNextSibling(el)
- });
- CF.menuButtons[buttonKey].on("selectedMenuItemChange", CF.menuButtonMenuItemChange);
- },
-
- /**
- * Handler for the selectedMenuItemChange event for the Menu Buttons.
- * This changes the label on the Menu buttons. Then, stores the value
- * of the new selected Menu Item in the CF.settings object. Each of the
- * Menu Buttons has an id that corresponds to one of the three United States
- * columns in the DataTable. This id is used as the key for the CF.settings.[STATE]
- * object. Lastly, fire a request for new data for the DataTable. Pass in a boolean
- * false so that the pagination settings are retained.
- * @param {Object} e
- */
- menuButtonMenuItemChange: function (e) {
- var oMenuItem = e.newValue;
- this.set("label", ("<em class=\"yui-button-label\">" +
- oMenuItem.cfg.getProperty("text") + "<\/em>"));
- CF.settings[this.get('id')] = oMenuItem.value;
- CF.fireDT(false);
- },
-
- /**
- * Handler for the checkedButtonChange event for the Gender Radio Buttons.
- * This stores the new value in the CF.settings.gender variable. Then
- * it fires a request for new DataTable data passing in a boolean true
- * so that the pagination is reset to the first recordOffset (which is 0).
- * @param {Object} e
- */
- genderButtonsCheckedChange: function(e) {
- CF.settings.gender = e.newValue.get('label');
- CF.fireDT(true);
- },
-
- /**
- * This method is passed into the DataTable's "generateRequest" configuration
- * setting overriding the default generateRequest function. This function puts
- * together a query string which is passed to the DataSource each time a new
- * set of data is requested. All of the custom sorting and filtering options
- * added in by this script are gathered up here and inserted into the
- * query string.
- * @param {Object} oState
- * @param {Object} oSelf
- * These parameters are explained in detail in DataTable's API
- * documentation. It's important to note that oState contains
- * a reference to the paginator and the pagination state and
- * the column sorting state as well.
- */
- requestBuilder: function (oState, oSelf) {
- /* We aren't initializing sort and dir variables. If you are
- using column sorting built into the DataTable, use this
- set of variable initializers.
- var sort, dir, startIndex, results; */
- var startIndex, results;
-
- oState = oState || {pagination: null, sortedBy: null};
-
- /* If using column sorting built into DataTable, these next two lines
- will properly set the current _sortedBy_ column and the _sortDirection_
- sort = (oState.sortedBy) ? oState.sortedBy.key : oSelf.getColumnSet().keys[0].getKey();
- dir = (oState.sortedBy && oState.sortedBy.dir === DataTable.CLASS_DESC) ? "desc" : "asc"; */
- startIndex = (oState.pagination) ? oState.pagination.recordOffset : 0;
- results = (oState.pagination) ? oState.pagination.rowsPerPage : null;
-
- return "&results=" + results +
- "&startIndex=" + startIndex +
- "&state[1]=" + CF.settings.state1 +
- "&state[2]=" + CF.settings.state2 +
- "&state[3]=" + CF.settings.state3 +
- "&gender=" + CF.settings.gender;
- },
-
- /**
- * This method is used to fire off a request for new data for the
- * DataTable from the DataSource. The new state of the DataTable,
- * after the request for new data, will be determined here.
- * @param {Boolean} resetRecordOffset
- */
- fireDT: function (resetRecordOffset) {
- var oState = CF.myDataTable.getState(),
- request,
- oCallback;
-
- /* We don't always want to reset the recordOffset.
- If we want the Paginator to be set to the first page,
- pass in a value of true to this method. Otherwise, pass in
- false or anything falsy and the paginator will remain at the
- page it was set at before.*/
- if (resetRecordOffset) {
- oState.pagination.recordOffset = 0;
+<script src="yui/yahoo-dom-event/yahoo-dom-event.js"></script>
+<script src="yui/container/container_core.js"></script>
+<script src="yui/menu/menu.js"></script>
+<script src="yui/element/element.js"></script>
+<script src="yui/button/button.js"></script>
+<script src="yui/connection/connection.js"></script>
+<script src="yui/dragdrop/dragdrop.js"></script>
+<script src="yui/paginator/paginator.js"></script>
+<script src="yui/datasource/datasource.js"></script>
+<script src="yui/datatable/datatable.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
+
+
+<script>
+YAHOO.util.Event.onDOMReady(function () {
+ var Dom = YAHOO.util.Dom,
+ Event = YAHOO.util.Event,
+ XHRDataSource = YAHOO.util.XHRDataSource,
+ Button = YAHOO.widget.Button,
+ ButtonGroup = YAHOO.widget.ButtonGroup,
+ DataTable = YAHOO.widget.DataTable,
+ Paginator = YAHOO.widget.Paginator,
+ CF; // CustomFilter
+
+ /**
+ * CF creates a paginated DataTable of United States population data
+ * which can be filtered by state and/or by gender.
+ */
+ CF = {
+ /**
+ * The three state Menu Buttons are stored in this array.
+ */
+ menuButtons: [],
+
+ /**
+ * Filter settings (gender/states) are stored here. These
+ * settings are then used to create the query string.
+ */
+ settings: {
+ gender: 'Both',
+ state1: '',
+ state2: '',
+ state3: ''
+ },
+
+ /**
+ * Initialize all the Buttons/Menu Buttons and the DataTable.
+ */
+ init: function () {
+ var myColumnDefs,
+ myDataSource,
+ myConfigs,
+ genderButtons,
+ // Get the three United States select menu elements (of course these start out as Input Elements)
+ menuEls = Dom.getElementsByClassName('menuButton', 'input', 'stateSelectContainer');
+
+ // Create the three Menu Buttons for the United States select menus.
+ Dom.batch(menuEls, this.createMenuButton);
+
+ // Create the Radio Buttons for selecting a gender filter.
+ genderButtons = new ButtonGroup('genderRadioContainer');
+
+ // Subscribe to the checked change event which enables us
+ // to save the new setting and request new data for the DataTable.
+ genderButtons.subscribe('checkedButtonChange', CF.genderButtonsCheckedChange);
+
+ // Define the DataTable's columns
+ myColumnDefs = [
+ {key: "name", label: "Statistic Name"},
+ {key: "state1", label: "State 1", formatter: 'number'},
+ {key: "state2", label: "State 2", formatter: 'number'},
+ {key: "state3", label: "State 3", formatter: 'number'}
+ ];
+
+ // Create a new DataSource
+ myDataSource = new XHRDataSource("../yui2.8/examples/datatable/assets/php/dynamicfilter/data.php?");
+
+ // data.php just happens to use JSON. Let the DataSource
+ // know to expect JSON data.
+ myDataSource.responseType = XHRDataSource.TYPE_JSON;
+
+ // Define the structure of the DataSource data.
+ myDataSource.responseSchema = {
+ resultsList: "records",
+ fields: [
+ {key: "name"},
+ {key: "state1"},
+ {key: "state2"},
+ {key: "state3"}
+ ],
+ metaFields: {
+ totalRecords: "totalRecords"
}
-
- /* If the column sort direction needs to be updated, that may be done here.
- It is beyond the scope of this example, but the DataTable::sortColumn() method
- has code that can be used with some modification. */
-
- /*
- This example uses onDataReturnSetRows because that method
- will clear out the old data in the DataTable, making way for
- the new data.*/
- oCallback = {
- success : CF.myDataTable.onDataReturnSetRows,
- failure : CF.myDataTable.onDataReturnSetRows,
- argument : oState,
- scope : CF.myDataTable
- };
-
- // Generate a query string
- request = CF.myDataTable.get("generateRequest")(oState, CF.myDataTable);
-
- // Fire off a request for new data.
- CF.myDataSource.sendRequest(request, oCallback);
- }
- };
-
- CF.init();
-}});
+ };
+
+ // Set the DataTable configuration
+ myConfigs = {
+ initialLoad: false,
+ dynamicData: true,
+ paginator: new Paginator({
+ rowsPerPage: 25,
+ containers: 'statePaginator'
+ }),
+
+ // This configuration item is what builds the query string
+ // passed to the DataSource.
+ generateRequest: this.requestBuilder
+ };
+
+ // Create the DataTable.
+ myDataTable = new DataTable("stateTable", myColumnDefs, myDataSource, myConfigs);
+
+ // Define an event handler that scoops up the totalRecords which we sent as
+ // part of the JSON data. This is then used to tell the paginator the total records.
+ // This happens after each time the DataTable is updated with new data.
+ myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
+ oPayload.totalRecords = oResponse.meta.totalRecords;
+ return oPayload;
+ }
+
+ // Store the DataTable and DataSource for use elsewhere in this script.
+ CF.myDataSource = myDataSource;
+ CF.myDataTable = myDataTable;
+
+ // Initial load
+ CF.settings.state1 = "04000US01";
+ CF.fireDT(false);
+ },
+
+ /**
+ * Create a Menu Button. Once the Menu Button is created, attached a
+ * selectedMenuItemChange event listener.
+ * @param {Object} el
+ * An HTML Input Element used in creating a Menu Button from markup.
+ */
+ createMenuButton: function (el) {
+ var buttonKey = CF.menuButtons.length;
+ CF.menuButtons[buttonKey] = new Button(el, {
+ type: 'menu',
+ menu: Dom.getNextSibling(el)
+ });
+ CF.menuButtons[buttonKey].on("selectedMenuItemChange", CF.menuButtonMenuItemChange);
+ },
+
+ /**
+ * Handler for the selectedMenuItemChange event for the Menu Buttons.
+ * This changes the label on the Menu buttons. Then, stores the value
+ * of the new selected Menu Item in the CF.settings object. Each of the
+ * Menu Buttons has an id that corresponds to one of the three United States
+ * columns in the DataTable. This id is used as the key for the CF.settings.[STATE]
+ * object. Lastly, fire a request for new data for the DataTable. Pass in a boolean
+ * false so that the pagination settings are retained.
+ * @param {Object} e
+ */
+ menuButtonMenuItemChange: function (e) {
+ var oMenuItem = e.newValue;
+ this.set("label", ("<em class=\"yui-button-label\">" +
+ oMenuItem.cfg.getProperty("text") + "<\/em>"));
+ CF.settings[this.get('id')] = oMenuItem.value;
+ CF.fireDT(false);
+ },
+
+ /**
+ * Handler for the checkedButtonChange event for the Gender Radio Buttons.
+ * This stores the new value in the CF.settings.gender variable. Then
+ * it fires a request for new DataTable data passing in a boolean true
+ * so that the pagination is reset to the first recordOffset (which is 0).
+ * @param {Object} e
+ */
+ genderButtonsCheckedChange: function(e) {
+ CF.settings.gender = e.newValue.get('label');
+ CF.fireDT(true);
+ },
+
+ /**
+ * This method is passed into the DataTable's "generateRequest" configuration
+ * setting overriding the default generateRequest function. This function puts
+ * together a query string which is passed to the DataSource each time a new
+ * set of data is requested. All of the custom sorting and filtering options
+ * added in by this script are gathered up here and inserted into the
+ * query string.
+ * @param {Object} oState
+ * @param {Object} oSelf
+ * These parameters are explained in detail in DataTable's API
+ * documentation. It's important to note that oState contains
+ * a reference to the paginator and the pagination state and
+ * the column sorting state as well.
+ */
+ requestBuilder: function (oState, oSelf) {
+ /* We aren't initializing sort and dir variables. If you are
+ using column sorting built into the DataTable, use this
+ set of variable initializers.
+ var sort, dir, startIndex, results; */
+ var startIndex, results;
+
+ oState = oState || {pagination: null, sortedBy: null};
+
+ /* If using column sorting built into DataTable, these next two lines
+ will properly set the current _sortedBy_ column and the _sortDirection_
+ sort = (oState.sortedBy) ? oState.sortedBy.key : oSelf.getColumnSet().keys[0].getKey();
+ dir = (oState.sortedBy && oState.sortedBy.dir === DataTable.CLASS_DESC) ? "desc" : "asc"; */
+ startIndex = (oState.pagination) ? oState.pagination.recordOffset : 0;
+ results = (oState.pagination) ? oState.pagination.rowsPerPage : null;
+
+ return "&results=" + results +
+ "&startIndex=" + startIndex +
+ "&state[1]=" + CF.settings.state1 +
+ "&state[2]=" + CF.settings.state2 +
+ "&state[3]=" + CF.settings.state3 +
+ "&gender=" + CF.settings.gender;
+ },
+
+ /**
+ * This method is used to fire off a request for new data for the
+ * DataTable from the DataSource. The new state of the DataTable,
+ * after the request for new data, will be determined here.
+ * @param {Boolean} resetRecordOffset
+ */
+ fireDT: function (resetRecordOffset) {
+ var oState = CF.myDataTable.getState(),
+ request,
+ oCallback;
+
+ /* We don't always want to reset the recordOffset.
+ If we want the Paginator to be set to the first page,
+ pass in a value of true to this method. Otherwise, pass in
+ false or anything falsy and the paginator will remain at the
+ page it was set at before.*/
+ if (resetRecordOffset) {
+ oState.pagination.recordOffset = 0;
+ }
+
+ /* If the column sort direction needs to be updated, that may be done here.
+ It is beyond the scope of this example, but the DataTable::sortColumn() method
+ has code that can be used with some modification. */
+
+ /*
+ This example uses onDataReturnSetRows because that method
+ will clear out the old data in the DataTable, making way for
+ the new data.*/
+ oCallback = {
+ success : CF.myDataTable.onDataReturnSetRows,
+ failure : CF.myDataTable.onDataReturnSetRows,
+ argument : oState,
+ scope : CF.myDataTable
+ };
+
+ // Generate a query string
+ request = CF.myDataTable.get("generateRequest")(oState, CF.myDataTable);
+
+ // Fire off a request for new data.
+ CF.myDataSource.sendRequest(request, oCallback);
+ }
+ };
+
+ CF.init();
+});
</script>
</body>
</html>
View
1 yui2.8/examples/datatable/dt_enhanced_caja.html
@@ -24,6 +24,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_fixedscroll_caja.html
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/button/button-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
187 yui2.8/examples/datatable/dt_formatting_caja.html
@@ -1,6 +1,8 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "#">
<html>
<head>
+<link rel="stylesheet" type="text/css" href="yui/fonts/fonts-min.css">
+<link rel="stylesheet" type="text/css" href="yui/datatable/assets/skins/sam/datatable.css">
<style type="text/css">
.yui-skin-sam .yui-dt tbody td.up {
background-color: #efe;
@@ -15,107 +17,106 @@
<h1>Custom Cell Formatting</h1>
<div id="formatting"></div>
-<script type="text/javascript" src="yui/yuiloader/yuiloader.js"></script>
-<script type="text/javascript" src="./assets/js/data.js"></script>
-<script type="text/javascript">
-var loader = new YAHOO.util.YUILoader();
-loader.insert({
- require: ["fonts", "datatable", "json"],
- filter: 'debug',
- base: 'yui/',
- onSuccess: function() {
- YAHOO.example.CustomFormatting = function() {
- // Define a custom formatter for the Column labeled "flag"
- // draws an up icon and adds class "up" to the cell liner to affect
- // a green background color if value of field3 is greater than 100.
- // Otherwise renders a down icon and assigns class "down", setting
- // the background color to red.
- var myCustomFormatter = function(elLiner, oRecord, oColumn, oData) {
- if(oRecord.getData("field3") > 100) {
- YAHOO.util.Dom.replaceClass(elLiner.parentNode, "down", "up");
- elLiner.innerHTML = '&nbsp;<img src="yui/datatable/assets/skins/sam/dt-arrow-up.png">';
- }
- else {
- YAHOO.util.Dom.replaceClass(elLiner.parentNode, "up","down");
- elLiner.innerHTML = '&nbsp;<img src="yui/datatable/assets/skins/sam/dt-arrow-dn.png">';
- }
- };
-
- // Add the custom formatter to the shortcuts
- YAHOO.widget.DataTable.Formatter.myCustom = myCustomFormatter;
+<script src="yui/yahoo-dom-event/yahoo-dom-event.js"></script>
+<script src="yui/element/element.js"></script>
+<script src="yui/datasource/datasource.js"></script>
+<script src="yui/datatable/datatable.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
+<script src="yui/json/json.js"></script>
+<script type="text/javascript" src="assets/js/data.js"></script>
+<script>
+YAHOO.util.Event.onDOMReady(function () {
+ YAHOO.example.CustomFormatting = (function() {
+ // Define a custom formatter for the Column labeled "flag"
+ // draws an up icon and adds class "up" to the cell liner to affect
+ // a green background color if value of field3 is greater than 100.
+ // Otherwise renders a down icon and assigns class "down", setting
+ // the background color to red.
+ var myCustomFormatter = function(elLiner, oRecord, oColumn, oData) {
+ if(oRecord.getData("field3") > 100) {
+ YAHOO.util.Dom.replaceClass(elLiner.parentNode, "down", "up");
+ elLiner.innerHTML = '&nbsp;<img src="yui/datatable/assets/skins/sam/dt-arrow-up.png">';
+ }
+ else {
+ YAHOO.util.Dom.replaceClass(elLiner.parentNode, "up","down");
+ elLiner.innerHTML = '&nbsp;<img src="yui/datatable/assets/skins/sam/dt-arrow-dn.png">';
+ }
+ };
+
+ // Add the custom formatter to the shortcuts
+ YAHOO.widget.DataTable.Formatter.myCustom = myCustomFormatter;
- // Override the built-in formatter
- YAHOO.widget.DataTable.formatEmail = function(elLiner, oRecord, oColumn, oData) {
- var user = oData;
- elLiner.innerHTML = "<a href=\"mailto:" + user + "@mycompany.com\">" + user + "</a>";
- };
-
+ // Override the built-in formatter
+ YAHOO.widget.DataTable.formatEmail = function(elLiner, oRecord, oColumn, oData) {
+ var user = oData;
+ elLiner.innerHTML = "<a href=\"mailto:" + user + "@mycompany.com\">" + user + "</a>";
+ };
+
- var myColumnDefs = [
- {key:"flag", formatter:"myCustom"}, // use custom shortcut
- {key:"radio", formatter:"radio"}, // use the built-in radio formatter
- {key:"check", formatter:"checkbox"}, // use the built-in checkbox formatter (shortcut)
- {key:"button", label:"Show record data", formatter:YAHOO.widget.DataTable.formatButton}, // use the built-in button formatter
- {key:"field1", formatter:"dropdown", dropdownOptions:["apples","bananas","cherries"],sortable:true},
- {key:"field2", sortable:true, formatter:"date"}, // use the built-in date formatter
- {key:"field3", sortable:true, formatter:"number"},
- {key:"field4", sortable:true, formatter:"currency"}, // use the built-in currency formatter
- {key:"field5", sortable:true, formatter:YAHOO.widget.DataTable.formatEmail}, // use the overridden email formatter
- {key:"field6", sortable:true, formatter:YAHOO.widget.DataTable.formatLink} // use the built-in link formatter
- ];
+ var myColumnDefs = [
+ {key:"flag", formatter:"myCustom"}, // use custom shortcut
+ {key:"radio", formatter:"radio"}, // use the built-in radio formatter
+ {key:"check", formatter:"checkbox"}, // use the built-in checkbox formatter (shortcut)
+ {key:"button", label:"Show record data", formatter:YAHOO.widget.DataTable.formatButton}, // use the built-in button formatter
+ {key:"field1", formatter:"dropdown", dropdownOptions:["apples","bananas","cherries"],sortable:true},
+ {key:"field2", sortable:true, formatter:"date"}, // use the built-in date formatter
+ {key:"field3", sortable:true, formatter:"number"},
+ {key:"field4", sortable:true, formatter:"currency"}, // use the built-in currency formatter
+ {key:"field5", sortable:true, formatter:YAHOO.widget.DataTable.formatEmail}, // use the overridden email formatter
+ {key:"field6", sortable:true, formatter:YAHOO.widget.DataTable.formatLink} // use the built-in link formatter
+ ];
- var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.multitypes);
- myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
- myDataSource.responseSchema = {
- resultsList: "items",
- // Use the parse methods to populate the RecordSet with the right data types
- fields: [
- {key:"field1", parser:"string"}, // point to the string parser
- {key:"field2", parser:"date"}, // point to the date parser
- {key:"field3", parser:"number"}, // point to the number parser
- {key:"field4", parser:"number"}, // point to the number parser
- {key:"field5"}, // this is already string data so no parser needed
- {key:"field6"} // this is already string data so no parser needed
- ]
- };
+ var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.multitypes);
+ myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
+ myDataSource.responseSchema = {
+ resultsList: "items",
+ // Use the parse methods to populate the RecordSet with the right data types
+ fields: [
+ {key:"field1", parser:"string"}, // point to the string parser
+ {key:"field2", parser:"date"}, // point to the date parser
+ {key:"field3", parser:"number"}, // point to the number parser
+ {key:"field4", parser:"number"}, // point to the number parser
+ {key:"field5"}, // this is already string data so no parser needed
+ {key:"field6"} // this is already string data so no parser needed
+ ]
+ };
- var myDataTable = new YAHOO.widget.DataTable("formatting", myColumnDefs, myDataSource);
+ var myDataTable = new YAHOO.widget.DataTable("formatting", myColumnDefs, myDataSource);
- var lastSelectedRadioRecord = null;
- myDataTable.subscribe("radioClickEvent", function(oArgs){
- if(lastSelectedRadioRecord) {
- lastSelectedRadioRecord.setData("radio",false);
- }
- var elRadio = oArgs.target;
- var oRecord = this.getRecord(elRadio);
- oRecord.setData("radio",true);
- lastSelectedRadioRecord = oRecord;
- var name = oRecord.getData("field5");
- });
+ var lastSelectedRadioRecord = null;
+ myDataTable.subscribe("radioClickEvent", function(oArgs){
+ if(lastSelectedRadioRecord) {
+ lastSelectedRadioRecord.setData("radio",false);
+ }
+ var elRadio = oArgs.target;
+ var oRecord = this.getRecord(elRadio);
+ oRecord.setData("radio",true);
+ lastSelectedRadioRecord = oRecord;
+ var name = oRecord.getData("field5");
+ });
- myDataTable.subscribe("checkboxClickEvent", function(oArgs){
- var elCheckbox = oArgs.target;
- var oRecord = this.getRecord(elCheckbox);
- oRecord.setData("check",elCheckbox.checked);
- });
+ myDataTable.subscribe("checkboxClickEvent", function(oArgs){
+ var elCheckbox = oArgs.target;
+ var oRecord = this.getRecord(elCheckbox);
+ oRecord.setData("check",elCheckbox.checked);
+ });
- myDataTable.subscribe("buttonClickEvent", function(oArgs){
- var oRecord = this.getRecord(oArgs.target);
- alert(YAHOO.lang.dump(oRecord.getData()));
- });
+ myDataTable.subscribe("buttonClickEvent", function(oArgs){
+ var oRecord = this.getRecord(oArgs.target);
+ alert(YAHOO.lang.dump(oRecord.getData()));
+ });
- myDataTable.subscribe("dropdownChangeEvent", function(oArgs){
- var elDropdown = oArgs.target;
- var oRecord = this.getRecord(elDropdown);
- oRecord.setData("field1",elDropdown.options[elDropdown.selectedIndex].value);
- });
-
- return {
- oDS: myDataSource,
- oDT: myDataTable
- };
- }();
- }
+ myDataTable.subscribe("dropdownChangeEvent", function(oArgs){
+ var elDropdown = oArgs.target;
+ var oRecord = this.getRecord(elDropdown);
+ oRecord.setData("field1",elDropdown.options[elDropdown.selectedIndex].value);
+ });
+
+ return {
+ oDS: myDataSource,
+ oDT: myDataTable
+ };
+ })();
});
</script>
View
1 yui2.8/examples/datatable/dt_highlighting_caja.html
@@ -24,6 +24,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_localfilter_caja.html
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/paginator/paginator-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_nestedheaders_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_polling_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
3 yui2.8/examples/datatable/dt_row_coloring_caja.html
@@ -23,7 +23,8 @@
<script type="text/javascript" src="yui/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
-<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/datatable/datatable.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_rowdatamod_caja.html
@@ -29,6 +29,7 @@
<script type="text/javascript" src="yui/dragdrop/dragdrop-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
5 yui2.8/examples/datatable/dt_rowexp_basic_caja.html
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
@@ -60,7 +61,7 @@
<body class="yui-skin-sam">
- <cite class="byline">DataTable Row Expansion was developed by <a href='http://standardpixel.com'>Eric Gelinas</a>. This was originally a concept for <a href='http://apt.yahoo.com/'>Yahoo! APT</a> by Ryan Leffel with designs by Edward Zee.</cite>
+ <cite class="byline">DataTable Row Expansion was developed by <a href='#'>Eric Gelinas</a>. This was originally a concept for <a href='#/'>Yahoo! APT</a> by Ryan Leffel with designs by Edward Zee.</cite>
<h1>Row Expansion</h1>
@@ -469,7 +470,7 @@
* to query the Flickr web service.
*
**/
- var myDataSource = new YAHOO.util.DataSource('assets/php/yql_proxy.php?q=select%20*%20from%20flickr.photos.interestingness(20)&format=json');
+ var myDataSource = new YAHOO.util.DataSource('../yui2.8/examples/datatable/assets/php/yql_proxy.php?q=select%20*%20from%20flickr.photos.interestingness(20)&format=json');
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.connXhrMode = "queueRequests";
myDataSource.responseSchema = {
View
1 yui2.8/examples/datatable/dt_rowselect_caja.html
@@ -24,6 +24,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_tabview_caja.html
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/tabview/tabview-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
3 yui2.8/examples/datatable/dt_xhrjson_caja.html
@@ -26,6 +26,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
@@ -61,7 +62,7 @@
{key:"Rating.AverageRating", label:"Rating", formatter:YAHOO.widget.DataTable.formatNumber, sortable:true}
];
- var myDataSource = new YAHOO.util.DataSource("assets/php/ylocal_proxy.php?");
+ var myDataSource = new YAHOO.util.DataSource("../yui2.8/examples/datatable/assets/php/ylocal_proxy.php?");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.connXhrMode = "queueRequests";
myDataSource.responseSchema = {
View
1 yui2.8/examples/datatable/dt_xhrpostxml_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_xhrtext_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--begin custom header content for this example-->
View
1 yui2.8/examples/datatable/dt_xpath_caja.html
@@ -25,6 +25,7 @@
<script type="text/javascript" src="yui/element/element-min.js"></script>
<script type="text/javascript" src="yui/datasource/datasource-min.js"></script>
<script type="text/javascript" src="yui/datatable/datatable-min.js"></script>
+<script type="text/javascript" src="yui/workaround.js"></script>
<!--there is no custom header content for this example-->

0 comments on commit 97d0332

Please sign in to comment.