How show List of string in the ListBox in MVC view

Question

I am have a table similar to grid that shows all the fields from table. This is my controller:

    public ActionResult Index()
    {
        DAL.DataManager dal = new DAL.DataManager();
        List<LALegalLicensedata> data = new List<LALegalLicensedata>();
        data = dal.get_LA_Get_AllDate();

       return View(data);

    }

and this is my view:

    @model IEnumerable<CSAProject.Models.LALegalLicensedata>


   <table width="100%" class="display" id="example" cellspacing="0">
    <thead>
        <tr>
            <th>Entity</th>
            <th>License Type</th>
            <th>State</th>
            <th>Location</th>
            <th>Data User</th>

        </tr>
    </thead>
    <tbody>
@foreach(var item in Model)
{
<tr>
    <td>@item.Entity</td>
    <td>@item.License_Type</td>
    <td>@item.State</td>
    <td>@item.Location</td>
    <td>@item.dataUser</td>

</tr>

}
    </tbody>

</table>

also in this page I need to show a optionList with checkbox that contains name of the properties from Model, this is my model:

public class LALegalLicensedata
    {

          public int dataID { get; set; }      
          public string dataUser { get; set; }
          public DateTime Create_Date { get; set; }
          public DateTime Modified_Date { get; set; }
          public string Modified_By { get; set; }
          public string Status { get; set; }
}

and this is how I get the properties name from Model:

        LALegalLicensedata model = new LALegalLicensedata();
        List<string> PropertyList =   GetPropertiesNameOfClass(model);


 public List<string> GetPropertiesNameOfClass(object pObject)
    {
        List<string> propertyList = new List<string>();
        if (pObject != null)
        {
            foreach (var prop in pObject.GetType().GetProperties())
            {
                propertyList.Add(prop.Name);
            }
        }
        return propertyList;
    }

I need to show a PropertyList in the option list how I can do that?

This is the javascript and text to show and hide the column. Instead of static text I like to have names from properties and have them in the option list with checkbox.

    $(document).ready(function () {
        var table = $('#example').DataTable({

            "paging": true
        });
        $('a.toggle-vis').on('click', function (e) {
            //e.preventdefault();
            event.preventDefault ? event.preventDefault() : event.returnValue = false;

            //Get the column API object
            var column = table.column($(this).attr('data-column'));



            // Toggle the visibility

            column.visible(!column.visible());

        });

    });

</script>
<div>
    Toggle column: <a class="toggle-vis" data-column="0">Entity</a> - 
    <a class="toggle-vis" data-column="1">License Type</a> - 
    <a class="toggle-vis" data-column="2">State</a> - 
    <a class="toggle-vis" data-column="3">Location</a> - 
    <a class="toggle-vis" data-column="4">Data User</a> - 
    <a class="toggle-vis" data-column="5">Create Date</a> 

</div>

Show your model. Does it have a SelectList or List<string> property? And what property in your model do you want to bind the selected values to? — user3559349
– user3559349, Commented Nov 20, 2015 at 0:32
@StephenMuecke I have added the Model to the question, no I don't have List<string> property in my model. — Alma
– Alma, Commented Nov 20, 2015 at 0:55
You can always assign PropertyList to a ViewBag property but you still need a property in your model to assign the selected value to. If its a ListBox (i.e. you want to select multiple values>, your need a property IEnumerable<string> SelectedProperties. but from your previous question it appears your model in the view is IEnumerable<LALegalLicensedata> so this does not make sense. You need to explain a bit more about what your trying to do. — user3559349
– user3559349, Commented Nov 20, 2015 at 1:00
@StephenMuecke at the top of my model I have IEnumerable<CSAProject.Models.LALegalLicensedata> as I am showing table with all the value(Get All fields) something similar to grid. and also I need to have a optionlist with list of all the properties that are the name of column, user should be able to choose couple of them together to show or hide them in the grid. — Alma
– Alma, Commented Nov 20, 2015 at 18:07

score 1 · Accepted Answer · 2015-11-21 02:06:17Z

1

The model you have shown does not match the view you have shown, so assuming your model is in fact (to match the view you have shown)

public class LALegalLicensedata
{
    public string Entity { get; set; }      
    public string License_Type { get; set; }
    public string State { get; set; }
    public string Location { get; set; }
    public string dataUser { get; set; }
}

Then, in the Index() method, add the property names to a ViewBag property

....
ViewBag.PropertyNames = GetPropertiesNameOfClass(new LALegalLicensedata());
return View(data);

I would however recommend that you use a view model with properties List<LALegalLicensedata> Data and List<string> PropertyNames

Then in the view your can loop through the collection to generate you checkboxes

<div>
  @foreach(var name in ViewBag.PropertyNames)
  {
    <label>
      <input type="checkbox" class="toggle-column" checked />
      <span>@name</span>
    </label>
  }
</div>

Then modify your script to handle the click() event of each checkbox

var checkBoxes = $('.toggle-column');
$('.toggle-column').click(function() {
  var index = checkBoxes.index($(this));
  $('tr th').eq(index).toggle();
  $('tr td').eq(index).toggle();
});

Refer this fiddle for how the script works.

Edit

Your current GetPropertiesNameOfClass() method will return the property names which in your case will display "License_Type" for the 2nd property, when I suspect you probably want it to be "License Type" (space instead of underscore). To solve this, add a [Display(Name = "License Type")] to the property, and then you can use the following method

private List<string> GetDisplayNames(object model)
{
  Type type = typeof(model);
  List<string> displayNames = new List<string>();
  foreach (var property in type.GetProperties())
  {
    var attributes = property.GetCustomAttributes(typeof(DisplayAttribute), true);
    if (attributes.Length == 0)
    {
      displayNames.Add(property.Name);
    }
    else
    {
      displayNames.Add((attributes[0] as DisplayAttribute).Name);
    }
  }
  return displayNames;
}

This also means you can use <th>@Html.DisplayNameFor(m => m.License_Type)</th> to generate you table headings rather than hard coding.

edited Nov 21, 2015 at 2:06

answered Nov 21, 2015 at 1:39

user3559349

Sign up to request clarification or add additional context in comments.

2 Comments

Alma Over a year ago

Thank you so much. it works great. Just one question, I need to have a option list (drop down list with check box) similar to this link: gcooler.com/uploadfile/favorites/demo/dropdown-check-list.0.9/…, how I can replace check boxes with option list checkbox.

user3559349 Over a year ago

That a jquery plugin. You will need to download it and include it in your project

Collectives™ on Stack Overflow

How show List of string in the ListBox in MVC view

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related