Aceadmin in MVC controls

Source: Internet
Author: User

Aceadmin has a lot of HTML control, and after downloading it all mixed together, want to use a control sometimes adjust half a day, simply sort out a version, and combine the encapsulation of MVC. In the future, you don't need a JS css tune.

1. Drop-down box

  View:

@{Layout = null;}<!DOCTYPE HTML><HTMLLang= "en"><Head>    <title>Drop-down box-Ace Admin</title>@* This control width (just control div) *@<Linkrel= "stylesheet"href= "/assets/css/bootstrap.min.css" />@* The following two affects the style of the drop-down box *@<Linkrel= "stylesheet"href= "/assets/css/chosen.css" />    <Linkrel= "stylesheet"href= "/assets/css/ace.min.css" />    <Linkrel= "stylesheet"href= "/assets/css/font-awesome.min.css" />    <Scriptsrc= "/scripts/jquery_2_1_0_min.js"></Script>    <!--[If ie]> <script src= "/scripts/jquery_1_11_0_min.js" ></script> <! [EndIf] -    <Scriptsrc= "/assets/js/chosen.jquery.min.js"></Script>    <Scripttype= "Text/javascript">        $(function ($) {            $('. Chosen-select'). Chosen ({allow_single_deselect:true }); //when the window size changes, the drop-down box follows the zoom$ (window). On ('Resize.chosen', function () {                varW= $('. Chosen-select'). Parent (). width (); $('. Chosen-select'). Next (). css ({'width': w}); }). Trigger ('Resize.chosen');    }); </Script></Head><Body>    <Divclass= "Modal-body">        <Divclass= "Row">            <Divclass= "Col-xs-12 col-sm-4">                <!--HTML Example -                <Selectclass= "Chosen-select"name= "Hero"Data-placeholder= "Please select Heroes ...">                    <optionvalue=""></option>    <!--do not put anything in the default text, otherwise it will not be selected (Please select) -                    <optionvalue= "1">Liu bei</option>                    <optionvalue= "2">Guan yu</option>                    <optionvalue= "3">Zhang Fei</option>                </Select>                <Divclass= "Space-4"></Div>                <!--MVC version Example -@* for Aceadmin a lot--in MVC instead of *@@html.dropdownlist ("SelectListItem", NULL, NULL , new {@class = "Chosen-select", data_placeholder= "Please select Hero ...", name = "Hero"})     </Div>        </Div>    </Div></Body></HTML>

Background:

     Public actionresult HTMLControl () { List <SelectListItem> SelectListItem =New List<SelectListItem>(); Selectlistitem.add (New SelectListItem{Text =" ", Value ="" }); Selectlistitem.add (New SelectListItem{Text ="Liu Bei", Value ="1" }); Selectlistitem.add (New SelectListItem{Text ="Guan Yu", Value ="2" }); Selectlistitem.add (New SelectListItem{Text ="Zhang Fei", Value ="3" }); Viewbag.selectlistitem=SelectListItem; returnView (); }

There are also 1 ways to create selectlist that can be better combined with ORM tools.

    //data from the simulation database    List< Person> Listperson =New List< Person>()    {        New  Person() {Id =0, name=" " },        New  Person() {Id =1, name="Liu Bei" },        New  Person() {Id =2, name="Guan Yu" },        New  Person() {Id =3, name="Zhang Fei" }    }; SelectList ListItem=New SelectList(Listperson,"Id","Name");    ///There is a fourth parameter that is the default selected value Viewbag.selectlistitem= ListItem;

If you are using SelectListItem, then use LINQ's Select () method to isolate text and value

  IEnumerable<selectlistitemnewselectlistitem {Value = Item. Id.tostring (), Text = Item. Name});

Multiple selection, if it is multi-select, only need to add a property is OK, the other exactly:multiple= "multiple"

Aceadmin in MVC controls

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.