ASP.NET MVC dynamicaly save data prior to Html.BeginForm submission

Question

I'm sure this has been answered before but I think my search vocabulary is throwing me off. I need to be able to add data to the elements of the form below, specifically the "Commands", "Parameters", and "Security" fields, before I submit the whole form.

@using (Html.BeginForm("CreateTemplateStep", "TemplateStep"))
{
<div>
    @Html.LabelFor(model => model.Name)
    @Html.EditorFor(model => model.Name)
</div>
<div>
    @Html.LabelFor(model => model.ExecutionOrder)
    @Html.EditorFor(model => model.ExecutionOrder)
</div>
<div>
    @Html.LabelFor(model => model.Description)
    @Html.EditorFor(model => model.Description)
</div>
<div>
    @Html.LabelFor(model => model.Type)
    @Html.DropDownListFor(model => model.Type, Enum.GetNames(typeof(Helion.JobScheduler.Models.StepType)).Select(e => new SelectListItem { Text = e }))
</div>    
<div>
    @Html.LabelFor(model => model.Commands)
    @Html.EditorFor(model => model.Commands)         
</div>
<div>
    @Html.LabelFor(model => model.Parameters)
    @Html.EditorFor(model => model.Parameters)
</div>
<div>
    @Html.LabelFor(model => model.Security)
    @Html.EditorFor(model => model.Security)
</div>

<button type="submit" class="btn btn-default btn-primary">Save</button>
<input type="button" value="Cancel" onclick="location.href='@Url.Action("Template","Template")';" class="btn btn-default" />
}

So I will need to add as many commands as I need then when I hit submit on the form the whole list of commands will be submitted. Any help is greatly appreciated.

[DataModel("JOB", "TEMPLATE_STEP")]
public class TemplateStep
{
        public const string TABLE_NAME = "TEMPLATE_STEP";

        [PKIdentityDataColumn("TEMPLATE_STEP_ID")]
        public long? TemplateStepID { get; set; }
        [DataModelColumn("TEMPLATE_ID")]
        public long TemplateID { get; set; }
        [DataModelColumn("EXECUTION_ORDER")]
        public int ExecutionOrder { get; set; }
        [DataModelColumn("NAME")]
        public string Name { get; set; }
        [DataModelColumn("DESCRIPTION")]
        public string Description { get; set; }
        [DataModelColumn("TYPE")]
        public StepType Type { get; set; }
        [DataModelColumn("COMMAND_XML")]
        public string CommandXML { get; set; }
        [DataModelColumn("PARAMETER_XML")]
        public string ParameterXML { get; set; }
        [DataModelColumn("SECURITY_XML")]
        public string SecurityXML { get; set; }

        public List<NameValuePair> Commands { get; set; }
        public List<NameValuePair> Parameters { get; set; }
        public List<NameValuePair> Security { get; set; }        
}

Here is the associated model as well as the NameValuePair class.

public class NameValuePair
{
    public string Name { get; set; }
    public string Value { get; set; }
}

We used a custom "KeyValuePair" because we couldn't get the editor templates to work for the actual "KeyValuePair" structure.

Not clear what your asking. Do you want to submit a collection of `Commands`? What is typeof `Commands`? You need to show your model — , Oct 20 '15 at 21:59
Are you wanting to dynamically add and delete new `NameValuePair` items for `Commands` etc, or just edit existing ones? — , Oct 20 '15 at 22:07
I need to be able to add, delete and edit. As far as how dynamic it is, I just need it to work for now so I can move forward. If it refreshes the page or not when you add the particular item is not a huge concern at this point in the project. — MilesR, Oct 20 '15 at 22:12
@MilesR, Refer the answers [here](http://stackoverflow.com/questions/29161481/post-a-form-array-without-successful/29161796#29161796) and [here](http://stackoverflow.com/questions/28019793/submit-same-partial-view-called-multiple-times-data-to-controller/28081308#28081308) for some examples — , Oct 20 '15 at 22:37

score 0 · Accepted Answer · answered Oct 21 '15 at 16:54

Thanks for the links and suggestions @Stephen Muecke. I needed something quick and easy so my partner could continue what he was doing. All I did is add a couple of buttons to each field I needed to add in the view.

<div>        
    @Html.LabelFor(model => model.Commands)
    @Html.EditorFor(model => model.Commands)
    <input type="submit" name="command" value="addCom" class="btn btn-default btn-primary" />              
</div>
<div>
    @Html.LabelFor(model => model.Parameters)
    @Html.EditorFor(model => model.Parameters)
    <input type="submit" name="command" value="addParam" class="btn btn-default btn-primary" />
</div>
<div>
    @Html.LabelFor(model => model.Security)
    @Html.EditorFor(model => model.Security)
    <input type="submit" name="command" value="addSec" class="btn btn-default btn-primary" />
</div>

Then just added some conditionals to my controller function.

public ActionResult CreateTemplateStep(TemplateStep templateStep, string command)
    {
        if (command.Equals("addParam"))
        {
            templateStep.Parameters.Add(new NameValuePair());

            return View("CreateTemplateStep", templateStep);
        }
        else if (command.Equals("addCom"))
        {
            templateStep.Commands.Add(new NameValuePair());

            return View("CreateTemplateStep", templateStep);
        }
        else if (command.Equals("addSec"))
        {
            templateStep.Security.Add(new NameValuePair());

            return View("CreateTemplateStep", templateStep);
        }
        else if(command.Equals("saveStep")){ 
            Biz.SaveTemplateStep(templateStep);

            return RedirectToAction("EditTemplate", "Template", new {id = templateStep.TemplateID });
        }
        else
        {
            return View("CreateTemplateStep", templateStep);
        }
    }

Like I said quick and dirty to keep the ball rolling. This will be changing in the future to be cleaner and more dynamic. I will update as things change. Any further suggestions or ideas will be greatly appreciated.

ASP.NET MVC dynamicaly save data prior to Html.BeginForm submission

1 Answers1