1

I got to design asp.net mvc pages for registration functionality. Functionality has some group of categories,like- set up password , security , some business and agreement questions.

Currently all this functionality is in one single page, but the new requirement is to separate each question group into separate pages. So now i have to add 'Back' and 'Next' buttons on these individual pages to provide an option for the user to travel back and forth the pages for editing.

I need suggestion or idea on how can I achieve this. I am looking for some best design with much code re usability as i need to implement this in desktop and mobile. Here are some of my ideas-

1) Do i need to create multiple html pages? If i create multiple views, how can i access the html element values of the parent view?where can i store the parent view's html element values ?

2) Do i need to create one html page and call multiple partial views in it? If i do this, can i get the values of html elements of the partial view when the user clicks 'Back' button?If i do this the url will always be the same irrespective which question group the user views.

Any help on this is much appreciated!

Thanks,

Wh

WonderHeart
  • 678
  • 10
  • 28
  • I would consider a wizard approach - one page/one form with hidden sections that are displayed using next/back buttons ([refer this answer](http://stackoverflow.com/questions/25643394/mvc-force-jquery-validation-on-group-of-elements/25645097#25645097)) –  Jan 17 '15 at 23:34
  • i looked into the link, but i can make back functionality work using DIVS by using hide and show?...Is there any other advantage by using this design?because i have to design the same for Mobile and tablet too...this deisgn looks like i have to create lot of show , hide of DIVS.. – WonderHeart Jan 18 '15 at 00:04
  • Of course - its would just be something like `container.prev('.section').show().find('input').first().focus();` for a Back button (`.prev()` instead of `.next()`). You still need to create the html whatever you do. The main advantage of one view/one form is that you don't need multiple posts for each stage where you need to persist the data somewhere. Another approach is shown in [this answer](http://stackoverflow.com/questions/6402628/multi-step-registration-process-issues-in-asp-net-mvc-splitted-viewmodels-sing/6403485#6403485) - more akin to ViewState in Web Forms –  Jan 18 '15 at 00:10
  • I am sticking to the first option of the one page/one view..So , lets say i am on page 1 and when i hit 'Next' on page 2, should i make an ajax call by submitting the form?because i have to do validations on page 1..Similarly when i click 'Back' when i am on page 2, should i again make the ajax call – WonderHeart Jan 18 '15 at 15:19
  • When you say _I am sticking to the first option_ I assume you mean having multiple views. Ajax calls don't make a lot of sense because ajax calls stay on the same page. If you have each step in a different page, then you an approach similar to the link I gave in my second comment. –  Jan 18 '15 at 21:30
  • sorry, 1st option i meant was your suggestion- [wizard approach - one page/one form with hidden sections that are displayed using next/back buttons].. – WonderHeart Jan 19 '15 at 17:15
  • No you do not need to make any ajax calls. The next/back buttons only validates that the controls within its section (and if valid, display the next/previous step). The final section contains a standard submit button which posts all the model back to the controller in one post. –  Jan 20 '15 at 04:11
  • @StephenMuecke- yeah.. i am currently building this functionality and i guess i didn't figure out this earlier- users can by-pass the client validation and move forward with the Next buttons, so unless the users come to the last page and hits 'Submit' the user wouldn't know if any entered values are incorrect. So then again the user has to go back on each page to fix it..I am not sure if this would be apt design in my case...please advice – WonderHeart Jan 20 '15 at 16:11
  • The linked answer in my first comment works by preventing the user from moving to the next section if there are any controls within it that are invalid (and the error messages defined by `#Html.ValidationMessageFor()` are displayed), so I think that approach would be fine for your needs. –  Jan 21 '15 at 02:04
  • @StephenMuecke- Thanks Steve, that's what i thought..i agree with you..But my team is not pretty convinced with this one view(wizard) approach..Their argument is if user just finishes only 2 steps, and if he wants to resume the other steps after some time, then this wizard approach wouldn't work - as in one view approach everything gets saved in the database only at the end of last step of 'Submit' button.Instead they want to save each step in database. Any advise on this plz.. – WonderHeart Jan 21 '15 at 15:02
  • OK, If that the case you would need separate view models and views for each step, and a separate database table with some additional field(s) to indicate which steps have been completed, then additional functionality to notify the user to complete when they next log on. Then when the final step is complete and all data is valid, copy into the 'real' table and remove from the 'interim' table. –  Jan 21 '15 at 20:30

0 Answers0