1

Sorry for the confusing title, i'm having trouble trying to explain what I am trying to achieve. I have a view, that currently displays 'Trips' from my database (Destination, Type, Price etc). I have used an actionlink and my aim is to be able to select a trip, click the actionlink and be taken to a 'booking' page. The booking page will display the information for the actionlink selected, and I will add a drop down list to select the number of people going on the trip.

What is the best way to achieve this? Would a session be viable here? I'm completely new to MVC and am still trying to wrap my head around the way it works! Thanks in advance to anyone who reads this!

actionLink

TripController code -

namespace WebApplication5.Controllers
{
public class TripController : Controller
{
    // GET: Trip
    public ActionResult Index()
    {
        return View();
    }
    public ActionResult List()
    {
        List<Trips> trips = new List<Trips>();
        using (SampleModel dc = new SampleModel())
        {
            trips = dc.Trips.ToList();
        }
            return View(trips);
    }
    public ViewResult Booking()
    {

        return View();
    }
}
}

TripsModel code -

[Table("Trips")]
public partial class Trips
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.None)]
    public int TripID { get; set; }

    [StringLength(50)]
    public string Destination { get; set; }

    [StringLength(50)]
    public string Type { get; set; }

    public int? Price { get; set; }
}

Trip ListView code -

@model List<WebApplication5.Models.DB.Trips>

@{
ViewBag.Title = "List of trips";
var grid = new WebGrid(source: Model, canPage: true, rowsPerPage: 10);
grid.Pager(WebGridPagerModes.All);
}

<h2>List of Trips</h2>

<div id="content">
@grid.GetHtml(
            tableStyle: "webgrid-table",
            headerStyle: "webgrid-header",
            footerStyle: "webgrid-footer",
            alternatingRowStyle: "webgrid-alternating-row",
            rowStyle: "webgrid-row-style",
            columns: grid.Columns(
                grid.Column(columnName: "TripID", header: "TripID"),
                grid.Column(columnName: "Destination", header:     "Destination"),
                grid.Column(columnName: "Type", header: "Type"),
                grid.Column(columnName: "Price", header: "Price"),               
                grid.Column(columnName: "Book", format: (item) =>     Html.ActionLink("Book", "Booking", new { id = item.TripID }))
                ))

</div>

TripBookingView code -

@model WebApplication5.Models.DB.Trips
ACostea
  • 141
  • 2
  • 18
  • A link instead of a radio button would make this easier, but with you current UI, you need to handle the `.click()` event of the button and build a url to the method you want to redirect to (including the value of the selected radio button which would be the ID of the `Trip`) and then use `location.href = yourUrl;` –  Mar 21 '17 at 12:41
  • How will a link make it easier, and what would I need to change to replace the radio buttons with links? Thanks @StephenMuecke – ACostea Mar 21 '17 at 12:56
  • Because it can simply be `@Html.ActionLink("Book", "Booking", new { id = item.TripID })` (refer [this answer](http://stackoverflow.com/questions/6167903/using-data-in-a-html-actionlink-inside-a-webgrid-column-not-possible) for more detail) –  Mar 21 '17 at 13:00
  • @StephenMuecke I am still not able to get it working this way, even after reading through the answer you provided. I have created a booking view, added the return View() for the booking class but the Booking view doesn't show the trip that was selected on the previous page! – ACostea Mar 21 '17 at 14:10
  • I'm not psychic and cannot guess what errors you have in your code. Edit your question showing what you tried (and delete all the irrelevant code such as your css - and we only need to see one of 2 properties - [How to create a Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve) –  Mar 21 '17 at 22:29
  • @StephenMuecke Hi Stephen, I have edited my question to show it at its current state. I don't currently have any errors, I am now just trying to get the action link pressed on the gridview to display that trips details on the TripBooking view. I have tried various pieces of code in both the TripController and the Booking view but nothing has worked thus far. Do you have any ideas on how I can achieve this? Thanks – ACostea Mar 22 '17 at 06:29
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/138702/discussion-between-stephen-muecke-and-acostea). –  Mar 22 '17 at 06:39

2 Answers2

0

so the simplest idea is to write a script function like

 @section scripts{
<script>
$(function(){
$('#book').on('click',function(){
 windows.location.href('@url.ActionLink('Booking','Trip',new{price = price}))
})
})
<script>
}

and in the Controller side

public Task ActionResult Booking(int price)
{
//Do your stuff
}
RAHUL S R
  • 1,569
  • 1
  • 11
  • 20
0

Instead of giving Button outside you can render the button/ link in each row of the grid as below

@grid.GetHtml(columns: new [] {
grid.Column(
"",
header: "Actions",
format: @<text>@Html.ActionLink("Book", "Book", new { id=item.TripID})</text> ) });

and in controller change your controller to

public ActionResult Book(int TripID)
{
  //bring required data from DB for the TripID you received
}