前言
最近猛然惊觉（说是猛然，是因为自己工作那么多年，居然不自知、不反省），在开发中，自己碰到一些常用的功能代码块，还是习惯性的baidu，然后copy....这样的操作，不知自己重复了多少遍。现在回想起来，其实每一次在网上搜索查找代码块，都耗费了自己一定的时间、精力。
既然如此，自己为什么不总结、汇总这些常用的轮子呢，又，为什么要一遍一遍的消耗时光？
一个字，懒！
懒的动手，怕麻烦。
出来混，总是要混的。
现在到自己还的时候了。
第一个款轮子——select 或者叫 Html.DropDownList
直接上代码：
@{
Layout = null;
}
@using PartyInvites.Models
@model School
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<script src="~/Content/js/jquery-3.2.1.min.js"></script>
<title>select 轮子的使用</title>
</head>
<body>
<div>
<h1>
第一种绑定Html.DropDownList
</h1>
@{
var schoolList = (List<School>)ViewData["SchoolList"];
var list = new SelectList(schoolList.AsEnumerable(), "Id", "Name");
@Html.DropDownList("SchoolList", list,"请选择");
}
</div>
<div>
<h2>
第二种绑定Html.DropDownList<span style="color:red">给定默认值</span>
</h2>
@{
var secondeList = new SelectList(schoolList.AsEnumerable(), "Id", "Name", Model.Id);
/*
注意 当使用Model.Id 绑定默认值，Html.DropDownList 方法中的第一个参数名 不能与
* ViewData["名字"] 一样，否则无法显示默认值。不懂什么原因
*/
@Html.DropDownList("SecondList", secondeList, "请选择默认值");
}
</div>
<div>
<h3>
第三种绑定html select控件
</h3>
@*
这里使用到jquery库
*@
<select id="selSchool">
</select>
</div>
</body>
</html>
<script type="text/javascript">
$(function () {
//页面加载完成执行
bindSchooList();
});
function bindSchooList() {
$.ajax({
url: 'Home/BindSchool',
type:"POST",
success: function (data) {
$("#selSchool").empty();//清空绑定的列表
$("#selSchool").append("<option value='0'>请选择</option>");//设置首项
//遍历json数据源
var options = "";
$.each(data.SchoolList, function (indx, item) {
options += "<option value='" + item.Id + "'>" + item.Name + "</option>";
});
//追加html options 到select
$("#selSchool").append(options);
//设置默认值
$("#selSchool").val(data.DefaultValue);
},
error: function (data) {
}
});
}
</script>界面代码
using PartyInvites.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc; namespace PartyInvites.Controllers
{
public class HomeController : Controller
{
//声明数据源
//实际可从数据库查询返回
public List<School> schoolList = new List<School>() {
new School{Id=,Name="山东大学"},
new School{Id=,Name="济南大学"}
}; public ViewResult Index()
{
//传数据源到view
ViewData["SchoolList"] = schoolList; School shool = new School();
//页面根据这个id 显示下拉选中的值
//可按实际给定
shool.Id = ; //页面绑定强类型
return View(shool);
}
/// <summary>
/// 第三种方法
/// 绑定到html select 控件
/// </summary>
/// <returns></returns>
public ActionResult BindSchool()
{
var obj = new
{
SchoolList = schoolList,//数据源
DefaultValue = //默认值
};
return Json(obj);
}
}
}
后台代码
项目是用vs2013,新建mvc empty模版项目的。