MiniUi绑定mini-combobox下拉框
⼀：最先开始后台使⽤json字符串绑定combobox
[{"id":1,"value":"是","text":"是"},{"id":0,"value":"否","text":"否"}]
然后我忘记json字符串的格式了，id属性没有加"" ，combobox⼀直绑定不上数据，⽽且请注意text属性是combobox的显⽰值，value属性不是显⽰值⼆：combobox的前端界⾯是
<input id="InUse"class="mini-combobox" url="@Url.Action("GetInUse")" textfield="text"  shownullitem="true" allowinput="true" />
⽽action⾥返回JsonResult或者string格式都可以
public JsonResult GetInUse()
{
List<JsonData> list = new List<JsonData>();
list.Add(new JsonData() { id = 1, text = "是" });
list.Add(new JsonData() { id = 0, text = "否" });
return Json(list, JsonRequestBehavior.AllowGet);//这⾥使⽤的是get请求
}
public string GetInUse()
{
List<JsonData> list = new List<JsonData>();
list.Add(new JsonData() { id = 1, text = "是" });
list.Add(new JsonData() { id = 0, text = "否" });
JavaScriptSerializer jsonSerializer = new JavaScriptSerializer();
return  jsonSerializer.Serialize(list);
}
三：除了使⽤MVC提供的 url="@Url.Action("GetInUse")" 的⽅式，还可以在页⾯加载的时候使⽤JavaScript为下拉框赋值
<script type="text/javascript">
//⽅法⼀
var InUse = ("InUse");
$.ajax({
url: '@Url.Action("GetInUse")',
type: 'get',
contentType: "application/json",
success: function (jsonData) {
if (jsonData) {
InUse.load(jsonData);
}
}
});
//⽅法⼆
$(document).ready(function () {
var jsonData = [{ 'id': '1', 'text': '是' }, { 'id': '0', 'text': '否' }];
<("InUse").load(jsonData);
})
</script>
四：使⽤miniui直接在input标签的date属性⾥设置json数据（过了很多天后补的⼀种⽅法，未测试，如果json格式不对，尝试给id,text属性加单引号）<input id="InUse" name="InUse"class="mini-combobox" textfield="text"
valuefield="id" emptytext="请选择..."
allowinput="false" shownullitem="true" nullitemtext="请选择..."
data="[{id:'1',text:'是'},{id:'0',text:'否'}]" />
五：action⾥读取枚举数据
public JsonResult GetStatusEnum(bool isAll)
{
try
{
var list = CommonUtil.GetEnumList<PlanTypeEnum>();
var returnList = list.Select(item => new DictionaryEntity
{
Key = item.Key,
Value = item.Value
}).ToList();
if (isAll)
{
returnList.Insert(0, new DictionaryEntity { Key = -1, Value = "" });
}
return Json(returnList, JsonRequestBehavior.AllowGet);
}
catch (Exception ex)
{
throw;
}
}
///<summary>
///把枚举描述和值规则拼接字符串
///</summary>
///<typeparam name="T">枚举</typeparam>
///<returns>枚举值，枚举描述；枚举值，枚举描述；枚举值，枚举描述</returns>
public static IList<DictionaryEntry> GetEnumList<T>()
{
List<DictionaryEntry> list = new List<DictionaryEntry>();
Dictionary<int, string> dic = GetDictionary(typeof(T));
DictionaryEntry entity;
foreach (var key in dic.Keys)
{
entity = new DictionaryEntry();
entity.Key = key;
entity.Value = dic[key];
list.Add(entity);
}
return list;
}
/
//<summary>
///获取枚举值、描述列表
///</summary>
///<param name="enumType">枚举类型</param>
///<returns>
///返回枚举值、描述列表
///</returns>
private static Dictionary<int, string> GetDictionary(Type enumType)
{
Dictionary<int, string> dic = new Dictionary<int, string>();
foreach (int enumValue in Enum.GetValues(enumType))
{
dic.Add(enumValue, string.Empty);
FieldInfo fieldinfo = enumType.GetField(Enum.GetName(enumType, enumValue));
if (fieldinfo == null)
{
return null;
}
Object[] objs = fieldinfo.GetCustomAttributes(typeof(DescriptionAttribute), false);
if (objs.Length != 0)
{
DescriptionAttribute da = (DescriptionAttribute)objs[0];
dic[enumValue] = da.Description;
}
}
return dic;
}
前台界⾯
//获取Combobox控件值，统⼀调⽤
function GetCombobox(ctrlId, url, isAll, isAsync, isSelect, callback) {
///<signature>
///<summary>加载下拉框控件</summary>
///<param name="ctrlId" type="String">要绑定数据的控件ID</param>
/
//<param name="url" type="String">数据请求地址ID</param>
///<param name="isAll" type="String">是否包含全部标识</param>
///<param name="isAsync" type="String">是否异步</param>
///<param name="isSelect" type="String">是否选中</param>
///<param name="callback" type="function">回调函数</param>
///</signature>
if (isAsync == undefined)
isAsync = false;
if (isAll == undefined)
isAll = false;
var cbox = (ctrlId);input绑定onblur事件
$.ajax({
url: url,
type: "post",
async: isAsync,
data: { isAll: isAll },
success: function (text) {
if (cbox != undefined) {
cbox.setData(text);
if (isSelect === undefined || isSelect === true) {
cbox.select(0);
}
/
/cbox.doValueChanged();
} else {
alert('获取下拉框对象为空');
}
if (callback) callback();
},
error: function (text) {
var jsontext = mini.sponseText);
alert(jsontext.Message);
return;
}
});
}
$(function () {
//计划类型
GetCombobox('PlanTypeId', '@Url.Action("GetPlanTypeEnum")', false);
})
计划类型：
<input id="PlanTypeId" name="PlanTypeId"class="mini-combobox comboboxWidth" valuefield="Key" textfield="Value" onblur="checkComboboxblur('PlanTypeId')" allowinput="true" valuefromselect="true" required=

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。