jquery easyui无法绑定下拉框内容

最近在研究jquery easyui的DataGrid，发现DataGrid中的下拉框无法绑定值，找了很久也没发现是具体问题所在，最后还是同事帮忙搞定的。具体问题竟然是jquery easyui提供的demo中的jquery版本有问题，还有就是绑定的json数据源要添加Method: "get"属性，要不然在C#中会有问题。

具体代码如下：

<body>

<h2>

Haven't finished tasks</h2>

<div class="demo-info">

<div class="demo-tip icon-tip">

</div>

<div>

Click a cell to start
editing.</div>

</div>

<div style="margin: 10px 0;">

</div>

<table id="dg" class="easyui-datagrid"
title="Haven't finished tasks" style="width: 1000px;

height: auto" data-options="



    iconCls:
'icon-edit',




singleSelect: true,



    url:
'datagrid_data1.json',



    method:'get',



    toolbar:
'#tb',



    onClickRow:
onClickRow



">

<thead>

<tr>

<th
data-options="field:'taskid',width:60">

Task ID

</th>

<th
data-options="field:'taskcontent',width:500,editor:'text'">

Task Content

</th>

<th data-options="field:'projectid',width:150,

formatter:function(value,row){

return row.projectname;

},

editor:{

type:'combobox',

options:{

valueField:'projectid',

textField:'projectname',

url:'projects.json',





method:'get',

required:true

}

}">

Task Project

</th>

<th
data-options="field:'starttime',width:120,align:'center'">

Start Time

</th>

<th
data-options="field:'status',width:80,align:'center',editor:{type:'checkbox',options:{on:'',off:'P'}}">

Start Task

</th>

<th
data-options="field:'status',width:80,align:'center',editor:{type:'checkbox',options:{on:'',off:'P'}}">

Submit Task

</th>

</tr>

</thead>

</table>

<div id="tb" style="height:
auto">

<a href="javascript:void(0)"
class="easyui-linkbutton"
data-options="iconCls:'icon-add',plain:true"

onclick="append()">Append</a>
<a href="javascript:void(0)"
class="easyui-linkbutton"

data-options="iconCls:'icon-remove',plain:true"
onclick="removeit()">Remove</a>

</div>

<script
type="text/javascript">
var editIndex = undefined;

function endEditing() {

if (editIndex == undefined) { return true }

if ($('#dg').datagrid('validateRow', editIndex)) {

var ed = $('#dg').datagrid('getEditor', { index: editIndex, field:
'projectid' });

var productname = $(ed.target).combobox('getText');

$('#dg').datagrid('getRows')[editIndex]['projectname'] =
productname;

$('#dg').datagrid('endEdit', editIndex);

editIndex = undefined;

return true;

} else {

return false;

}

}

function onClickRow(index) {

if (editIndex != index) {

if (endEditing()) {

$('#dg').datagrid('selectRow', index)







.datagrid('beginEdit', index);

editIndex = index;

} else {

$('#dg').datagrid('selectRow', editIndex);

}

}

}

function append() {

if (endEditing()) {

$('#dg').datagrid('appendRow', { status: 'P' });

editIndex = $('#dg').datagrid('getRows').length - 1;

$('#dg').datagrid('selectRow', editIndex)






.datagrid('beginEdit', editIndex);

}

}

function removeit() {

if (editIndex == undefined) { return }

$('#dg').datagrid('cancelEdit', editIndex)





.datagrid('deleteRow', editIndex);

editIndex = undefined;

}

</script>
</body>

秒客网

jquery easyui无法绑定下拉框内容

相关文章