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

Re: Datatable does not display within Tabview

Expand Messages
  • kfish_22
    Hi Les - Try making your key attributes within histClmnDefs the same as your fields array elements within dsHistory. I m still kind of new to YUI... but I
    Message 1 of 3 , Jan 30, 2009
    • 0 Attachment
      Hi Les -

      Try making your "key" attributes within histClmnDefs the same as
      your "fields" array elements within dsHistory. I'm still kind of new
      to YUI... but I think that might be the issue?!

      Cheers,
      Kevin

      --- In ydn-javascript@yahoogroups.com, "lesgreen123" <green.les@...>
      wrote:
      >
      > I'm having a problem displaying a datatable within a TabView. I
      > created a div within the tab to be used as the container for the
      table:
      >
      > <div id="history"><!-- tab 2 -->
      > <div id="requestorHistory"></div>
      > </div>
      >
      > The table is not created when the application first loads, it is
      > dynamically created after a user does a search.
      >
      >
      > ...
      > var histClmnDefs = [
      > {key:"request_date", label:"Request Date", sortable:true},
      >
      {key:"info_serv_desc", label:"Requests", sortable:true,
      > formatter:this.formatInfoServ},
      > {key: "appoint_date", label:"Appointment", sortable:true},
      > {key: "interp_date", label:"Mid-Tier", sortable:true},
      > {key: "comments", label:"Comments"}
      > {key: "check", label:"Delete", formatter:"checkbox"}
      > ];
      >
      > this.dsHistory = new
      > YAHOO.util.DataSource
      ("includes/controllers/dbActionController.php?"+query);
      > this.dsHistory.responseType = YAHOO.util.DataSource.TYPE_JSON;
      > this.dsHistory.responseSchema = {
      > resultsList: "Result",
      > fields: ["request_id", "request_date", "appoint_date",
      > "service_date", "interp_date", "comments"]
      >
      > };
      >
      > this.dtHistory = new YAHOO.widget.DataTable("requestorHistory",
      > histClmnDefs, this.dsHistory, {
      > selectionMode:"single",
      > scrollable:true,
      > height:"20em"
      > });
      >
      > ...
      >
      > I can see in Firebug that the table is being created with the
      correct
      > columns and I also see the data is loaded. But the table does not
      > display on the screen - I only see a vertical line where the left
      edge
      > of the datatable begins.
      >
      > Even more interesting, when I return data where the JSON record is
      > malformed, the Datatable does display within the tab (the columns
      > display, but obviously, no data).
      >
      > Has anyone else run into this type of problem? Thanks. Les.
      >
    • Satyam
      Make sure the tab is visible before the datatable is drawn into it. It used to have problems when it was drawn within an invisible container as some of the
      Message 2 of 3 , Jan 31, 2009
      • 0 Attachment
        Make sure the tab is visible before the datatable is drawn into it. It
        used to have problems when it was drawn within an invisible container as
        some of the browsers reported invalid width and height values and that
        made some calculations fail.

        Als, it is best to provide the query information not in the DataSource
        constructor but in the initialRequest configuration attribute, in the
        fourth attribute to the DataTable constructor. In this way, should you
        want to requery the server with new query values you can change the
        request arguments for the same base URL which will remain stored in
        the DataSource.

        Satyam


        lesgreen123 wrote:
        > I'm having a problem displaying a datatable within a TabView. I
        > created a div within the tab to be used as the container for the table:
        >
        > <div id="history"><!-- tab 2 -->
        > <div id="requestorHistory"></div>
        > </div>
        >
        > The table is not created when the application first loads, it is
        > dynamically created after a user does a search.
        >
        >
        > ...
        > var histClmnDefs = [
        > {key:"request_date", label:"Request Date", sortable:true},
        > {key:"info_serv_desc", label:"Requests", sortable:true,
        > formatter:this.formatInfoServ},
        > {key: "appoint_date", label:"Appointment", sortable:true},
        > {key: "interp_date", label:"Mid-Tier", sortable:true},
        > {key: "comments", label:"Comments"}
        > {key: "check", label:"Delete", formatter:"checkbox"}
        > ];
        >
        > this.dsHistory = new
        > YAHOO.util.DataSource("includes/controllers/dbActionController.php?"+query);
        > this.dsHistory.responseType = YAHOO.util.DataSource.TYPE_JSON;
        > this.dsHistory.responseSchema = {
        > resultsList: "Result",
        > fields: ["request_id", "request_date", "appoint_date",
        > "service_date", "interp_date", "comments"]
        >
        > };
        >
        > this.dtHistory = new YAHOO.widget.DataTable("requestorHistory",
        > histClmnDefs, this.dsHistory, {
        > selectionMode:"single",
        > scrollable:true,
        > height:"20em"
        > });
        >
        > ...
        >
        > I can see in Firebug that the table is being created with the correct
        > columns and I also see the data is loaded. But the table does not
        > display on the screen - I only see a vertical line where the left edge
        > of the datatable begins.
        >
        > Even more interesting, when I return data where the JSON record is
        > malformed, the Datatable does display within the tab (the columns
        > display, but obviously, no data).
        >
        > Has anyone else run into this type of problem? Thanks. Les.
        >
        >
        > ------------------------------------
        >
        > Yahoo! Groups Links
        >
        >
        >
        > ------------------------------------------------------------------------
        >
        >
        > No virus found in this incoming message.
        > Checked by AVG - www.avg.com
        > Version: 8.0.233 / Virus Database: 270.10.16/1925 - Release Date: 01/30/09 07:37:00
        >
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.