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

Datatable Problem : datasource has no properties

Expand Messages
  • sudermatt
    I tried to keep it really simple for a scrollable datatable. I m getting a datasource has no properties error on the line this.myDataSource.responseType....
    Message 1 of 6 , Sep 1, 2007
    • 0 Attachment
      I tried to keep it really simple for a scrollable datatable.

      I'm getting a "datasource has no properties" error on the line
      this.myDataSource.responseType.... line

      Here is the complete page code:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" >
      <head>
      <title>Untitled Page</title>

      <!--CSS file (default YUI Sam Skin) -->
      <link type="text/css" rel="stylesheet"
      href="http://yui.yahooapis.com/2.3.0/build/datatable/assets/skins/sam/datatable.css">

      <!-- Dependencies -->
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/element/element-beta-min.js"></script>
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/datasource/datasource-beta-min.js"></script>

      <!-- OPTIONAL: External JSON parser from http://www.json.org/ (enables
      JSON validation) -->
      <script type="text/javascript" src="http://www.json.org/json.js"></script>

      <!-- OPTIONAL: Connection (enables XHR) -->
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/connection/connection-min.js"></script>

      <!-- OPTIONAL: Drag Drop (enables resizeable columns) -->
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/dragdrop/dragdrop-min.js"></script>

      <!-- OPTIONAL: Calendar (enables calendar editors) -->
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/calendar/calendar-min.js"></script>

      <!-- Source files -->
      <script type="text/javascript"
      src="http://yui.yahooapis.com/2.3.0/build/datatable/datatable-beta-min.js"></script>

      <style type="text/css">
      #myContainer{
      height:20em;
      }
      /* customized css for scrolling */
      .yui-dt-scrollable {
      width:30em; /* SET OVERALL WIDTH HERE for ie (make sure columns
      add up to this total) */
      height:30em; /* SET HEIGHT HERE for ie */
      }
      .yui-dt-scrollbody {
      height:30em; /* SET HEIGHT HERE for non-ie */
      *height:auto; /* for ie */
      }
      .yui-dt-scrollable thead {
      background:#696969; /*dark gray*/ /* ie needs a background color */
      color:#fff;
      }

      /* SET WIDTHS FOR EACH TH TO HELP ALIGN COLUMNS */
      /* IF ALL COLS CAN BE SAME WIDTH USE THIS:
      .yui-dt-scrollable th, .yui-dt-scrollbody td {
      width:20em;
      }*/
      /* OTHERWISE SET EACH COL WIDTH EXPLICITLY:*/
      .yui-dt-col-one {
      width:10em;
      }
      .yui-dt-col-two {
      width:20em;
      }
      </style>

      <script language=javascript>
      YAHOO.example.UserPoints = [
      {UserID:218,UserName:"KellyG",AvgPoints:0.29475,NumPred:4},
      {UserID:221,UserName:"laughlind55",AvgPoints:0.363375,NumPred:4},
      {UserID:211,UserName:"Bronco85",AvgPoints:0.43125,NumPred:6},
      {UserID:224,UserName:"macnut",AvgPoints:0.4329,NumPred:5},
      {UserID:49,UserName:"BroncoBailey",AvgPoints:0.4365,NumPred:4},
      {UserID:54,UserName:"NEZ4EVER",AvgPoints:0.4955,NumPred:5},
      {UserID:235,UserName:"admiral",AvgPoints:0.548833,NumPred:3},
      {UserID:29,UserName:"boiseSt8Rules",AvgPoints:0.560389,NumPred:18},
      {UserID:231,UserName:"bsuwillwin",AvgPoints:0.675367,NumPred:15},
      {UserID:219,UserName:"hkhaole",AvgPoints:0.800106,NumPred:33},
      {UserID:33,UserName:"BroncoJunky",AvgPoints:0.810792,NumPred:12},
      {UserID:201,UserName:"DAcruSHA",AvgPoints:0.828389,NumPred:9},
      {UserID:229,UserName:"BroncNuts",AvgPoints:0.886561,NumPred:33},
      {UserID:213,UserName:"Bulldogmike",AvgPoints:0.887912,NumPred:34},
      {UserID:236,UserName:"terrapin999",AvgPoints:1.03925,NumPred:4},
      {UserID:228,UserName:"BroncoBob",AvgPoints:1.072556,NumPred:9},
      {UserID:226,UserName:"surus",AvgPoints:1.082333,NumPred:3},
      {UserID:0,UserName:"",AvgPoints:0,NumPred:0}
      ];


      </script>

      </head>
      <body class=" yui-skin-sam">
      <div id="myContainer">
      </div>
      huh

      <script type="text/javascript">


      YAHOO.util.Event.addListener(window, "load", function() {
      YAHOO.example.Scrolling = new function() {
      var myColumnDefs = [
      {key:"UserID", label:"User ID"},
      {key:"UserName", label:"User Name"},
      {key:"AvgPoints", label:"Avg. Points"},
      {key:"NumPred", label:"Num. Pred."}
      ];

      var myDataSource = new
      YAHOO.util.DataSource(YAHOO.example.UserPoints);
      this.myDataSource.responseType =
      YAHOO.util.DataSource.TYPE_JSARRAY;
      myDataSource.responseSchema = {
      fields: ["UserID","UserName","AvgPoints","NumPred"]
      };

      this.myDataTable = new YAHOO.widget.DataTable("myContainer",
      myColumnDefs,
      this.myDataSource, {scrollable:true});
      };
      });
      </script>

      </body>
      </html>
    • Gopal Venkatesan
      ... ^^^^ That should have been this.myDataSource . Eric Miraglia has written an excellent article explaining the module pattern[1] on YUIBlog[2]. [1]
      Message 2 of 6 , Sep 1, 2007
      • 0 Attachment
        On Sun, Sep 02, 2007 at 02:35:09AM -0000, sudermatt wrote:
        > I tried to keep it really simple for a scrollable datatable.
        >
        > I'm getting a "datasource has no properties" error on the line
        > this.myDataSource.responseType.... line
        >
        > Here is the complete page code:
        >
        > var myDataSource = new

        ^^^^

        That should have been "this.myDataSource".

        Eric Miraglia has written an excellent article explaining the
        module pattern[1] on YUIBlog[2].

        [1] http://yuiblog.com/blog/2007/06/12/module-pattern/
        [2] http://yuiblog.com/blog/

        --
        Gopal Venkatesan

        http://gopalarathnam.com/weblog/
      • Satyam
        Whatever you declare as var whatever within the function is not available through this . Either declar it as this.myDataSource or drop the this when
        Message 3 of 6 , Sep 2, 2007
        • 0 Attachment
          Whatever you declare as 'var whatever' within the function is not available
          through 'this'. Either declar it as 'this.myDataSource' or drop the 'this'
          when accessing it. I suggest the later since that variable won't be used
          ever after and it's not worth it to keep it available.

          Satyam



          ----- Original Message -----
          From: "sudermatt" <sudermatt@...>
          To: <ydn-javascript@yahoogroups.com>
          Sent: Sunday, September 02, 2007 4:35 AM
          Subject: [ydn-javascript] Datatable Problem : datasource has no properties


          >I tried to keep it really simple for a scrollable datatable.
          >
          > I'm getting a "datasource has no properties" error on the line
          > this.myDataSource.responseType.... line
          >
          > Here is the complete page code:
          >
          > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          > <html xmlns="http://www.w3.org/1999/xhtml" >
          > <head>
          > <title>Untitled Page</title>
          >
          > <!--CSS file (default YUI Sam Skin) -->
          > <link type="text/css" rel="stylesheet"
          > href="http://yui.yahooapis.com/2.3.0/build/datatable/assets/skins/sam/datatable.css">
          >
          > <!-- Dependencies -->
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/element/element-beta-min.js"></script>
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/datasource/datasource-beta-min.js"></script>
          >
          > <!-- OPTIONAL: External JSON parser from http://www.json.org/ (enables
          > JSON validation) -->
          > <script type="text/javascript" src="http://www.json.org/json.js"></script>
          >
          > <!-- OPTIONAL: Connection (enables XHR) -->
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/connection/connection-min.js"></script>
          >
          > <!-- OPTIONAL: Drag Drop (enables resizeable columns) -->
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/dragdrop/dragdrop-min.js"></script>
          >
          > <!-- OPTIONAL: Calendar (enables calendar editors) -->
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/calendar/calendar-min.js"></script>
          >
          > <!-- Source files -->
          > <script type="text/javascript"
          > src="http://yui.yahooapis.com/2.3.0/build/datatable/datatable-beta-min.js"></script>
          >
          > <style type="text/css">
          > #myContainer{
          > height:20em;
          > }
          > /* customized css for scrolling */
          > .yui-dt-scrollable {
          > width:30em; /* SET OVERALL WIDTH HERE for ie (make sure columns
          > add up to this total) */
          > height:30em; /* SET HEIGHT HERE for ie */
          > }
          > .yui-dt-scrollbody {
          > height:30em; /* SET HEIGHT HERE for non-ie */
          > *height:auto; /* for ie */
          > }
          > .yui-dt-scrollable thead {
          > background:#696969; /*dark gray*/ /* ie needs a background color */
          > color:#fff;
          > }
          >
          > /* SET WIDTHS FOR EACH TH TO HELP ALIGN COLUMNS */
          > /* IF ALL COLS CAN BE SAME WIDTH USE THIS:
          > .yui-dt-scrollable th, .yui-dt-scrollbody td {
          > width:20em;
          > }*/
          > /* OTHERWISE SET EACH COL WIDTH EXPLICITLY:*/
          > .yui-dt-col-one {
          > width:10em;
          > }
          > .yui-dt-col-two {
          > width:20em;
          > }
          > </style>
          >
          > <script language=javascript>
          > YAHOO.example.UserPoints = [
          > {UserID:218,UserName:"KellyG",AvgPoints:0.29475,NumPred:4},
          > {UserID:221,UserName:"laughlind55",AvgPoints:0.363375,NumPred:4},
          > {UserID:211,UserName:"Bronco85",AvgPoints:0.43125,NumPred:6},
          > {UserID:224,UserName:"macnut",AvgPoints:0.4329,NumPred:5},
          > {UserID:49,UserName:"BroncoBailey",AvgPoints:0.4365,NumPred:4},
          > {UserID:54,UserName:"NEZ4EVER",AvgPoints:0.4955,NumPred:5},
          > {UserID:235,UserName:"admiral",AvgPoints:0.548833,NumPred:3},
          > {UserID:29,UserName:"boiseSt8Rules",AvgPoints:0.560389,NumPred:18},
          > {UserID:231,UserName:"bsuwillwin",AvgPoints:0.675367,NumPred:15},
          > {UserID:219,UserName:"hkhaole",AvgPoints:0.800106,NumPred:33},
          > {UserID:33,UserName:"BroncoJunky",AvgPoints:0.810792,NumPred:12},
          > {UserID:201,UserName:"DAcruSHA",AvgPoints:0.828389,NumPred:9},
          > {UserID:229,UserName:"BroncNuts",AvgPoints:0.886561,NumPred:33},
          > {UserID:213,UserName:"Bulldogmike",AvgPoints:0.887912,NumPred:34},
          > {UserID:236,UserName:"terrapin999",AvgPoints:1.03925,NumPred:4},
          > {UserID:228,UserName:"BroncoBob",AvgPoints:1.072556,NumPred:9},
          > {UserID:226,UserName:"surus",AvgPoints:1.082333,NumPred:3},
          > {UserID:0,UserName:"",AvgPoints:0,NumPred:0}
          > ];
          >
          >
          > </script>
          >
          > </head>
          > <body class=" yui-skin-sam">
          > <div id="myContainer">
          > </div>
          > huh
          >
          > <script type="text/javascript">
          >
          >
          > YAHOO.util.Event.addListener(window, "load", function() {
          > YAHOO.example.Scrolling = new function() {
          > var myColumnDefs = [
          > {key:"UserID", label:"User ID"},
          > {key:"UserName", label:"User Name"},
          > {key:"AvgPoints", label:"Avg. Points"},
          > {key:"NumPred", label:"Num. Pred."}
          > ];
          >
          > var myDataSource = new
          > YAHOO.util.DataSource(YAHOO.example.UserPoints);
          > this.myDataSource.responseType =
          > YAHOO.util.DataSource.TYPE_JSARRAY;
          > myDataSource.responseSchema = {
          > fields: ["UserID","UserName","AvgPoints","NumPred"]
          > };
          >
          > this.myDataTable = new YAHOO.widget.DataTable("myContainer",
          > myColumnDefs,
          > this.myDataSource, {scrollable:true});
          > };
          > });
          > </script>
          >
          > </body>
          > </html>
          >
          >
          >
          >
          >
          > Yahoo! Groups Links
          >
          >
          >
          >
          >
          > --
          > No virus found in this incoming message.
          > Checked by AVG Free Edition.
          > Version: 7.5.484 / Virus Database: 269.13.2/983 - Release Date: 01/09/2007
          > 16:20
          >
          >
        • sudermatt
          OK, I tried what you suggested, but it still didn t work. What am I missing? Here is my NEW script
          Message 4 of 6 , Sep 3, 2007
          • 0 Attachment
            OK,

            I tried what you suggested, but it still didn't work. What am I missing?

            Here is my NEW script

            <script type="text/javascript">


            YAHOO.util.Event.addListener(window, "load", function() {
            YAHOO.example.Scrolling = new function() {
            var myColumnDefs = [
            {key:"UserID", label:"User ID"},
            {key:"UserName", label:"User Name"},
            {key:"AvgPoints", label:"Avg. Points"},
            {key:"NumPred", label:"Num. Pred."}
            ];

            this.myDataSource = new
            YAHOO.util.DataSource(YAHOO.example.UserPoints);
            this.myDataSource.responseType =
            YAHOO.util.DataSource.TYPE_JSARRAY;
            myDataSource.responseSchema = {
            fields: ["UserID","UserName","AvgPoints","NumPred"]
            };

            this.myDataTable = new YAHOO.widget.DataTable("myContainer",
            myColumnDefs,
            this.myDataSource, {scrollable:true});
            };
            });
            </script>
          • Satyam
            Either use this all the time or don t. Read your source, you are missing this in one place. Anyway, it is better if you declare it with var when you
            Message 5 of 6 , Sep 3, 2007
            • 0 Attachment
              Either use 'this' all the time or don't. Read your source, you are missing
              'this' in one place. Anyway, it is better if you declare it with 'var' when
              you create the DataSource and don't use 'this' at all.


              ----- Original Message -----
              From: "sudermatt" <sudermatt@...>
              To: <ydn-javascript@yahoogroups.com>
              Sent: Monday, September 03, 2007 7:25 PM
              Subject: [ydn-javascript] Re: Datatable Problem : datasource has no
              properties


              > OK,
              >
              > I tried what you suggested, but it still didn't work. What am I missing?
              >
              > Here is my NEW script
              >
              > <script type="text/javascript">
              >
              >
              > YAHOO.util.Event.addListener(window, "load", function() {
              > YAHOO.example.Scrolling = new function() {
              > var myColumnDefs = [
              > {key:"UserID", label:"User ID"},
              > {key:"UserName", label:"User Name"},
              > {key:"AvgPoints", label:"Avg. Points"},
              > {key:"NumPred", label:"Num. Pred."}
              > ];
              >
              > this.myDataSource = new
              > YAHOO.util.DataSource(YAHOO.example.UserPoints);
              > this.myDataSource.responseType =
              > YAHOO.util.DataSource.TYPE_JSARRAY;
              > myDataSource.responseSchema = {
              > fields: ["UserID","UserName","AvgPoints","NumPred"]
              > };
              >
              > this.myDataTable = new YAHOO.widget.DataTable("myContainer",
              > myColumnDefs,
              > this.myDataSource, {scrollable:true});
              > };
              > });
              > </script>
              >
              >
              >
              >
              >
              >
              >
              > Yahoo! Groups Links
              >
              >
              >
              >
              >
              > --
              > No virus found in this incoming message.
              > Checked by AVG Free Edition.
              > Version: 7.5.484 / Virus Database: 269.13.2/985 - Release Date: 02/09/2007
              > 16:32
              >
              >
            • sudermatt
              ... missing ... var when ... missing? ... 02/09/2007
              Message 6 of 6 , Sep 3, 2007
              • 0 Attachment
                --- In ydn-javascript@yahoogroups.com, "Satyam" <satyam@...> wrote:
                >
                > Either use 'this' all the time or don't. Read your source, you are
                missing
                > 'this' in one place. Anyway, it is better if you declare it with
                'var' when
                > you create the DataSource and don't use 'this' at all.
                >
                >
                > ----- Original Message -----
                > From: "sudermatt" <sudermatt@...>
                > To: <ydn-javascript@yahoogroups.com>
                > Sent: Monday, September 03, 2007 7:25 PM
                > Subject: [ydn-javascript] Re: Datatable Problem : datasource has no
                > properties
                >
                >
                > > OK,
                > >
                > > I tried what you suggested, but it still didn't work. What am I
                missing?
                > >
                > > Here is my NEW script
                > >
                > > <script type="text/javascript">
                > >
                > >
                > > YAHOO.util.Event.addListener(window, "load", function() {
                > > YAHOO.example.Scrolling = new function() {
                > > var myColumnDefs = [
                > > {key:"UserID", label:"User ID"},
                > > {key:"UserName", label:"User Name"},
                > > {key:"AvgPoints", label:"Avg. Points"},
                > > {key:"NumPred", label:"Num. Pred."}
                > > ];
                > >
                > > this.myDataSource = new
                > > YAHOO.util.DataSource(YAHOO.example.UserPoints);
                > > this.myDataSource.responseType =
                > > YAHOO.util.DataSource.TYPE_JSARRAY;
                > > myDataSource.responseSchema = {
                > > fields: ["UserID","UserName","AvgPoints","NumPred"]
                > > };
                > >
                > > this.myDataTable = new YAHOO.widget.DataTable("myContainer",
                > > myColumnDefs,
                > > this.myDataSource, {scrollable:true});
                > > };
                > > });
                > > </script>
                > >
                > >
                > >
                > >
                > >
                > >
                > >
                > > Yahoo! Groups Links
                > >
                > >
                > >
                > >
                > >
                > > --
                > > No virus found in this incoming message.
                > > Checked by AVG Free Edition.
                > > Version: 7.5.484 / Virus Database: 269.13.2/985 - Release Date:
                02/09/2007
                > > 16:32
                > >
                > >
                >
              Your message has been successfully submitted and would be delivered to recipients shortly.