easyui中datagrid列表里面带有textbox和combobox的示例

datagrid在默认情况下，我们只是用来展示数据，大多数情况下是和分页结合使用，但是偶尔的一些特殊需求，他要展示一个form表单的一些列表项，而且还可以在列表中进行修改，最终提交表单的时候，我们在列表里面的文本框或者下拉框中做的修改，能够体现在form表单中，我们知道，datagrid的columns属性，提供了如{field:"action",formatter:actions}的形式，可以直接对列表某一列做一个改变的格式化方法，我们可以给列表增加操作列，对列表数据中的日期做格式化，布尔类型的状态做文字“是|否”映射，等等，但是，如果需要对一个值做下拉框的映射，formatter就不好使了，这个时候，我们需要使用上editor这个属性，editor属性，同样也可以让列格式化，而且是格式化为一个组件textbox,combobox等等。

editor使用的格式如下：

editor:{

     type:"combobox",

     options:{textField:"text",valueField:"value",data:json,panelHeight:'auto'}

}

从直观上看，和直接在页面上写上<input type="text" class="easyui-combobox" data-options="textField:'text',valueField:'value',

panelHeight:'auto'"/>类似。

这种对field做映射的方法，当我们初始化datagrid之后，而且加载了数据，效果和没有做格式化差不多，这里要让，格式化生效，还需要注意一个步骤，那就是调用datagrid("beginEdit",index)这个方法，让页面重新渲染成我们预期的结果。下拉框的展示下拉框，文本框的展示文本框。

直接上代码&#x