Telerik Forums
UI for ASP.NET MVC Forum
or
Ask question
All Questions
Unanswered
Answered
9 questions
0 answers
37 views
ASP.NET MVC Wizard AJAX Partial Views and how to save the model.

After a long day, I finally got all the validation working as I intend it.  The question I now have is how do I pass the model back and forth between each step?   My basic setup is I have Business.cshtml that has my Wizard on it.  For each step of the wizard I then  retrieve the correct PartialView and render to the step.  What I am unsure of how to do is how do you pass the model back and forth.  I made the assumption using '@Url.Action("_BusinessFinancial", "Onboard",Model)' in the javascript would work but I am just not 100% how to save the model between each step and reuse it.

 

Here is my Business.cshtml

 


@using Kendo.Mvc.UI
@model Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel

@{
    ViewBag.Title = "Business Onboarding";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style>
    .wide {
        width: 95%;
    }

    .field-validation-error {
        color: red;
    }
</style>


<!-- Wizard -->
@(Html.Kendo().Wizard()
        .Name("wizard")
        .Events(ev => ev.Select("onSelect"))
        .Events(ev => ev.Done("onDone"))
        .LoadOnDemand(true)
        .HtmlAttributes(new { @novalidate = "" })
        .ReloadOnSelect(false)
        .Steps(s =>
        {
            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel>()
            .Title("Business Profile")
            .ContentUrl(Url.Action("_BusinessProfile", "Onboard", Model))
            .Buttons(b =>
            {
                b.Next().Text("Next");
            });

            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel>()
            .Title("Business Financial")
            .ContentUrl(Url.Action("_BusinessFinancial", "Onboard", Model))
            .Buttons(b =>
            {
                b.Previous().Text("Back");
                b.Next().Text("Next");
            });
            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel>()
            .Title("Business Address")
            .ContentUrl(Url.Action("_BusinessAddress", "Onboard", Model))
            .Buttons(b =>
            {
                b.Previous().Text("Back");
                b.Done().Text("Submit");
            });
        })
    )

<script type="text/javascript">
    var dataPartial1;
    var dataPartial2;
    var currentStep;

    function onSelect(e) {
        var form, contentUrl;
        if (e.step.options.index < currentStep) {
        }
        else {
            if (e.step.options.index == 1) {
                form = $('#frmPartialBusinessProfile');
                dataPartial1 = form.serialize();
                contentUrl = '@Url.Action("_BusinessFinancial", "Onboard",Model)';
            }
            else if (e.step.options.index == 2) {
                form = $('#frmPartial2');
                dataLesions = form.serialize();
                contentUrl = '@Url.Action("_BusinessAddress", "Onboard",Model)';
            }
            if (!form.valid()) {
                e.preventDefault();
            }
            else {
                e.step.options.contentUrl = contentUrl;
            }
        }
        currentStep = e.step.options.index;
    }

    function onNextStep(e) {
        if (e.step.options.index == 2) {
            openDoc();
        }
    }

    function onDone(e) {

        var form = $('#frmMain');

        if (form.valid()) {
            form.submit();
        }

    }

    var onAddMainSuccess = function (result) {

        if (result.error) {
            alert(result.error);
        }
    };

</script>

 

Here is my Onboard controller


using Kendo.Mvc.UI;
using Reverberate.Services;
using Kendo.Mvc.Extensions;
using System;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Reverberate.Model;

namespace CallCenterWebsiteHelper.Controllers
{
    public class OnboardController : Controller
    {
        // GET: Campaign
        private List<SelectListItem> StatesSelectList()
        {
            var slStates = new List<SelectListItem>();
            var states = new Reverberate.BLL.General.StaticDataSet.Geographic().States();
            for (int i = 0; i < states.Count; i++)
                slStates.Add(new SelectListItem() { Text = states[i], Value = states[i] });
            return slStates;
        }
        private List<SelectListItem> BusinessTypesSelectList()
        {
            var sl = new List<SelectListItem>();
            var list = new Reverberate.BLL.General.StaticDataSet.BusinessInformation().BusinessTypeList();
            for (int i = 0; i < list.Count; i++)
                sl.Add(new SelectListItem() { Text = list[i], Value = list[i] });
            return sl;
        }

        public ActionResult Business()
        {
            ViewBag.States = StatesSelectList();
            ViewBag.BusinessTypeList = BusinessTypesSelectList();
            var model = new Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel();
            model.BusinessProfileModel = new Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessProfileModel();
            model.BusinessFinancialModel = new Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessFinancialModel();
            return View("Business",model);
        }
        public ActionResult _BusinessProfile(Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel viewModel)
        {
            ViewBag.States = StatesSelectList();
            ViewBag.BusinessTypeList = BusinessTypesSelectList();
            return PartialView("_BusinessProfile",viewModel);
        }
        public ActionResult _BusinessFinancial(Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel viewModel)
        {
            ViewBag.States = StatesSelectList();
            ViewBag.BusinessTypeList = BusinessTypesSelectList();
            return PartialView("_BusinessFinancial", viewModel);
        }
        public ActionResult _BusinessAddress(Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel viewModel)
        {
            ViewBag.States = StatesSelectList();
            ViewBag.BusinessTypeList = BusinessTypesSelectList();
            return PartialView("_BusinessAddress", viewModel);
        }
        /*
        public ActionResult BusinessProfile()
        {

            return PartialView("_BusinessProfile");
        }*/
    }
}


 

here is my two partial views

_busiessprofile


@using Kendo.Mvc.UI
@model Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel
@using (Html.BeginForm(null, null, FormMethod.Post, new { @id = "frmPartialBusinessProfile", @name = "frmPartialBusinessProfile" }))
{
    <div style="width: 45%; float: left; border: 1px solid black" id="BusinessInfoEntry">
        <h3>Business Profile</h3>
        <fieldset>
            <legend></legend>
            <ol>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessName)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.BusinessName, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessName)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.FederalTaxId)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.FederalTaxId, new { maxlength = 20 })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.FederalTaxId)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessStartDate)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.BusinessStartDate, new { @type = "date", @class = "form-control datepicker", @Value = Model == null || Model.BusinessProfileModel.BusinessStartDate == null ? null : Model.BusinessProfileModel.BusinessStartDate.ToString("yyyy-MM-dd") })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessStartDate)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.Industry)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.Industry, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.Industry)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.Sector)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.Sector, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.Sector)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.StateOfFormation)
                    <br />
                    @Html.DropDownListFor(m => m.BusinessProfileModel.StateOfFormation, new SelectList(ViewBag.States, "Value", "Text"), "Select State", htmlAttributes: new { @class = "form-control", id = "StateOfFormationList" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.StateOfFormation)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.EmployeeCount)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.EmployeeCount, new { @type = "number", @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.EmployeeCount)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessStructure)
                    <br />
                    @Html.DropDownListFor(m => m.BusinessProfileModel.BusinessStructure, new SelectList(ViewBag.BusinessTypeList, "Value", "Text"), "Select Business Structure", htmlAttributes: new { @class = "form-control", id = "BusinessStructureList" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessStructure)
                </li>
            </ol>
        </fieldset>
    </div>
}


 

_BusinessFinancial.cshtml


@using Kendo.Mvc.UI
@model Reverberate.BLL.Model.Form.Application.BusinessOnboarding.BusinessOnboardingModel

<h2>Business Financial</h2>
<div style="width: 90%; border: 1px solid silver" id="BusinessInfoEntry">
    <fieldset>
        <legend></legend>
        <ol>
            <li>
                @Html.LabelFor(m => m.BusinessFinancialModel.CreditCardProcessor)
                @Html.TextBoxFor(m => m.BusinessFinancialModel.CreditCardProcessor, new { maxlength = 200, @class = "wide" })
                @Html.ValidationMessageFor(m => m.BusinessFinancialModel.CreditCardProcessor)
            </li>
            <li>
                @Html.LabelFor(m => m.BusinessFinancialModel.CreditCardMonthlyVolume)
                @Html.TextBoxFor(m => m.BusinessFinancialModel.CreditCardMonthlyVolume, new { maxlength = 20 })
                @Html.ValidationMessageFor(m => m.BusinessFinancialModel.CreditCardMonthlyVolume)
            </li>
            <li>
                @Html.LabelFor(m => m.BusinessFinancialModel.GrossMonthlySales)
                @Html.TextBoxFor(m => m.BusinessFinancialModel.GrossMonthlySales, new { @type = "date", @class = "form-control datepicker", @Value = Model == null || Model.BusinessProfileModel.BusinessStartDate == null ? null : Model.BusinessProfileModel.BusinessStartDate.ToString("yyyy-MM-dd") })
                @Html.ValidationMessageFor(m => m.BusinessFinancialModel.GrossMonthlySales)
            </li>
            <li>
                @Html.LabelFor(m => m.BusinessFinancialModel.AnnualRevenue)
                @Html.TextBoxFor(m => m.BusinessFinancialModel.AnnualRevenue, new { maxlength = 200, @class = "wide" })
                @Html.ValidationMessageFor(m => m.BusinessFinancialModel.AnnualRevenue)
            </li>
        </ol>
    </fieldset>
    <br />
</div>

 

 

 

here are the  three models


using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Reverberate.BLL.Model.Form.Application.BusinessOnboarding
{
    public class BusinessOnboardingModel
    {
        public BusinessProfileModel BusinessProfileModel { get; set; }

        public BusinessFinancialModel BusinessFinancialModel { get; set; }

    }
}




using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Reverberate.BLL.Model.Form.Application.BusinessOnboarding
{
    public class BusinessProfileModel
    {
        public BusinessProfileModel() { }

        [Required(ErrorMessage = "The business name is required.")]
        [DisplayName("*Business Name")]
        [StringLength(250)]
        public string BusinessName { get; set; }

        [DisplayName("*Federal Tax Id / SSN")]
        [StringLength(15, ErrorMessage = "Please enter a valid federal tax id or SSN")]
        [Required(ErrorMessage = "Please enter the federal tax id or SSN")]
        public string FederalTaxId { get; set; }

       

        [DisplayName("*Business Start Date")]
        [Required(ErrorMessage = "Please enter the business start date")]
        public DateTime BusinessStartDate { get; set; }

        [Required(ErrorMessage = "The industry is required.")]
        [DisplayName("*Industry")]
        [StringLength(500)]
        public string Industry { get; set; }

        [Required(ErrorMessage = "The sector is required.")]
        [DisplayName("*Sector")]
        [StringLength(500)]
        public string Sector { get; set; }


        [DisplayName("*State of Formation")]
        [Validation.InputValidation.ValidState(ErrorMessage = "This does not appear to be a valid US State.")]
        [Required(ErrorMessage = "The State of Formation is required.")]

        public string StateOfFormation { get; set; }
        

        [DisplayName("*No of Employees")]
        [Validation.InputValidation.ValidState(ErrorMessage = "Number of Employees.")]
        [Required(ErrorMessage = "Please Supply the number of employees.")]
        public int EmployeeCount { get; set; }


        [Validation.InputValidation.ValidBusinessType(ErrorMessage = "Please enter a valid business structure")]
        [Required(ErrorMessage = "The business structure required.")]
        [DisplayName("*Business Structure")]
        public string BusinessStructure { get; set; }
    }
}




using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Reverberate.BLL.Model.Form.Application.BusinessOnboarding
{
    public class BusinessProfileModel
    {
        public BusinessProfileModel() { }

        [Required(ErrorMessage = "The business name is required.")]
        [DisplayName("*Business Name")]
        [StringLength(250)]
        public string BusinessName { get; set; }

        [DisplayName("*Federal Tax Id / SSN")]
        [StringLength(15, ErrorMessage = "Please enter a valid federal tax id or SSN")]
        [Required(ErrorMessage = "Please enter the federal tax id or SSN")]
        public string FederalTaxId { get; set; }

       

        [DisplayName("*Business Start Date")]
        [Required(ErrorMessage = "Please enter the business start date")]
        public DateTime BusinessStartDate { get; set; }

        [Required(ErrorMessage = "The industry is required.")]
        [DisplayName("*Industry")]
        [StringLength(500)]
        public string Industry { get; set; }

        [Required(ErrorMessage = "The sector is required.")]
        [DisplayName("*Sector")]
        [StringLength(500)]
        public string Sector { get; set; }


        [DisplayName("*State of Formation")]
        [Validation.InputValidation.ValidState(ErrorMessage = "This does not appear to be a valid US State.")]
        [Required(ErrorMessage = "The State of Formation is required.")]

        public string StateOfFormation { get; set; }
        

        [DisplayName("*No of Employees")]
        [Validation.InputValidation.ValidState(ErrorMessage = "Number of Employees.")]
        [Required(ErrorMessage = "Please Supply the number of employees.")]
        public int EmployeeCount { get; set; }


        [Validation.InputValidation.ValidBusinessType(ErrorMessage = "Please enter a valid business structure")]
        [Required(ErrorMessage = "The business structure required.")]
        [DisplayName("*Business Structure")]
        public string BusinessStructure { get; set; }
    }
}

 


using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Reverberate.BLL.Model.Form.Application.BusinessOnboarding
{
    public class BusinessFinancialModel
    {
        public BusinessFinancialModel() { }

        [DisplayName("Credit Card Processor")]
        [StringLength(250)]
        public string CreditCardProcessor { get; set; }

        [DisplayName("Credit Card Monthly Volume")]
        public decimal CreditCardMonthlyVolume { get; set; }

        [DisplayName("Gross Monthly Sales")]
        public decimal GrossMonthlySales { get; set; }

        [DisplayName("AnnualRevenue")]
        public decimal AnnualRevenue { get; set; }


    }
}

 

As recommend in my other question here: I have created a sample project.   In this project there is an Index.cshtml which has my original structure.  With regards to the index.cshtml there are two things, one - I am not sure why validation doesn't occur on the original page load, I have to reload the page to force page validation and also on the done command there isn't any validation occuring.

 


I created ind.cshtml when I trying the recomemnded solution for the question here: https://www.telerik.com/forums/using-wizard---how-do-you-validate-a-form-when-step-includes-partial-view#5789804 and I am getting `

Severity Code Description Project File Line Suppression State
Error CS1660 Cannot convert lambda expression to type 'string' because it is not a delegate type 6_Views_Home_Index2.cshtml M:\Code\Development\WizardPartialExample\WizardPartialExample\WizardPartialExample\Views\Home\Index2.cshtml 19 Active`

 

 

Form
Wizard
Joshua
Top achievements
Rank 1
 updated question on 22 Feb 2024
1 answer
122 views
Using Wizard - how do you validate a form when step includes partial view.

I'm pretty much at the point I give up.  All I want to do is use the Wizard to load partial views for each step, and all I want to do is prevent the next step if the form can't be validated.  I've tried nearly everything for 3 days and I can't seem to find an answer.  I've tried jquery..validate and it just goes no where.

 

I just have a real simple setup, Business.cshtml which contains the wizard


@using Kendo.Mvc.UI
@model Reverberate.BLL.Model.Form.Application.BusinessOnboardingModel

@{
    ViewBag.Title = "Business Onboarding";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style>
    .wide {
        width: 95%;
    }

    .field-validation-error {
        color: red;
    }
</style>



    <!-- Wizard -->
    @(Html.Kendo().Wizard()
        .Name("wizard")
        .Events(ev => ev.Select("onSelect"))
        .Events(ev => ev.Done("onDone"))
        .LoadOnDemand(true)
        .ReloadOnSelect(false)
        .Steps(s =>
        {
            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboardingModel>()
            .Title("Business Profile")
            .ContentUrl(Url.Action("_BusinessProfile", "Onboard"))
            .Buttons(b =>
            {
                b.Next().Text("Next");
            });

            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboardingModel>()
            .Title("Business Financial")
            .ContentUrl(Url.Action("_BusinessFinancial", "Onboard", Model))
            .Buttons(b =>
            {
                b.Previous().Text("Back");
                b.Next().Text("Next");
            });
            s.Add<Reverberate.BLL.Model.Form.Application.BusinessOnboardingModel>()
            .Title("Business Address")
            .ContentUrl(Url.Action("_BusinessAddress", "Onboard", Model))
            .Buttons(b =>
            {
                b.Previous().Text("Back");
                b.Done().Text("Submit");
            });
        })
    )

<script type="text/javascript">
    var dataPartial1;
    var dataPartial2;
    var currentStep;

    function onSelect(e) {

       
        var form, contentUrl;

        if (e.step.options.index < currentStep) {
            e.preventDefault();
        }
        else {

            if (e.step.options.index == 1) {
                form = $('#frmPartialBusinessProfilefrmPartialBusinessProfile');
                dataPartial1 = form.serialize();
                contentUrl = '@Url.Action("_BusinessFinancial", "Onboard",Model)';
            }
            else if (e.step.options.index == 2) {
                form = $('#frmPartial2');
                dataLesions = form.serialize();
                contentUrl = '@Url.Action("_BusinessAddress", "Onboard",Model)';
            }
            if (!form.valid()) {
                alert('not valid');
                e.preventDefault();
            }
            else {
                alert('valid');
                e.step.options.contentUrl = contentUrl;
            }
            alert('done');
        }


        currentStep = e.step.options.index;
    }

    function onNextStep(e) {
        if (e.step.options.index == 2) {
            openDoc();
        }
    }

    function onDone(e) {

        var form = $('#frmMain');

        if (form.valid()) {
            form.submit();
        }

    }

    var onAddMainSuccess = function (result) {

        if (result.error) {
            alert(result.error);
        }
    };


</script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.13.1/jquery.validate.min.js"></script>

 

and a partial view called _BusinessProfile


@using Kendo.Mvc.UI
@model Reverberate.BLL.Model.Form.Application.BusinessOnboardingModel

<form id="frmPartialBusinessProfile" name="frmPartialBusinessProfile">
    <div style="width: 45%; float: left; border: 1px solid black" id="BusinessInfoEntry">
        <h3>Business Profile</h3>
        <fieldset>
            <legend></legend>
            <ol>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessName)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.BusinessName, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessName)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.FederalTaxId)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.FederalTaxId, new { maxlength = 20 })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.FederalTaxId)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessStartDate)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.BusinessStartDate, new { @type = "date", @class = "form-control datepicker", @Value = Model == null || Model.BusinessProfileModel.BusinessStartDate == null ? null : Model.BusinessProfileModel.BusinessStartDate.ToString("yyyy-MM-dd") })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessStartDate)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.Industry)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.Industry, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.Industry)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.Sector)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.Sector, new { maxlength = 200, @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.Sector)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.StateOfFormation)
                    <br />
                    @Html.DropDownListFor(m => m.BusinessProfileModel.StateOfFormation, new SelectList(ViewBag.States, "Value", "Text"), "Select State", htmlAttributes: new { @class = "form-control", id = "StateOfFormationList" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.StateOfFormation)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.EmployeeCount)
                    <br />
                    @Html.TextBoxFor(m => m.BusinessProfileModel.EmployeeCount, new { @type = "number", @class = "wide" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.EmployeeCount)
                </li>
                <li>
                    @Html.LabelFor(m => m.BusinessProfileModel.BusinessStructure)
                    <br />
                    @Html.DropDownListFor(m => m.BusinessProfileModel.BusinessStructure, new SelectList(ViewBag.BusinessTypeList, "Value", "Text"), "Select Business Type", htmlAttributes: new { @class = "form-control", id = "StateOfFormationList" })
                    @Html.ValidationMessageFor(m => m.BusinessProfileModel.BusinessStructure)
                </li>
            </ol>
        </fieldset>
    </div>
</form>

 

{

    public class BusinessOnboardingModel
    {
        public BusinessProfileModel BusinessProfileModel { get; set; }

        public BusinessFinancialModel BusinessFinancialModel { get; set; }
    }
}

 

and here is the BusinessProfileModel

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Reverberate.BLL.Model.Form.Application.BusinessOnboarding
{
    public class BusinessProfileModel
    {
        public BusinessProfileModel() { }

        [Required(ErrorMessage = "The business name is required.")]
        [DisplayName("*Business Name")]
        [StringLength(250)]
        public string BusinessName { get; set; }

        [DisplayName("*Federal Tax Id / SSN")]
        [StringLength(15, ErrorMessage = "Please enter a valid federal tax id or SSN")]
        [Required(ErrorMessage = "Please enter the federal tax id or SSN")]
        public string FederalTaxId { get; set; }

       

        [DisplayName("*Business Start Date")]
        [Required(ErrorMessage = "Please enter the business start date")]
        public DateTime BusinessStartDate { get; set; }

        [Required(ErrorMessage = "The industry is required.")]
        [DisplayName("*Industry")]
        [StringLength(500)]
        public string Industry { get; set; }

        [Required(ErrorMessage = "The sector is required.")]
        [DisplayName("*Sector")]
        [StringLength(500)]
        public string Sector { get; set; }


        [DisplayName("*State of Formation")]
        [Validation.InputValidation.ValidState(ErrorMessage = "This does not appear to be a valid US State.")]
        [Required(ErrorMessage = "The State of Formation is required.")]

        public string StateOfFormation { get; set; }
        

        [DisplayName("*No of Employees")]
        [Validation.InputValidation.ValidState(ErrorMessage = "Number of Employees.")]
        [Required(ErrorMessage = "Please Supply the number of employees.")]
        public int EmployeeCount { get; set; }


        [Validation.InputValidation.ValidBusinessType(ErrorMessage = "Please enter a valid business structure")]
        [Required(ErrorMessage = "The business structure required.")]
        [DisplayName("*Business Structure")]
        public string BusinessStructure { get; set; }
    }
}

Wizard
Anton Mironov
Telerik team
 answered on 22 Feb 2024
1 answer
735 views
Validating Data in a Wizard Step and Preventing Next Step

I have a multistep wizard.  I need to validate some data inside one of the steps.  If the validation fails I need to prevent the wizard from moving on to the next step. 

Right now I'm doing this in the Next button click event of the step I'm validating: 


var validator = $("#myForm").kendoValidator().data("kendoValidator");
var valState = validator.validate();
var wizard = $("#wizard").data("kendoWizard");

if(valState == true) {
   //do some stuff
}

//valState was not true, so do this -- this is where I want to stop the step from moving on
wizard.select(4) //4 is the index of the current step

But this doesn't seem to work.  The stepper always moves on to the next step, regardless of what step I tell the wizard to select.  The validations all fire and if you go back to this step, all the error messages show.  But I want the error messages to show and the Next button not to go to next, and that doesn't seem to be working.  How do I make this work?

Wizard
Anton Mironov
Telerik team
 answered on 06 Apr 2023
1 answer
174 views
Wizard (asp.net mvc) how to get the from where which step the user came

Let us say the a wizard has 5 steps.
Where user goes from step 2 -> step 3, I want to do some activity.
Currently I use e.step.options.index inside onSelect  method to do that.


function onSelect(e) {
    if (e.step.options.index == 3) {
       //do something
    }
}

 

The problem is the "//do something" is also executed when user comes to step 3 from step 4 (step 4 -> step 3).
I do NOT want this to happen. I want to prevent this from happening.

How do I do it?

How do I know which step the user came from?

Wizard
Ivan Danchev
Telerik team
 answered on 03 Aug 2021
1 answer
112 views
Wizard (asp.net mvc) wait for response before next step

I am building a wizard using Kendo asp.net mvc Wizard control.

I was wondering if there is a way to wait for an ajax response before proceeding to next step when required.

Eg: The wizard allows the user to add a user for the organization. One of the steps in between lets user choose a department, or create new one. If the user opts to create a new department,  I call an ajax request which creates a department. All good till now.

However, I want to confirm the creation of the new department before user is shown the next step. If the department record creation is successful, next step is loaded. If not, the user stays in the same step.

Is this possible

Wizard
Eyup
Telerik team
 answered on 03 Aug 2021
1 answer
486 views
Wizard next save temporary result

Hi,

How can I save the results of all steps when filling in all the Wizard steps ?  (in Telerik Asp.Net MVC Wizard control)

Lets say that step 2 is dependant on step 1 (screen should be rendedered with/without certain controls dependant of what was filled in on step 1.

How can I achieve this ?

Is there a serverside 'Next' click event or so ? Or a Select step event or so ?  I havent seen it to my dissapointing surprise.

(I know I can load content tabs with Ajax, but that doesnt give me the entered data.)

Martin

 

Wizard
Ivan Danchev
Telerik team
 answered on 02 Jul 2021
9 answers
794 views
Wizard Submission

How can I submit the wizard's model to the Controller.i.e. on Done(), how can submit the binded model to the controller?

please hep. I am new and stuck on this.

Wizard
Marconi
Top achievements
Rank 1
Veteran
 answered on 08 Nov 2020
6 answers
344 views
Changing the Step
 function poWizardReset(e) {
    if(e.sender.currentStep.options.index === 0) {
        $initPo.val('');
        $initPart.val('');
        $initLineItem.value('');
        $initAckId.value(0);
    }
 
    if (e.sender.currentStep.options.index === 1) {
        $initVerifyPo.val('');
        $initVerifyStockRoom.val('');
        $initVerifySupCode.val('');
        $initVerifySupName.val('');
        $initVerifyLineItem.val('');
        $initVerifyPart.val('');
        $initVerifyUoM.val('');
        $initVerifyAllowed.value(0);
    }
 
    if (e.sender.currentStep.options.index === 2) {
        $finalPart.val('');
        $finalPo.val('');
        $finalLineItem.val('');
        $finalAllowed.value(0);
        $finalPrinterId.value(0);
 
        $finalPackingSlip.val('');
        $finalQuantity.value(0);
        $finalCarrierTracking.val('');
        $finalCarrierId.value(0);
        $finalMulti.checked(false);
    }
 
    if (e.sender.currentStep.options.index === 3) {
    }
}

 

On the reset button click and the corresponding event, how would I navigate between the steps?

 

 

 

 

Wizard
Headygains
Top achievements
Rank 1
Veteran
 answered on 07 Oct 2020
1 answer
423 views
Grid in Wizard

Hi,

I'd like to add a grid in one of my steps but having a hard time figuring this out and no good examples. I'd like to load the content by calling my controller using the method ".LoadContentFrom("ActionName", "ControlerName");" which you have the ability to with many other controls but for now I think using a TemplateId will work?

 

Thanks,

Wizard
Martin
Telerik team
 answered on 01 Oct 2020
Narrow your results
Done
Selected tags
Wizard
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
Date/Time Pickers
Upload
ComboBox
ListView
Window
MultiSelect
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
NumericTextBox
PanelBar
Filter
ToolTip
Map
Diagram
PivotGrid
Button
Form
ListBox
Splitter
Application
FileManager
Sortable
View
MaskedTextBox
Calendar
TextBox
PDFViewer
DropDownTree
MultiColumnComboBox
Toolbar
Dialog
Checkbox
Slider
Notification
Switch
ListView (Mobile)
ColorPicker
DateRangePicker
Pager
Accessibility
MediaPlayer
Security
Chat
Drawer
SplitView
Styling
TileLayout
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
RadioGroup
Sparkline
TabStrip (Mobile)
DateInput
Gauge
ModalView
ResponsivePanel
Stepper
TextArea
Template
Badge
Breadcrumb
ExpansionPanel
ImageEditor
ScrollView
ButtonGroup
GridLayout
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Rating
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
AppBar
BottomNavigation
Card
FloatingActionButton
Licensing
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
DropDownButton
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Learn how
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Learn how
Want to show your ninja superpower to fellow developers?
Learn how