locked
Is there a way to get a value of a drop down box in mvc? RRS feed

  • Question

  • User2130491911 posted

    Hi All,

    I am trying to use a simple yes/ no drop down list of values to hide and unhide a div area on the screen.

    So I found some code that helps make make the dropdown list.

            @{
                var Q1_YesNoList = new List<SelectListItem>();
                Q1_YesNoList.Add(new SelectListItem { Text = "Yes", Value = "1" });
                Q1_YesNoList.Add(new SelectListItem { Text = "No", Value = "0" });
            }
    
    
    
            @{
                var Q2_YesNoList = new List<SelectListItem>();
                Q2_YesNoList.Add(new SelectListItem { Text = "Yes", Value = "1" });
                Q2_YesNoList.Add(new SelectListItem { Text = "No", Value = "0" });
            }
    

    So this makes the dropdown list just fine but I can't seem to find a way to extract what was selected so that I can use it on the razor form so that

    I can hide the div.

    This does not work:

            @if (Q1_YesNoList = "1")
            { 
                <div id="Q2" style="display:uset">
    
                    <h1>Question Two:</h1>
                    <div>
                       Some Text : @Html.DropDownList("DropdownlistName", Q2_YesNoList)
                    </div>
    
                </div>
            }

    Is there a way to get the value of the dropdown so that I can activet the div to come into view and be visible once the user selects yes?

    Thanks in advance!

    Wednesday, June 17, 2020 8:23 PM

Answers

  • User1120430333 posted
    <div class="form-group">
                    <div class="editor-field">
                        @Html.Label("Author:")
                        <select name="PayRoll.AuthorTypeId" asp-items="Model.PayRoll.AuthorTypes"></select>
                        <span class="alert-danger" asp-validation-for="PayRoll.AuthorTypeId"></span>
                    </div>
    using System.Collections.Generic;
    using System.ComponentModel.DataAnnotations;
    using Microsoft.AspNetCore.Mvc.Rendering;
    
    namespace WebRazor3.x.Models
    {
        public class PayRollVM
        {
            public class Payroll
            {
                public int PayRollId { get; set; }
                public int AuthorId { get; set; }
                public string AuthorFirstName { get; set; }
                public string AuthorLastName { get; set; }
    
                [Required(ErrorMessage = "Author is required")]
                public string AuthorTypeId { get; set; }
    
                [Required(ErrorMessage = "Salary is required")]
                public int? Salary { get; set; }
    
                public List<SelectListItem> AuthorTypes { get; set; } = new List<SelectListItem>();
    
            }
            public List<Payroll> Payrolls { get; set; } = new List<Payroll>();
        }
    }
    

    </div>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 17, 2020 8:53 PM
  • User-474980206 posted

    in the post back model, there will be a property named "DropdownlistName" which will have a value of "0" or "1". select the downtown in the form, then submit, the action should see the value.

    if meant the show/hide to happen when the value was select, you write the code in javascript. you can do a form submit when the <select> changes:  

    @Html.DropDownList("DropdownlistName", Q2_YesNoList, new { onchange="this.form.submit()"})

    note: a better approach would be to do this all with javascript.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 17, 2020 8:53 PM

All replies

  • User475983607 posted

    AppDev01

    Is there a way to get the value of the dropdown so that I can activet the div to come into view and be visible once the user selects yes?

    There's no selected value. 

    Where does the selected value come from?  Does the user select an option or does the selected value come from a database table?  Can you explain how your design works?

    Anyway to get the selected value using your code...

    @{
        ViewBag.Title = "Index";
    }
    
    @{
        var Q1_YesNoList = new List<SelectListItem>();
        Q1_YesNoList.Add(new SelectListItem { Text = "Yes", Value = "1", Selected = true });
        Q1_YesNoList.Add(new SelectListItem { Text = "No", Value = "0" });
    }
    
    @{
        var Q2_YesNoList = new List<SelectListItem>();
        Q2_YesNoList.Add(new SelectListItem { Text = "Yes", Value = "1" });
        Q2_YesNoList.Add(new SelectListItem { Text = "No", Value = "0" });
    }
    
    <h2>Index</h2>
    
    @if (Q1_YesNoList.Where(m => m.Selected).FirstOrDefault().Value == "1")
    {
        <div id="Q2" style="display:uset">
    
            <h1>Question Two:</h1>
            <div>
                Some Text : @Html.DropDownList("DropdownlistName", Q2_YesNoList)
            </div>
    
        </div>
    }

    Wednesday, June 17, 2020 8:46 PM
  • User1120430333 posted
    <div class="form-group">
                    <div class="editor-field">
                        @Html.Label("Author:")
                        <select name="PayRoll.AuthorTypeId" asp-items="Model.PayRoll.AuthorTypes"></select>
                        <span class="alert-danger" asp-validation-for="PayRoll.AuthorTypeId"></span>
                    </div>
    using System.Collections.Generic;
    using System.ComponentModel.DataAnnotations;
    using Microsoft.AspNetCore.Mvc.Rendering;
    
    namespace WebRazor3.x.Models
    {
        public class PayRollVM
        {
            public class Payroll
            {
                public int PayRollId { get; set; }
                public int AuthorId { get; set; }
                public string AuthorFirstName { get; set; }
                public string AuthorLastName { get; set; }
    
                [Required(ErrorMessage = "Author is required")]
                public string AuthorTypeId { get; set; }
    
                [Required(ErrorMessage = "Salary is required")]
                public int? Salary { get; set; }
    
                public List<SelectListItem> AuthorTypes { get; set; } = new List<SelectListItem>();
    
            }
            public List<Payroll> Payrolls { get; set; } = new List<Payroll>();
        }
    }
    

    </div>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 17, 2020 8:53 PM
  • User-474980206 posted

    in the post back model, there will be a property named "DropdownlistName" which will have a value of "0" or "1". select the downtown in the form, then submit, the action should see the value.

    if meant the show/hide to happen when the value was select, you write the code in javascript. you can do a form submit when the <select> changes:  

    @Html.DropDownList("DropdownlistName", Q2_YesNoList, new { onchange="this.form.submit()"})

    note: a better approach would be to do this all with javascript.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 17, 2020 8:53 PM
  • User2130491911 posted

    Ahhh ok... I did not know you could do that. Many thanks!! 

    Wednesday, June 17, 2020 8:53 PM
  • User2130491911 posted

    Yes I found and example here using Java... In my pass application I have done it that way... but I was not sure if I could do it with out.

    https://www.tutorialrepublic.com/codelab.php?topic=faq&file=jquery-show-hide-div-using-select-box

    Thanks!

    Wednesday, June 17, 2020 8:56 PM