esay-ui学习笔记(一)

最新推荐文章于 2025-09-12 16:56:45 发布

weixin_30284355

最新推荐文章于 2025-09-12 16:56:45 发布

阅读量96

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ui ViewUI

原文链接：http://www.cnblogs.com/goujh/p/8656641.html

本文介绍了如何使用JavaScript的prototype属性为对象添加属性和方法，并通过示例进行了演示。此外，还详细讲解了EasyUI框架中Combobox组件和Datagrid组件的创建与使用方法。

JavaScript prototype用法

prototype 属性使您有能力向对象添加属性和方法。

object.prototype.name=value

<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

employee.prototype.salary=null;
bill.salary=20000;

document.write(bill.salary);

</script>

EasyUI Combobox 组合框

用法及定义:

1.从带有预定义结构的 <select> 元素创建组合框（combobox）。　　

<select id="cc" class="easyui-combobox" name="dept" style="width:200px;">
    <option value="aa">aitem1</option>
    <option>bitem2</option>
    <option>bitem3</option>
    <option>ditem4</option>
    <option>eitem5</option>
</select>

2.从 <input> 标记创建组合框（combobox）。

<input id="cc" class="easyui-combobox" name="dept" data-options="valueField:'id',textField:'text',url:'get_data.php'">

3.使用 javascript 创建组合框（combobox）。

<input id="cc" name="dept" value="aa">

$('#cc').combobox({
    url:'combobox_data.json',
    valueField:'id',
    textField:'text'
});

combobox事件

reload    url    请求远程的列表数据。传 'url' 参数来重写原始的 URL 值。
代码实例：
$('#cc').combobox('reload');  // reload list data using old URL
$('#cc').combobox('reload','get_data.php');  // reload list data using new URL

easyui datagrid属性和方法

使用JavaScript创建数据表格。

<table id="dg"></table>  
 

$('#dg').datagrid({   
    url:'datagrid_data.json',   
    columns:[[   
        {field:'code',title:'Code',width:100},   
        {field:'name',title:'Name',width:100},   
        {field:'price',title:'Price',width:100,align:'right'}   
    ]]   
});

查询数据填充数据表格。

$('#dg').datagrid('load', {   
    name: 'easyui',   
    address: 'ho'  
});

数据更改与服务器交互，刷新当前数据。

$('#dg').datagrid('reload');    // reload the current page data

转载于:https://www.cnblogs.com/goujh/p/8656641.html