Loading ...
Sorry, an error occurred while loading the content.
 

DataTable code fine under 2.5.2 but shows "Data Error" under 2.7.0

Expand Messages
  • nbeney
    Hi, I am trying to migrate from YUI 2.5.2 to 2.7.0 and I am getting an error I cannot figure out. I have a DataTable with an XHRDataSource getting JSON data.
    Message 1 of 4 , Jun 30, 2009
      Hi,

      I am trying to migrate from YUI 2.5.2 to 2.7.0 and I am getting an error I cannot figure out. I have a DataTable with an XHRDataSource getting JSON data. The code works fine under 2.5.2 but I get "Data Error" when I try under 2.7.0. The error also occurs if the JSON list is empty.

      For 2.7.0, I have used almost the same imports as this YUI web site example: http://developer.yahoo.com/yui/examples/datatable/dt_xhrjson_clean.html.

      In the console, get:

      ...
      15:47:26 (29ms): DataSource: JSON data could not be parsed: [{amount => 4, title => A Book About Nothing, id => po-0167, quantity => 1}, {amount => 12.12345, title => The Meaning of Life, id => po-0783, quantity => 5}, {amount => 1.25, title => This Book Was Meant to Be Read Aloud, id => po-0297, quantity => 12}, {amount => 3.5, title => Read Me Twice, id => po-1482, quantity => 6}]
      ...

      But the JSON data seems valid according to http://www.jsonlint.com. I have also tried to set the mime type to text/plain instead of text/html but it didn't help.

      Thank you for your consideration.

      Nicolas

      //------------------------------------------------
      // 2.5.2 imports ===> OK
      //------------------------------------------------

      <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/fonts/fonts-min.css" />
      29<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/datatable/assets/skins/sam/datatable.css" />
      30<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/calendar/assets/skins/sam/calendar.css" />
      31<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/yahoo-dom-event/yahoo-dom-event.js"></script>
      32<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/connection/connection-min.js"></script>
      33<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/json/json-min.js"></script>
      34<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/element/element-beta-min.js"></script>
      35<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/datasource/datasource-beta.js"></script>
      36<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/datatable/datatable-beta-min.js"></script>
      37<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/calendar/calendar-min.js"></script>

      //------------------------------------------------
      // 2.7.0 imports ===> Data Error
      //------------------------------------------------

      <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/fonts/fonts-debug.css" />
      <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/datatable/assets/skins/sam/datatable.css" />
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-debug.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/json/json-debug.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/element/element-debug.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/datasource/datasource-debug.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/datatable/datatable-debug.js"></script>
      <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/logger/logger-debug.js"></script>

      <script type="text/javascript">
      YAHOO.widget.Logger.enableBrowserConsole();
      </script>

      //------------------------------------------------
      // Code
      //------------------------------------------------

      <html>

      <head profile="http://www.w3.org/2005/10/profile">

      <!-- 2.5.2 or 2.7.0 imports here -->

      <script type="text/javascript">
      YAHOO.util.Event.addListener(window, "load", function() {
      var myColumnDefs = [
      {key: "id", sortable: true, resizeable: true},
      {key: "quantity", sortable: true, resizeable: true, formatter: YAHOO.widget.DataTable.formatNumber},
      {key: "amount", sortable: true, resizeable: true, formatter: YAHOO.widget.DataTable.formatCurrency},
      {key: "title", sortable: true, resizeable: true}
      ];
      myDataSource = new YAHOO.util.DataSource("/Portal/test-table-data", {
      responseType: YAHOO.util.DataSource.TYPE_JSON,
      responseSchema: {
      fields: [
      {key: "id", parser: YAHOO.util.DataSource.parseString},
      {key: "quantity", parser: YAHOO.util.DataSource.parseNumber},
      {key: "amount", parser: YAHOO.util.DataSource.parseNumber},
      {key: "title", parser: YAHOO.util.DataSource.parseString}
      ]
      }
      });
      var myDataTable = new YAHOO.widget.DataTable("myTable", myColumnDefs, myDataSource, {initialRequest: ""});
      });
      </script>

      </head>

      <body class="yui-skin-sam">

      <div id="myTable"/>

      </body>

      </html>

      //------------------------------------------------
      // JSON data
      //------------------------------------------------

      [
      {
      "amount": 4,
      "title": "A Book About Nothing",
      "id": "po-0167",
      "quantity": 1
      },
      {
      "amount": 12.12345,
      "title": "The Meaning of Life",
      "id": "po-0783",
      "quantity": 5
      }
      ]

      //------------------------------------------------
      // Console output
      //------------------------------------------------

      15:47:26 (0ms): global: Logger output to the function console.log() has been enabled.
      15:47:26 (31ms): DataSource: DataSource initialized
      15:47:26 (4ms): ColumnSet: ColumnSet initialized
      15:47:26 (3ms): RecordSet: RecordSet initialized
      15:47:26 (3ms): AttributeProvider: element not found
      15:47:26 (3ms): Attribute: setValue element, myTable failed: read only
      15:47:26 (12ms): DataTable: TH cells for 4 keys created
      15:47:26 (3ms): DataTable: Could not find DragDrop for resizeable Columns
      15:47:26 (4ms): DataTable: DataTable showing message: Loading...
      15:47:26 (4ms): DataSource: Making connection to live data for ""
      15:47:26 (2ms): Connection: XHR object created for transaction 0
      15:47:26 (4ms): Connection: Initialize transaction header X-Request-Header to XMLHttpRequest.
      15:47:26 (2ms): Connection: Default HTTP header X-Requested-With set with value of XMLHttpRequest
      GET http://cbdevsx3:9090/Portal/test-table-data
      http://cbdevsx3:9090/Portal/test-table-data

      200 OK
      101ms connecti...-debug.js (line 551)
      ParamsHeadersPostPutResponseCache
      Response Headers
      Date

      Tue, 30 Jun 2009 14:47:24 GMT

      Server

      WSGIServer/0.1 Python/2.5.2

      Content-Type

      text/html; charset=utf-8

      Request Headers
      Host

      cbdevsx3:9090

      User-Agent

      Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.9.0.11) Gecko/2009060215 Firefox/3.0.11 (.NET CLR
      3.5.30729)

      Accept

      text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

      Accept-Language

      en-gb,en;q=0.5

      Accept-Encoding

      gzip,deflate

      Accept-Charset

      ISO-8859-1,utf-8;q=0.7,*;q=0.7

      Keep-Alive

      300

      Connection

      keep-alive

      X-Requested-With

      XMLHttpRequest

      Referer

      http://cbdevsx3:9090/Portal/test-table-remote

      [{"amount": 4, "title": "A Book About Nothing", "id": "po-0167", "quantity": 1}, {"amount": 12.12345
      , "title": "The Meaning of Life", "id": "po-0783", "quantity": 5}, {"amount": 1.25, "title": "This Book
      Was Meant to Be Read Aloud", "id": "po-0297", "quantity": 12}, {"amount": 3.5, "title": "Read Me Twice"
      , "id": "po-1482", "quantity": 6}]

      15:47:26 (9ms): Connection: Transaction 0 sent.
      15:47:26 (145ms): DataSource: Received live data response for ""
      15:47:26 (29ms): DataSource: JSON data could not be parsed: [{amount => 4, title => A Book About Nothing, id => po-0167, quantity => 1}, {amount => 12.12345, title => The Meaning of Life, id => po-0783, quantity => 5}, {amount => 1.25, title => This Book Was Meant to Be Read Aloud, id => po-0297, quantity => 12}, {amount => 3.5, title => Read Me Twice, id => po-1482, quantity => 6}]
      15:47:26 (4ms): DataSource: Null data
      15:47:26 (3ms): DataTable: DataTable showing message: Data error.
      15:47:26 (2ms): Connection: Success callback with scope. HTTP code is 200
      15:47:26 (3ms): Connection: Connection object for transaction 0 destroyed.
    • Satyam
      I can t say for sure but there was a bug, which I believe had been fixed, that the DataSource would fail with an empty resultsList. I would try a couple of
      Message 2 of 4 , Jun 30, 2009
        I can't say for sure but there was a bug, which I believe had been
        fixed, that the DataSource would fail with an empty resultsList. I
        would try a couple of things. First, try explicitly setting resultsList
        to an empty string: resultsList:"" then, if you have access to the
        server and can do it without spoiling any other application, enclose
        your JSON data in something:

        {"results": [

        {
        "amount": 4,
        "title": "A Book About Nothing",
        "id": "po-0167",
        "quantity": 1
        },
        {
        "amount": 12.12345,
        "title": "The Meaning of Life",
        "id": "po-0783",
        "quantity": 5
        }
        ]}


        and set the resultsList accordingly:

        resultsList:"results"

        If you have no access to the server, you can also add this little piece
        of code right after you create the DataSource instance:

        myDataSource.doBeforeCallback = function (| oRequest , oFullResponse ,
        oParsedResponse , oCallback ) {
        return {results: oParsedResponse};
        };

        ||and set the resultsList:"results"

        If any of this works, it would be great if you could check the bug
        reports for DataTable and see what the status is and add any information
        you find out from this tests.

        Satyam

        ||||

        |

        nbeney escribió:
        > Hi,
        >
        > I am trying to migrate from YUI 2.5.2 to 2.7.0 and I am getting an error I cannot figure out. I have a DataTable with an XHRDataSource getting JSON data. The code works fine under 2.5.2 but I get "Data Error" when I try under 2.7.0. The error also occurs if the JSON list is empty.
        >
        > For 2.7.0, I have used almost the same imports as this YUI web site example: http://developer.yahoo.com/yui/examples/datatable/dt_xhrjson_clean.html.
        >
        > In the console, get:
        >
        > ...
        > 15:47:26 (29ms): DataSource: JSON data could not be parsed: [{amount => 4, title => A Book About Nothing, id => po-0167, quantity => 1}, {amount => 12.12345, title => The Meaning of Life, id => po-0783, quantity => 5}, {amount => 1.25, title => This Book Was Meant to Be Read Aloud, id => po-0297, quantity => 12}, {amount => 3.5, title => Read Me Twice, id => po-1482, quantity => 6}]
        > ...
        >
        > But the JSON data seems valid according to http://www.jsonlint.com. I have also tried to set the mime type to text/plain instead of text/html but it didn't help.
        >
        > Thank you for your consideration.
        >
        > Nicolas
        >
        > //------------------------------------------------
        > // 2.5.2 imports ===> OK
        > //------------------------------------------------
        >
        > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/fonts/fonts-min.css" />
        > 29<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/datatable/assets/skins/sam/datatable.css" />
        > 30<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/calendar/assets/skins/sam/calendar.css" />
        > 31<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        > 32<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/connection/connection-min.js"></script>
        > 33<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/json/json-min.js"></script>
        > 34<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/element/element-beta-min.js"></script>
        > 35<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/datasource/datasource-beta.js"></script>
        > 36<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/datatable/datatable-beta-min.js"></script>
        > 37<script type="text/javascript" src="http://yui.yahooapis.com/2.5.2/build/calendar/calendar-min.js"></script>
        >
        > //------------------------------------------------
        > // 2.7.0 imports ===> Data Error
        > //------------------------------------------------
        >
        > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/fonts/fonts-debug.css" />
        > <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.7.0/build/datatable/assets/skins/sam/datatable.css" />
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-debug.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/json/json-debug.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/element/element-debug.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/datasource/datasource-debug.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/datatable/datatable-debug.js"></script>
        > <script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/logger/logger-debug.js"></script>
        >
        > <script type="text/javascript">
        > YAHOO.widget.Logger.enableBrowserConsole();
        > </script>
        >
        > //------------------------------------------------
        > // Code
        > //------------------------------------------------
        >
        > <html>
        >
        > <head profile="http://www.w3.org/2005/10/profile">
        >
        > <!-- 2.5.2 or 2.7.0 imports here -->
        >
        > <script type="text/javascript">
        > YAHOO.util.Event.addListener(window, "load", function() {
        > var myColumnDefs = [
        > {key: "id", sortable: true, resizeable: true},
        > {key: "quantity", sortable: true, resizeable: true, formatter: YAHOO.widget.DataTable.formatNumber},
        > {key: "amount", sortable: true, resizeable: true, formatter: YAHOO.widget.DataTable.formatCurrency},
        > {key: "title", sortable: true, resizeable: true}
        > ];
        > myDataSource = new YAHOO.util.DataSource("/Portal/test-table-data", {
        > responseType: YAHOO.util.DataSource.TYPE_JSON,
        > responseSchema: {
        > fields: [
        > {key: "id", parser: YAHOO.util.DataSource.parseString},
        > {key: "quantity", parser: YAHOO.util.DataSource.parseNumber},
        > {key: "amount", parser: YAHOO.util.DataSource.parseNumber},
        > {key: "title", parser: YAHOO.util.DataSource.parseString}
        > ]
        > }
        > });
        > var myDataTable = new YAHOO.widget.DataTable("myTable", myColumnDefs, myDataSource, {initialRequest: ""});
        > });
        > </script>
        >
        > </head>
        >
        > <body class="yui-skin-sam">
        >
        > <div id="myTable"/>
        >
        > </body>
        >
        > </html>
        >
        > //------------------------------------------------
        > // JSON data
        > //------------------------------------------------
        >
        > [
        > {
        > "amount": 4,
        > "title": "A Book About Nothing",
        > "id": "po-0167",
        > "quantity": 1
        > },
        > {
        > "amount": 12.12345,
        > "title": "The Meaning of Life",
        > "id": "po-0783",
        > "quantity": 5
        > }
        > ]
        >
        > //------------------------------------------------
        > // Console output
        > //------------------------------------------------
        >
        > 15:47:26 (0ms): global: Logger output to the function console.log() has been enabled.
        > 15:47:26 (31ms): DataSource: DataSource initialized
        > 15:47:26 (4ms): ColumnSet: ColumnSet initialized
        > 15:47:26 (3ms): RecordSet: RecordSet initialized
        > 15:47:26 (3ms): AttributeProvider: element not found
        > 15:47:26 (3ms): Attribute: setValue element, myTable failed: read only
        > 15:47:26 (12ms): DataTable: TH cells for 4 keys created
        > 15:47:26 (3ms): DataTable: Could not find DragDrop for resizeable Columns
        > 15:47:26 (4ms): DataTable: DataTable showing message: Loading...
        > 15:47:26 (4ms): DataSource: Making connection to live data for ""
        > 15:47:26 (2ms): Connection: XHR object created for transaction 0
        > 15:47:26 (4ms): Connection: Initialize transaction header X-Request-Header to XMLHttpRequest.
        > 15:47:26 (2ms): Connection: Default HTTP header X-Requested-With set with value of XMLHttpRequest
        > GET http://cbdevsx3:9090/Portal/test-table-data
        > http://cbdevsx3:9090/Portal/test-table-data
        >
        > 200 OK
        > 101ms connecti...-debug.js (line 551)
        > ParamsHeadersPostPutResponseCache
        > Response Headers
        > Date
        >
        > Tue, 30 Jun 2009 14:47:24 GMT
        >
        > Server
        >
        > WSGIServer/0.1 Python/2.5.2
        >
        > Content-Type
        >
        > text/html; charset=utf-8
        >
        > Request Headers
        > Host
        >
        > cbdevsx3:9090
        >
        > User-Agent
        >
        > Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.9.0.11) Gecko/2009060215 Firefox/3.0.11 (.NET CLR
        > 3.5.30729)
        >
        > Accept
        >
        > text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
        >
        > Accept-Language
        >
        > en-gb,en;q=0.5
        >
        > Accept-Encoding
        >
        > gzip,deflate
        >
        > Accept-Charset
        >
        > ISO-8859-1,utf-8;q=0.7,*;q=0.7
        >
        > Keep-Alive
        >
        > 300
        >
        > Connection
        >
        > keep-alive
        >
        > X-Requested-With
        >
        > XMLHttpRequest
        >
        > Referer
        >
        > http://cbdevsx3:9090/Portal/test-table-remote
        >
        > [{"amount": 4, "title": "A Book About Nothing", "id": "po-0167", "quantity": 1}, {"amount": 12.12345
        > , "title": "The Meaning of Life", "id": "po-0783", "quantity": 5}, {"amount": 1.25, "title": "This Book
        > Was Meant to Be Read Aloud", "id": "po-0297", "quantity": 12}, {"amount": 3.5, "title": "Read Me Twice"
        > , "id": "po-1482", "quantity": 6}]
        >
        > 15:47:26 (9ms): Connection: Transaction 0 sent.
        > 15:47:26 (145ms): DataSource: Received live data response for ""
        > 15:47:26 (29ms): DataSource: JSON data could not be parsed: [{amount => 4, title => A Book About Nothing, id => po-0167, quantity => 1}, {amount => 12.12345, title => The Meaning of Life, id => po-0783, quantity => 5}, {amount => 1.25, title => This Book Was Meant to Be Read Aloud, id => po-0297, quantity => 12}, {amount => 3.5, title => Read Me Twice, id => po-1482, quantity => 6}]
        > 15:47:26 (4ms): DataSource: Null data
        > 15:47:26 (3ms): DataTable: DataTable showing message: Data error.
        > 15:47:26 (2ms): Connection: Success callback with scope. HTTP code is 200
        > 15:47:26 (3ms): Connection: Connection object for transaction 0 destroyed.
        >
        >
        >
        > ------------------------------------
        >
        > Yahoo! Groups Links
        >
        >
        >
        > ------------------------------------------------------------------------
        >
        >
        > No virus found in this incoming message.
        > Checked by AVG - www.avg.com
        > Version: 8.5.375 / Virus Database: 270.13.0/2209 - Release Date: 06/29/09 14:43:00
        >
        >
      • Nicolas Beney
        Dear Satyam, Using resultsList: didn t work but resultsList: results and wrapping my list in { results : [ ... ] } did. Thank you so much for your help.
        Message 3 of 4 , Jun 30, 2009
          Dear Satyam,

          Using resultsList: "" didn't work but resultsList: "results" and
          wrapping my list in { "results": [ ... ] } did.

          Thank you so much for your help.

          Nicolas

          PS: Where is the bug tracking page for YUI?
        • Satyam
          I ve just searched for it: http://yuilibrary.com/projects/yui2/ticket/2149648 look at the last comment, it says: The component owner has reviewed this
          Message 4 of 4 , Jun 30, 2009
            I've just searched for it:

            http://yuilibrary.com/projects/yui2/ticket/2149648

            look at the last comment, it says:

            <quote>The component owner has reviewed this issue and provided the
            following feedback:

            I'm still not convinced that this is worth fixing. As I posted to the forum,
            declaring responseType as TYPE_JSARRAY and defining
            responseSchema.fields will
            give implementers what they need. There is a lot of parsing logic handled by
            the JSON parsing functionality that I don't want to overload with array
            parsing
            functionality.

            The change in behavior is regrettable but with proper documentation, I
            think it
            is the right thing to do.</quote>

            What I am not sure is that the "proper documentation" was ever written.
            Perhaps in the DataSource user guide? If such documentation is not
            available, I guess you might reopen the ticket. Perhaps it is, but in
            some obscure corner of the page. Anyway, calling it an array when it is
            a JSON message doesn't sound good to me.

            Satyam



            Nicolas Beney escribió:
            > Dear Satyam,
            >
            > Using resultsList: "" didn't work but resultsList: "results" and
            > wrapping my list in { "results": [ ... ] } did.
            >
            > Thank you so much for your help.
            >
            > Nicolas
            >
            > PS: Where is the bug tracking page for YUI?
            >
            >
            > ------------------------------------
            >
            > Yahoo! Groups Links
            >
            >
            >
            > ------------------------------------------------------------------------
            >
            >
            > No virus found in this incoming message.
            > Checked by AVG - www.avg.com
            > Version: 8.5.375 / Virus Database: 270.13.1/2211 - Release Date: 06/30/09 11:37:00
            >
            >
          Your message has been successfully submitted and would be delivered to recipients shortly.