Previous and Next buttons on form with Dynamic Panels
Last Post 08-01-2013 05:29 PM by Gigi Payne. 2 Replies.
AddThis - Bookmarking and Sharing Button
Author Messages
Gigi PayneUser is Offline
skipping stones
skipping stones
Posts:16
Avatar

--
08-01-2013 07:26 AM
    I have a form with dynamic panels enabled as tabs.  The form has 3 panels.

    When the page first loads it displays the first panel with the Submit button on the bottom.  You can click on the tabs and fill in all the information then click Submit and all is well.

    The problem is, when I delivered this to the client, they wanted Previous and Next buttons.  Their concern is the user fills in the information on the first Panel thinking that's all there is.  They then click Submit and get a list of warnings for the required fields in the other 2 panels/tabs.

    Is there a way to put a Next button on tabs 1 and 2 and not show the Submit button until you reach the final tab?

    Thank you.

    DNN v06.02.08(2)
    DynamicForms v4.10.0.5601
    Gigi PayneUser is Offline
    skipping stones
    skipping stones
    Posts:16
    Avatar

    --
    08-01-2013 04:21 PM
    I've done further research and looked at other posts and here's what I've come up with.

    DynamicForms uses DNN's dnnTabs jQuery wrapper for the jQuery tabs.

    I've been able to create a plain HTML page with jQuery code that sets up tabs following the examples at http://jqueryui.com/tabs/

    In my sample, I was able to add Previous and Next buttons that actually call the jQuery UI functions to set the active tab appropriately and it works fine.

    Of course, integrating that code into DNN is a different story.  I've set up a Text/HTML module with the appropriate jQuery code in the module Header and HTML markup in the module text.  The tabs are rendering and the previous and next buttons are firing but ...

    I'm creating the tabs with:

    $('#tabs').dnnTabs().dnnPanels();

    I have 2 methods that are not working for me:

    // This method should call my function when a tab is activated
    // Generating error: Uncaught TypeError: Object [object Object] has no method 'on'
    $('#tabs').on("tabsactivate", function (event, ui) { ShowHideButtons(); });

    // This method should return the active tab index
    // It's returning [object Object]
    $('#tabs').tabs('option', 'active');

    I also tried $('#tabs').dnnTabs... with the same result.

    Once I get this working, I will try to integrate with DynamicForms.

    I'm hoping somebody who is more familiar with DNN's implementation of jQuery can maybe help me out here?

    Any other thoughts would also be appreciated. I'm just looking for something that will work.

    Thanks in advance.
    Gigi PayneUser is Offline
    skipping stones
    skipping stones
    Posts:16
    Avatar

    --
    08-01-2013 05:29 PM
    Well, it looks like my solution doesn't work with the version of jQuery and jQuery UI used by DNN 6.2.8.

    I did all my testing outside of DNN with:


    But as soon as I replace that with the versions used by my DNN install, it didn't work any more.



    So ... I'm back to square 1.  Ggrrrr!


    ---
  • film izle
  • 720 izle
  • film
  • sinema izle
  • film makinesi
  • T�rk�e dublaj film
  • film izle
  • film izle
  • baglan film izle
  • sinema izle
  • 1080 film izle
  • film mercegi