Transfer data from view to controller

Question

Hello! I am quite new to .Net MVC and building a web app for the first time looking for some better explained processes.

I am trying to get a string input from a view (index) to a controller (home controller). Through a little research I can see this is usually done by something called a "Model" where essentially you would store the data from the view, INTO the model and then, in the controller it takes that model as a parameter and you are able to use it. While this process sounds great I have been unable to do it.

Here is my index.cshtml page:

@using RequestPrototype.Models



            
                
                    Enter Ticker

My userInput.cs model:

namespace RequestPrototype.Models
{
    public class userInput
    {
        // holds the user response from the index page
        public string? Ticker { get; set; }
    }
}

Lastly my HomeController.cs:

using RequestPrototype.Models;

namespace RequestPrototype.Controllers
{
    public class HomeController : Controller
    {
        public IActionResult Index(userInput input)
        {
                 String ticker = input.Ticker;
                 return View();
            }

        }
    }
}

I'd also be interested as to how you could then return data from a controller to a view using a different model than the input one? Also, I'm using .NET 6 if that was important.
Thank you for reading!

Answer

Views pass data to controller in one of two ways (ignoring JavaScript ajax calls).

An anchor () where the data is passed as query string name/value parameters. The mvc data binding will bind the parameters to the controllers action parameters by name.

A form post. The form data is again passed as names / value pairs. Again the form element name must match the models property name to bind to.

In your case you appear to want to do the second case, but did not define a form in the view.

When a submit button is clicked, only the form elements in the same form as the submit button are posted. Also a page can have many forms, but only one form and it’s elements can be posted.

Answer

Hi @Ted ,

As Bruce-SqlWork said, to pass data from view to the controller, we need to add the data to the request URL (use the query string, then the request URL like this: /Home/Index?Ticker=AAA) or submit a form (use the

tag).

General, in the index page, it will use the display a list of userInput, then, if you also want to create new userInput, you could use a tag to submit a form to insert new records.

The Index.cshtml like this: Note: At the top of the page, we are using an IEnumerable or List type to receive the returned model from the action. Then in the form tag, we are using an input element with the name Ticker, after submitting the form, in the action method, it will get the value via the name attribute.

@model IEnumerable  
  
@{  
    ViewData["Title"] = "Index";  
}  
  
Index  
  
  
      
          
              
              
                Ticker  
                   
              
              
                  
              
          
      
  
  
@foreach (var item in Model) {  
          
}  
      
      
          
              
                @Html.DisplayNameFor(model => model.Ticker)  
              
              
          
      
      
              
                @Html.DisplayFor(modelItem => item.Ticker)  
              
              
                Edit |  
                Details |  
                Delete

Then, the controller like this:

public class RequestPrototypeController : Controller  
{  
    private readonly ApplicationDbContext _dbcontext;  
    public RequestPrototypeController(ApplicationDbContext applicationDbContext)  
    {  
        _dbcontext = applicationDbContext;  
    }  
    public IActionResult Index(string Ticker)  
    {  
        if (!string.IsNullOrEmpty(Ticker))  
        {  
            //if tricker is not null, insert the value into database.  
            _dbcontext.UserInput.Add(new userInput() { Ticker = Ticker });  
            _dbcontext.SaveChanges();  
        }  
           
        //define a list to store the latest data.  
        var items = new List();    
        //get the latest  data from database.  
        items = _dbcontext.UserInput.ToList();  

        //return the data to the view page.  
        return View(items);  
    }

Then, the output like this:

Besides, you can also create a Create page to create the new item, then the Create page like this:

Create.cshtml: Note: in this page, the page model is userInput, and we can use asp.net core tag helper to bind property

@model WebApplication2.Models.userInput  
  
@{  
    ViewData["Title"] = "Create";  
}  
  
Create  
  
userInput

The Create action methods:

    public IActionResult Create()  
    {  
        return View();  
    }  
    [HttpPost]  
    public IActionResult Create(userInput userInput)  
    {  
        //check whether the model is valid or not  
        if (!ModelState.IsValid)  
        {  
            //if not valid, return to the create page with the userinput model  
            return View(userInput);  
        }  

        //if model is valid, insert the data into database.  
        _dbcontext.UserInput.Add(new userInput() { Ticker = userInput.Ticker });  
        _dbcontext.SaveChanges();  
        //redirect to the index action to display the latest data.  
        return RedirectToAction(nameof(Index));  
    }

Then, the output like this:

More detail information, refer the following tutorials:

Part 6, controller methods and views in ASP.NET Core

Views in ASP.NET Core MVC

Tutorial: Implement CRUD Functionality - ASP.NET MVC with EF Core

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,
Dillion

Share via

Transfer data from view to controller

2 answers

Your answer