Styling favorites list items in mvc3

Question

I'm in the process of modifying code that I didn't write, and I'm pretty new to Razor

This is the selected list of vehicles and the code is as follows:

<select name="selectVehicle" class="cls_vehicles" data-bind="options: $root.vehicles,optionsCaption:$root.noVehicleText, optionsText: 'VehicleNumber',optionsValue: 'VehicleID',value: VehicleID"><option value=""/></select> 

In addition to Vehicleid and vehiclelenumber, my data source also contains Vehicletype, and now I want to allocate vehicles according to type, so gasoline vehicles are blue and diesel vehicles are green.

But I have no idea how to do this, any help is greatly appreciated.

Answer 1

So, your question code has a data binding for the knockout for the parameters in it, so I'm going to assume that you are using Knockout as the data source. To do this, you will need to slightly expand the binding so that you can place the CSS class for each parameter separately.

 <select data-bind="value: selectedCar, foreach: cars"> <option data-bind="css: { carDiesel: isDiesel, carGas: isGas }, text: name"></option> </select>​ 

Now it depends on the structure of your knockout representation model, but here is the fiddle I made using this method. You should be able to tailor it to suit your needs. If you want to use only the Razor solution, let me know.