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

Tabview javascript problem

Expand Messages
  • jonah12394
    Hi, I am using the tabview component and will be having quite a few tabs. I am using a jsp framework. I have started off by using the datasrc attribute so all
    Message 1 of 2 , Jun 3, 2008
    • 0 Attachment
      Hi,

      I am using the tabview component and will be having quite a few tabs.

      I am using a jsp framework. I have started off by using the datasrc
      attribute so all tab jsp's (which would talk to the server to retrieve
      data) haven't got to loaded at once which could be slow.

      The datasrc works great.

      In my jsp i was get records out from the database which i was then
      going to store in a javascript hashmap.

      so in my jsp would be the line <script> storeblahblah('v1',
      'v2'...</script>

      the tabview uses innerHTML so this javascript would never be executed.

      I wanted to do it this way so i could use ajax so the user could add
      records, update and delete without having to reload the page.

      How would you go about this. I basically need to get the records into
      javascript or am i missing something on the tabcomponent?

      Thanks

      Paul
    • Caridy Patino
      Hi Paul, You re right, the browser will strip out all the scripts tags before set the innerHTML, and in the case of the YUI Tabview control, the inline and
      Message 2 of 2 , Jun 3, 2008
      • 0 Attachment
        Hi Paul,

        You're right, the browser will strip out all the scripts tags before
        set the innerHTML, and in the case of the YUI Tabview control, the
        inline and also the remote scripts will not be executed, and also the
        CSS stuff will be removed too.

        The good news is you can use the YUI Dispatcher Plugin to extend the
        TabView's functionalities to allow inline and remote scripts, and also
        CSS within the dataSrc's response.

        Step by Step:
        1. Include the dispatcher plugin:
        <script type="text/javascript"
        src="http://js.bubbling-library.com/1.5.0/build/dispatcher/dispatcher-min.js"></script>

        2. Encapsulate the tabs inclusion:

        Instead to use this:

        tabView.addTab( new YAHOO.widget.Tab({
        label: 'Page Viewer',
        dataSrc: 'pageA.jsp',
        cacheData: false,
        active: true
        }));

        you need to use this:

        YAHOO.plugin.Dispatcher.delegate (new YAHOO.widget.Tab({
        label: 'Page Viewer',
        dataSrc: 'pageA.jsp',
        cacheData: false,
        active: true
        }), tabView);

        Delegating the rendering process to the Dispatcher plugin instead to
        use the Tabview's routine.

        Examples here:
        http://bubbling-library.com/eng/api/docs/plugins/dispatcher-examples.html

        PD: you need to keep in mind that the dispatcher will use the YUI Get
        Utility for remote scripts, and the "EVAL - Anonymous function" for
        inline scripts, so be careful with the variable's scope (my
        recommendation is to use NAMESPACING to avoid global variables).

        Best Regards,
        Caridy Patino (caridy at yahoo-inc.com)

        --- In ydn-javascript@yahoogroups.com, "jonah12394" <jonah12394@...>
        wrote:
        >
        > Hi,
        >
        > I am using the tabview component and will be having quite a few tabs.
        >
        > I am using a jsp framework. I have started off by using the datasrc
        > attribute so all tab jsp's (which would talk to the server to retrieve
        > data) haven't got to loaded at once which could be slow.
        >
        > The datasrc works great.
        >
        > In my jsp i was get records out from the database which i was then
        > going to store in a javascript hashmap.
        >
        > so in my jsp would be the line <script> storeblahblah('v1',
        > 'v2'...</script>
        >
        > the tabview uses innerHTML so this javascript would never be executed.
        >
        > I wanted to do it this way so i could use ajax so the user could add
        > records, update and delete without having to reload the page.
        >
        > How would you go about this. I basically need to get the records into
        > javascript or am i missing something on the tabcomponent?
        >
        > Thanks
        >
        > Paul
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.