dropdownlist of mvc3 operators

Question

dropdownlist of mvc3 operators

Is there a better way to implement a dropdown list in MVC3 that looks like the one in this HTML/JS example?

I attempted to achieve this using the following code:

Model:

public enum Operator
{
    GreaterThan = '>',
    LessThan = '<',
    Equal = '='
}

public Operator SelectedOperator { get; set; }

View Model:

@Html.DropDownListFor(model => model.SelectedOperator, new SelectList(Enum.GetValues(typeof(YourNamespace.Models.Operator))))

View:

@Html.EditorFor(x => x.AdvanceSearchModel)

While this gave me a basic dropdown list with "Greater Than," "Less Than," and "Equal," I am unsure how to display "<," ">,=" in the dropdown list. Any suggestions?

javascript .net asp.net-mvc-3

Answer 1

Answer №1

@Html.DropDownListFor(
    model => model.getOp,
    ((Fnx.Esb.ServiceMonitor.ViewModel.AdvanceSearchModel.oporetor[])Enum.GetValues(
        typeof(Fnx.Esb.ServiceMonitor.ViewModel.AdvanceSearchModel.oporetor)
    )).Select(x => new SelectListItem
    {
        Value = x.ToString(),
        Text = ((char)x).ToString()
    })
)

You could also optimize the code by directly preparing the data in your view model:

public enum Operator
{
    greater_then = '>',
    less_than = '<',
    equal = '='
}

public class AdvanceSearchModel
{
    public IEnumerable<SelectListItem> Operators 
    {
        get
        {
            return ((Operator[])Enum.GetValues(typeof(Operator)))
                .Select(x => new SelectListItem
                {
                    Value = x.ToString(),
                    Text = ((char)x).ToString()
                });
        }
    }

    public Operator GetOp { get; set; }
}

Then, in your view, you can simply use:

@Html.DropDownListFor(model => model.GetOp, Model.Operators)

Answer 2

@Html.DropDownListFor(
    model => model.getOp,
    ((Fnx.Esb.ServiceMonitor.ViewModel.AdvanceSearchModel.oporetor[])Enum.GetValues(
        typeof(Fnx.Esb.ServiceMonitor.ViewModel.AdvanceSearchModel.oporetor)
    )).Select(x => new SelectListItem
    {
        Value = x.ToString(),
        Text = ((char)x).ToString()
    })
)

You could also optimize the code by directly preparing the data in your view model:

public enum Operator
{
    greater_then = '>',
    less_than = '<',
    equal = '='
}

public class AdvanceSearchModel
{
    public IEnumerable<SelectListItem> Operators 
    {
        get
        {
            return ((Operator[])Enum.GetValues(typeof(Operator)))
                .Select(x => new SelectListItem
                {
                    Value = x.ToString(),
                    Text = ((char)x).ToString()
                });
        }
    }

    public Operator GetOp { get; set; }
}

Then, in your view, you can simply use:

@Html.DropDownListFor(model => model.GetOp, Model.Operators)

dropdownlist of mvc3 operators

Answer №1

Similar questions

Having trouble with Angular JS's ngRoute feature not functioning properly

Using Polymer and D3: A guide to transferring JSON data from element attributes to templates

How can I simultaneously add two elements to a single node or to a node that does not exist in the JSON file?

CAUTION: Attempted to load angular multiple times while loading the page

Steps to update XmlHttpRequest URL during image upload

How can elements with class prefix names be retrieved in IE Browser Helper Object using c#?

I'm curious as to why window.opener is null in a popup when utilizing Google OAuth, and what is the most effective way to transfer the access token to the parent window

Leverage all the documents obtained from a collection to reference in a Vue component

Passing the app variable from Express.js to routes

Tips for toggling a menu by clicking a link

Creating Virtual Nodes from a string with HTML tags in Vue 2.5: A Step-by-Step Guide

The data-tooltip feature displays information as [Object object]

The absence of a flickering flame is noticeable in the THREE.js environment

a versatile tool or JavaScript module for dissecting different HTML documents

Is it possible to convert an array into an object?

How can I position text below a ticked checkbox?

Steps for embedding a custom function in a switch statement

Does this Spread Operator Usage Check Out?

Tips for concealing the "maxlength" attribute in HTML

Manipulating the length of an array based on a specified range using Vue.js