Passing data from Form with variable number of inputs - MVC 5

Question

I've been looking for similar questions in here but still couldn't find a solution to my problem.

I have a page that contains some text and a form and they both share the same ViewModel as follows:

public class MyViewModel
 {
   public IEnumerable<WordingB> WordingBs { get; set; }
   public IEnumerable<WordingC> WordingCs { get; set; }
   public IEnumerable<Question> Questions { get; set; } 
}

Here's a bit more detail about WordingB, WordingC and Question:

public class WordingB
    {           
        public string EOW { get; set; }
    }



public class WordingC
    {           
        public string EOW { get; set; }
    }




public class Question
    {           
        public string QuestionText { get; set; }
        public string Answer {get; set;}
    }

And this is the page in question:

@model MyProject.ViewModels.MyViewModel   

<div class="col-md-6 masonry listview-block">
    @foreach (var wording in Model.WordingBs)
    {
        <div class="block">                
            <p>@Html.Raw(@wording.EOW)</p>
        </div>
    }
    @foreach (var wording in Model.WordingCs)
    {
        <div class="block">              
            <p>@Html.Raw(@wording.EOW)</p>
        </div>
    }

</div>


@using (Ajax.BeginForm("Routing", "Partials", new AjaxOptions { UpdateTargetId = "Target", LoadingElementId = "spinner", HttpMethod = "POST", InsertionMode = InsertionMode.Replace }))
{


            <div id="quick-post" class="block-body form-validation">
                @foreach (var question in Model.Questions)
                {
                    <div class="form-group">
                        <label for="QuestionText">@question.QuestionText</label>
                        <input type="text" class="form-control input-sm input-sm" name="Answer">
                    </div>
                }
                <div class="form-group">
                    <label for="postcode">PostCode</label>
                    <input type="text" class="form-control input-sm validate[required] input-sm" name="postcode" [email protected]["postcode"]>

                </div>

                <div class="form-group">
                    <label>Loss Description</label>
                    <textarea></textarea>
                </div>

                <input type="submit" class="btn btn-primary btn-xs" value="Route">

            </div>

        </div>
    </div>

}

The idea is that some Admin person is able to add questions to the form. (questions are stored in a table) There's a controller that uses the MyViewModel and returns the model that I need to the view.

 public ActionResult EOW()
        {
            QuestionsandWording viewModel = new QuestionsandWording();

            viewModel.Questions = // first query

            viewModel.WordingBs = // second query

            viewModel.WordingCs = // third query

            return View(viewModel);
        }

The problem that I am facing now is passing the data from my form to a controller. The form can have zero to 30 or 40 questions as far as I'm concerned! I feel like I've hit the limit of my knowledge and I'm in serious need of advice.

possible duplicate of ASP.NET MVC form handling unknown number of inputs — Mike Cheel
– Mike Cheel, Commented Sep 4, 2014 at 19:10
What exactly is you question? What is the problem your trying to solve? — user3559349
– user3559349, Commented Sep 5, 2014 at 0:46
Hi sorry for not being very clear. What I would like to achieve is to take everything in my form (both labels and textareas) and redisplay them in another page. I can't do it on the browser side as the data needs to be checked against my database. As you can see I have a variable number of questions (consequently asnwers too). — Ouanixi
– Ouanixi, Commented Sep 5, 2014 at 12:19

Ouanixi · Accepted Answer · 2014-09-05 13:19:15Z

With the help of cosset and Derek, I managed to find a workaround as follows:

1) I gave a name to my input element like this:

<input type="text" name="Answer">

I didn't need to iterate with Answer[i] as suggested on one of the answers as the framework automatically binds all inputs with same name into a List element that my method can take as an argument. Like this:

public ActionResult Routing(List<string> Answer){}

2) I also needed to use the value of my label tags in my Routing method and had no clue how to do it. Again, Cosset suggested that I use a hidden field and give it a value of the label text. This worked perfectly.

<label for="Answer">@question.QuestionText</label>
<input type="hidden" name="QuestionText" [email protected] />

And the method now looks like this :

public ActionResult Routing(List<string> Answer, List<string> QuestionText){}

Now I've got what I needed. To pass all data from my form to the controller (Both labels and inputs) without having to worry about the MyViewModel.

For the sake of learning, I would quite like to know if there are any other ways of achieving this at all.

Derek Hackett · Accepted Answer · 2014-09-04 19:12:24Z

1

What you should do is create a post back method that binds to the ViewModel in the view so that the MVC framework returns the model data for you.

The Method would look something like this

[Post]
public ActionResult EOW(MyViewModel viewModel)
    {
       //Do something  
        return View();
    }

answered Sep 4, 2014 at 19:12

Derek Hackett

20010 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:47:11Z

0

At first use Html helpers

@{int i = 0;}
@foreach (var question in Model.Questions)
            {
                <div class="form-group">
                    <label for="QuestionText">@question.QuestionText</label>
                    <input type="text" class="form-control input-sm input-sm" name="Answer[i]">
                </div>
i++;
            }

And viewmodel

public class Question
{           
    public string QuestionText { get; set; }
    public IEnumerable<string> Answer {get; set;}
}

And read this tutorials

1 2 3

edited May 23, 2017 at 11:47

CommunityBot

11 silver badge

answered Sep 4, 2014 at 19:18

vborutenko

4,4535 gold badges32 silver badges50 bronze badges

4 Comments

Ouanixi Over a year ago

Thank you very much for this, it has actually pointed me to the right direction. The problem I am facing now is to pass the value of my labels to my controller ! I would be very thankful if you could help.

vborutenko Over a year ago

Add under each label hidden field.The value of this field should be equal of label text

Ouanixi Over a year ago

Hi again, I'm facing a problem with the label text. As I previously mentionned the questions on the label are pulled from a database, I have no idea how many questions my form will have and therefore the value of my hidden field will need to be taken from the Model as follows: <input type="hidden" name="QuestionText" [email protected] /> However, Only the first word of the string is getting passed to the controller! Do you have any idea how to get the entire string passed ?

vborutenko Over a year ago

in cycle <input type="hidden" name="QuestionText" value=@question[i].QuestionText />

Collectives™ on Stack Overflow

Passing data from Form with variable number of inputs - MVC 5

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related