We help IT Professionals succeed at work.

Display selected value of dropdown list in page

Robert Francis
on
76 Views
Last Modified: 2015-01-03
I want to be able to display the value from a dropdown list on a page. You will see a section under the dropdown code <p>Dropdown selection goes here</p>. Here is my code so far:

@model List<Portal2.Models.V_Routings>

@{
    Layout = "~/Views/Shared/_masterLayout.cshtml";
}

<div class="form-group-sm">
    <form action="~/routings" method="post">
        <select class="form-control"name="ddlRoutings" onchange="this.form.submit()" id="ddlRoutings">
            <option value=""></option>
            <option value="Band Saw">Band Saw</option>
            <option value="Drillpress">Drillpress</option>
            <option value="Fab">Fab</option>
            <option value="Fadal 3016">Fadal 3016</option>
            <option value="Fadal 4020">Fadal 4020</option>
            <option value="Fadal 8030">Fadal 8030</option>
            <option value="Fineline">Fineline</option>
            <option value="Flexarm">Flexarm</option>
            <option value="Laser">Laser</option>
            <option value="Mach.Shop">Mach.Shop</option>
            <option value="Mazakqt200">Mazakqt200</option>
            <option value="Part Mark">Part Mark</option>
            <option value="Pem-Press">Pem-Press</option>
            <option value="Powder">Powder</option>
            <option value="Pressbrake">Pressbrake</option>
            <option value="QC">QC</option>
            <option value="Welding">Welding</option>
            <option value="Sandblast">Sandblast</option>
            <option value="WJ 1 Head">WJ 1 Head</option>

        </select>
    </form>
</div>

<p>Dropdown selection goes here</p>

<table class="table" cellspacing="0" cellpadding="4" rules="all" border="1" id="cphMain_GridView1" style="color:#333333;border-collapse:collapse;">
    <tbody>
        <tr>
            <th scope="col">Promised Date</th>
            <th scope="col">Job</th>
            <th scope="col">Customer</th>
            <th scope="col">Part Number</th>
            <th scope="col">Description</th>
            <th scope="col">Rev</th>
            <th scope="col">Promised Quantity</th>
            <th scope="col">Remaining Quantity</th>
            <th scope="col">Status</th>
            <th scope="col">Comment</th>
        </tr>
        @foreach (var item in Model)
            {
                var cssName = "";
                if (item.Promised_Date < DateTime.Now.Date)
                { cssName = "passed"; }
                else if (item.Promised_Date == DateTime.Now.Date)
                { cssName = "current"; }
                <tr class="@cssName">
                    <td>@item.Promised_Date.ToString("MM/dd/yyyy")</td>
                    <td><a href="/routing/jobdetails/@item.Job">@item.Job</a></td>
                    <td>@item.Customer</td>
                    <td>@item.Part_Number</td>
                    <td>@item.Description</td>
                    <td>@item.Rev</td>
                    <td>@item.Promised_Quantity</td>
                    <td>@item.Remaining_Quantity</td>
                    <td>@item.Status</td>
                    <td>@item.Comment</td>
                </tr>
            }
    </tbody>
</table>

Open in new window

Comment
Watch Question

You could modify your Model and add a property that hold the value selected
<p>@Model.SomeProperty</p>

Open in new window

Robert FrancisDirector of Continuous Improvement

Author

Commented:
I am an extreme beginner here. This is the code for my model:

namespace Portal2.Models
{
    using System;
    using System.Collections.Generic;
    
    public partial class V_Routings
    {
        public string Job { get; set; }
        public string Customer { get; set; }
        public string Rev { get; set; }
        public string Part_Number { get; set; }
        public string Description { get; set; }
        public string Status { get; set; }
        public int Promised_Quantity { get; set; }
        public string Order_Unit { get; set; }
        public System.DateTime Promised_Date { get; set; }
        public string Comment { get; set; }
        public string Work_Center { get; set; }
        public string Expr1 { get; set; }
        public Nullable<int> Remaining_Quantity { get; set; }
    }
}

Open in new window


I am trying to put the Work_Center value in the text area.
<p>@Model.Work_Center</p>

Open in new window

Robert FrancisDirector of Continuous Improvement

Author

Commented:
Thanks for your quick response. I had already tried that. I am getting this:

Compilation Error

Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS1061: 'System.Collections.Generic.List<Portal2.Models.V_Routings>' does not contain a definition for 'Work_Center' and no extension method 'Work_Center' accepting a first argument of type 'System.Collections.Generic.List<Portal2.Models.V_Routings>' could be found (are you missing a using directive or an assembly reference?)

Source Error:


Line 33: </div>
Line 34: <br/>
Line 35: <p>@Model.Work_Center</p>
Line 36:
Line 37: <table class="table table-striped table-bordered" id="cphMain_GridView1">
I didn't realize that you specify a List<Portal2.Models.V_Routings>

Suppose the Work_Center is the same in all items returned.
<p>@Model[0].Work_Center</p>

A more maintanable code
   public partial class V_Routings
   {
        public string Work_Center { get; set; }
       // Put other attibutes here ...

        public List<RoutingItems> Items { get; set; }
   }

    public class RoutingItems
    {
        public string Job { get; set; }
        public string Customer { get; set; }
        public string Rev { get; set; }
        public string Part_Number { get; set; }
        public string Description { get; set; }
        public string Status { get; set; }
        public int Promised_Quantity { get; set; }
        public string Order_Unit { get; set; }
        public System.DateTime Promised_Date { get; set; }
        public string Comment { get; set; }
        public string Expr1 { get; set; }
        public Nullable<int> Remaining_Quantity { get; set; }
    }

Open in new window

Robert FrancisDirector of Continuous Improvement

Author

Commented:
Index was out of range. Must be non-negative and less than the size of the collection.
Parameter name: index

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection.
Parameter name: index

Source Error:


Line 32:     </form>
Line 33: </div>
Line 34: <p>@Model[0].Work_Center Routing</p>
Line 35: <br />
Line 36: <table class="table table-striped table-bordered table-condensed" id="cphMain_GridView1">
This means your List<Portal2.Models.V_Routings> is empty.

Add a check
<p>
@if ( Model.Any() )
{
    @Model[0].Work_Center
}
</p>

Open in new window

Robert FrancisDirector of Continuous Improvement

Author

Commented:
The table right below that is working and filling with data from the same model.

        @foreach (var item in Model)
            {
                var cssName = "";
                if (item.Promised_Date < DateTime.Now.Date)
                { cssName = "passed"; }
                else if (item.Promised_Date == DateTime.Now.Date)
                { cssName = "current"; }
                <tr class="@cssName">
                    <td>@item.Promised_Date.ToString("MM/dd/yyyy")</td>
                    <td><a href="/routing/jobdetails/@item.Job">@item.Job</a></td>
                    <td>@item.Customer</td>
                    <td>@item.Part_Number</td>
                    <td>@item.Description</td>
                    <td>@item.Rev</td>
                    <td>@item.Promised_Quantity</td>
                    <td>@item.Remaining_Quantity</td>
                    <td>@item.Status</td>
                    <td>@item.Comment</td>
                </tr>
            }
    </tbody>
</table>

Open in new window

This works on my computer VS2013 + framework 4.5 + MVC5

Also you should tag the string "Routing"
<p>@Model[0].Work_Center <span>Routing</span></p>
Director of Continuous Improvement
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION
Robert FrancisDirector of Continuous Improvement

Author

Commented:
Never got a working answer

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.