Создание шагов мастера в MVC и Razor

Question

Я хотел бы создать одно приложение MVC для создания учетной записи пользователя, используя более одного шага мастера. Нужно ли мне перейти на одну страницу просмотра и скрыть или отобразить логику div по стороне клиента или мне нужно создать другое представление для каждого мастера (используя частичные виды)?

Что является лучшим вариантом здесь? Мне нужно сохранить данные состояния между шагами мастера, чтобы пользователь мог вернуться назад или дальше, и на последнем шаге он или она может сохранить его в базе данных.

Answer 1

Существуют разные возможности. Вы можете использовать чистое клиентское решение, показывая/скрывая разделы или полное решение на стороне сервера. Вам решать, какой из них лучше всего подходит для вашего конкретного сценария. Вот an example, на который вы можете взглянуть, если вы решите пойти на серверный подход.

Answer 2

В зависимости от того, разрешите ли вы использовать javascript или нет.

Если вы разрешаете javascript, используйте jQuery для отображения/скрытия div.

Я только что сделал следующий скрипт мастера. Он поддерживает несколько мастеров на одной странице, если вы следуете синтаксису class/div ниже.

<div class="wizard"> 
    <div class="step active"> 
     some information 
    </div> 
    <div class="step" style="display:none"> 
     Step 2 info 
    </div> 
    <div class="step" style="display:none"> 
     Step 3 info 
    </div> 

    <input type="button" class="prev" style="display: none" value="Previous" /> 
    <input type="button" class="next" value="Next" /> 
</div> 



<script type="text/javascript"> 
$(function() { 
    $('.wizard .prev').click(function() { 
     var wizard = $(this).parent('.wizard'); 

     $('.step.active', wizard).hide(); 

     var currentStep = $('.step.active', wizard); 
     currentStep.hide(); 
     currentStep.removeClass('active'); 

     var newStep = currentStep.prev('.step', wizard); 
     newStep.addClass('active'); 
     newStep.show(); 

     if ($('.step:first', wizard)[0] == newStep[0]) { 
      $(this).hide(); 
     } 

     $('.next', wizard).show(); 
    }); 

    $('.wizard .next').click(function() { 
     var wizard = $(this).parent('.wizard'); 

     $('.step.active', wizard).hide(); 

     var currentStep = $('.step.active', wizard); 
     currentStep.hide(); 
     currentStep.removeClass('active'); 

     var newStep = currentStep.next('.step', wizard); 
     newStep.addClass('active'); 
     newStep.show(); 

     if ($('.step:last', wizard)[0] == newStep[0]) { 
      $(this).hide(); 
     } 

     $('.prev', wizard).show(); 
    }); 
}); 
</script> 

Без JavaScript:

Создать модель представления, которая содержит информацию для всех шагов и делиться между всеми видами пошагового мастера. Это позволяет сохранять все состояния между разными POST.

Answer 3

Я делаю что-то подобное в данный момент. Я собираю большой набор данных за несколько шагов и позволяю пользователям сохранять данные в любой момент.

Я в основном разделил его на несколько видов и создал ViewModels для каждого представления с соответствующей информацией для этого шага мастера. Кажется, что я хорошо работаю для своих целей.