Hybrid View

  1. #1
    Sencha User ThorstenSuckow's Avatar
    Join Date
    Sep 2007
    Location
    Aachen, Germany
    Posts
    597
    Vote Rating
    2
    ThorstenSuckow is on a distinguished road

      1  

    Default [2.1] Ext.ux.Wiz - a wizard-component for Ext JS

    [2.1] Ext.ux.Wiz - a wizard-component for Ext JS


    Edit: 31.05.2009
    Changelog
    • fixed: dialog would be closable even if teh dialog state would be set to "disabled"; added "beforeclose"-listener to prevent closing the dialog in case the dialog is busy
    • fixed: loadmask-msg would not be rendered due to accessing an object property quoted
    • fixed: typo in Header.js (closes google issue #1)
    • enhancement: converted tabs to spaces

    Edit: 07.05.2009
    Changelog
    • enhancement: Updated component to work with Ext JS 3.0 while keeping backwards compatibility to Ext 2.*


    Edit: 31.05.2008
    Changelog
    • fixed: wrong regex-mask in examples/SimpleWizard.html allowed for wrong user-input data
    • enhancement: removed initListeners implementation to initEvents-override in Ext.ux.Wiz
    • fixed: added 'beforecardhide'-event to Ext.ux.Wiz.Card since some listeners for the beforehide-event could block hiding the card when CardLayout requests it after rendering
    • fixed: changed default hideMode in Ext.ux.Wiz.Card to 'display' to prevent rendering issues with IE7 due to the latest changes

    Edit: 28.05.2008
    Changelog
    • fixed: IE6 did not render the step-indicator images as expected, added style-rule in ext-ux-wiz.css (thanks to donssmith)
    • fixed: IE6 complained about multiple OR conditions in Ext.ux.Wiz.initComponent

    Edit: 26.05.2008
    Changelog
    • fixed: IE complained about semicolon in examples/SimpleWizard.html
    • fixed: removed "!important"-style-override in examples/SimpleWizard.html since IE doesn't like it
    • fixed: quoted "default" in Ext.ux.Wiz.loadMaskConfig since it's a keyword in IE

    ----

    I was able to release my wizard-component earlier than I thought - possible due to my employer Refined Labs GmbH.

    Similiar to the livegrid- and youtubeplayer-extension released earlier, this component grew as a sub-project out of the larger application I’m currently working on.

    Since I wasn’t pleased with the solutions already floating around in userland, I created my own wizard-component for Ext JS. Target: Simplify setup processes and the collecting of data where a guide is useful; keep the implementation process as simple as possible, but flexible enough to allow for complex instances (this goes specially for validating user input and therefor resulting component behavior).







    The component consists of three classes:


    Ext.ux.Wiz (deriving from Ext.Window): The base class for a wizard component. A window that holds paging-buttons (previous/next step) and a button for canceling the wizard. Flexible event-listener behavior guarantees complex wizard workflows. Paging-buttons will be enabled/disabled based on the validator-rules found in the current active card (type: Ext.ux.Wiz.Card).

    Ext.ux.Wiz.Header (deriving from Ext.BoxComponent): A component that can be used as a header/footer/whatever to indicate the progress in the wizard. Also shows information about the wizard’s purpose, as configured.

    Ext.ux.Wiz.Card (deriving from Ext.FormPanel): Each card represents a step in the setup-process and holds either form-elements which are validated automatically (monitorValid:true) or plain informations about the progress in the wizard so far, or both. An array of instances of Ext.ux.Wiz.Card will be passed to Ext.ux.Wiz to automatically build and layout the wizard.


    Blog entry: http://www.siteartwork.de/2008/05/26...nt-for-ext-js/
    Project-home: http://www.siteartwork.de/wizardcomponent

  2. #2
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    79
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    that's sharp

  3. #3
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    +1 million

    never realised you had all these hosted on googlecode

  4. #4
    Ext User
    Join Date
    Nov 2007
    Location
    Fountain Valley, CA, USA
    Posts
    30
    Vote Rating
    0
    donssmith is on a distinguished road

      0  

    Default


    Very well done!

    I added background-repeat: repeat-x;

    PHP Code:
    .ext-ux-wiz-Header-stepIndicator {
        
    margin-left:28px;
        
    float:left;
        
    background-image:url(../images/ext-ux-wiz-stepIndicator.png) !important;
        
    background-position:6px 0px;
        
    background-repeatrepeat-x
        
    height:6px;
        
    width:6px;

    for the step indicator image to work correctly in IE6.

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Impressive as ever! Nice implementation.

  6. #6
    Sencha User
    Join Date
    Aug 2007
    Location
    Munich, Germany
    Posts
    135
    Vote Rating
    0
    gelleneu is on a distinguished road

      0  

    Default


    Sounds good, but I can't find the download (google code download is empty) and/or some Live Demos?

  7. #7
    Ext JS Premium Member
    Join Date
    Nov 2007
    Location
    Munich
    Posts
    30
    Vote Rating
    0
    sigaref is on a distinguished road

      0  

    Default


    Quote Originally Posted by gelleneu View Post
    Sounds good, but I can't find the download (google code download is empty) and/or some Live Demos?
    You have to checkout the code from the Google Code SVN.

    Code:
    svn checkout http://ext-ux-wiz.googlecode.com/svn/trunk/ ext-ux-wiz-read-only

  8. #8
    Sencha User ThorstenSuckow's Avatar
    Join Date
    Sep 2007
    Location
    Aachen, Germany
    Posts
    597
    Vote Rating
    2
    ThorstenSuckow is on a distinguished road

      0  

    Default


    Thanks for the feedback so far!

    Quote Originally Posted by donssmith View Post
    I added background-repeat: repeat-x;

    PHP Code:
    .ext-ux-wiz-Header-stepIndicator {
        
    margin-left:28px;
        
    float:left;
        
    background-image:url(../images/ext-ux-wiz-stepIndicator.png) !important;
        
    background-position:6px 0px;
        
    background-repeatrepeat-x
        
    height:6px;
        
    width:6px;

    for the step indicator image to work correctly in IE6.
    I've added this fix, along with another bug-fix related to IE6. Latest version can be checked out from the trunk.

  9. #9

  10. #10
    Sencha Premium Member
    Join Date
    Jun 2008
    Posts
    322
    Vote Rating
    4
    Scorpie is on a distinguished road

      0  

    Default


    What a great plugin, I vote we take this up in the next release of Ext-core!

Thread Participants: 96

  1. Animal (2 Posts)
  2. franklt69 (1 Post)
  3. jay@moduscreate.com (1 Post)
  4. Digital God (1 Post)
  5. mystix (4 Posts)
  6. fangzhouxing (3 Posts)
  7. mike1993 (2 Posts)
  8. KRavEN (1 Post)
  9. jsakalos (2 Posts)
  10. Ylodi (1 Post)
  11. Fabyo (2 Posts)
  12. anestesiadorhvs (1 Post)
  13. John Sourcer (1 Post)
  14. kmiyashiro (3 Posts)
  15. anjelika (6 Posts)
  16. cutigersfan (1 Post)
  17. mjlecomte (1 Post)
  18. kevinwu8 (2 Posts)
  19. JEBriggs (3 Posts)
  20. CutterBl (5 Posts)
  21. gelleneu (1 Post)
  22. Spirit (1 Post)
  23. Michelangelo (9 Posts)
  24. wm003 (1 Post)
  25. Juvs (3 Posts)
  26. Mthor (2 Posts)
  27. sean.zhou (2 Posts)
  28. donssmith (3 Posts)
  29. sigaref (1 Post)
  30. ajaxvador (1 Post)
  31. prodigy7 (2 Posts)
  32. mask_hot (2 Posts)
  33. ec-cts (1 Post)
  34. dorgan (2 Posts)
  35. DhakouaniM (1 Post)
  36. Romantik (2 Posts)
  37. franck34 (4 Posts)
  38. sirioz10 (1 Post)
  39. razor (15 Posts)
  40. chalu (2 Posts)
  41. cirvine (2 Posts)
  42. ClemsonJeeper (1 Post)
  43. GOTTMODUS (1 Post)
  44. rnfbr1 (2 Posts)
  45. walldorff (2 Posts)
  46. jlowe (1 Post)
  47. moegal (1 Post)
  48. johnstontrav (1 Post)
  49. mirko (1 Post)
  50. J.B (1 Post)
  51. niaz (1 Post)
  52. Jack_S (2 Posts)
  53. knarz (1 Post)
  54. hatch79 (1 Post)
  55. Eki (1 Post)
  56. accilies (3 Posts)
  57. SamuraiJack1 (1 Post)
  58. gthe (2 Posts)
  59. Scorpie (1 Post)
  60. supercharge2 (1 Post)
  61. lucasmarin (1 Post)
  62. alienwebz (7 Posts)
  63. kellyt (2 Posts)
  64. charleshimmer (20 Posts)
  65. nomdeguerre (3 Posts)
  66. perdar (2 Posts)
  67. agalue (2 Posts)
  68. pablitobs (4 Posts)
  69. jmariani (4 Posts)
  70. wemerson.januario (3 Posts)
  71. mschwartz (2 Posts)
  72. Stju (3 Posts)
  73. TheColonel (1 Post)
  74. lakilevi (1 Post)
  75. roque (2 Posts)
  76. Jangla (8 Posts)
  77. cchic (1 Post)
  78. MH61 (2 Posts)
  79. MasterAM (1 Post)
  80. pezze (8 Posts)
  81. phpfreak (1 Post)
  82. talha06 (1 Post)
  83. swarm (7 Posts)
  84. udalaitz (2 Posts)
  85. esh (1 Post)
  86. reci (1 Post)
  87. ccrotty (3 Posts)
  88. CarlosLuiz (3 Posts)
  89. guyfomi (1 Post)
  90. yugikhoi (1 Post)
  91. drunkmoose (1 Post)
  92. occiso (2 Posts)
  93. slckysr (3 Posts)
  94. samir_ware (1 Post)
  95. eCoast (2 Posts)
  96. wpenton (1 Post)
Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi