学步园

链接 Samples：

http://www.dhtmlx.com/docs/products/docsExplorer/samples.shtml

链接 Docs：http://docs.dhtmlx.com/doku.php

dhxCalendar：

//初始化
var myCalendar = new dhtmlXCalendarObject("calendar");

//初始化with icons
<div style="position:relative;height:280px;">
	<input type="text" id="calendar_input">
	<span><img id="calendar_icon" src="../common/calendar.gif" border="0"></span>
</div>
<script>
var myCalendar = new dhtmlXCalendarObject({
        input: "calendar_input",
        button: "calendar_icon"
});
</script>

//attach to form
{
	type: "calendar",
	dateFormat: "%Y-%m-%d %H:%i",
	value: "2011-06-13 11:35",
	name: "start_date",
	label: "Start Date",
	skin: "dhx_skyblue",
	readonly: true,
	enableTime: true,
	calendarPosition: "right"
}

//其他操作；
myCalendar.setSensitiveRange(dateFrom, dateTo);
myCalendar.clearSensitiveRange();  
myCalendar.hideTime();
myCalendar.show();
myCalendar.setDate("2011-07-12");
myCalendar.enableDays("month");
myCalendar.disableDays("month", d);
myCalendar.setHolidays("2011-06-23,2011-06-24,2011-06-25");
myCalendar.setWeekStartDay(7);//周起始天

dhxMessage：

//alert：only has one button
dhtmlx.alert({title:"注意",ok:"确定",text:"请输入时间"});
dhtmlx.alert("Test alert", function(result){...}); //type1:普通弹出框
dhtmlx.alert({title:"Custom title",ok:"Custom text",text:"Result: "+result,callback:function(){...});//type2:确定按钮框
dhtmlx.alert({type:"alert-warning",text:"Warning",callback:function(){...}});//type3:警告框
dhtmlx.alert({title:"Important!",type:"alert-error",text:"Error"});//type4:错误框

//confirm : has two button
dhtmlx.confirm("Test confirm", function(result){...});
dhtmlx.confirm({title:"Custom title",ok:"Yes", cancel:"No",text:"Result: "+result,callback:function(){...}});
dhtmlx.confirm({type:"confirm-warning",text:"Warning",callback:function(){...}});
dhtmlx.confirm({title:"Important!",type:"confirm-error",text:"Error"});

//message: appear from the browser, so funny
dhtmlx.message("You have pressed the button!");//消息提示框
dhtmlx.message({type:"error", text:"You have pressed the <br> CRITICAL button!" })//消息警告框

dhxEditor：

<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxeditor_dhx_skyblue.css">
<script src="../../codebase/dhtmlxcommon.js" type="text/javascript"></script>
<script src="../../codebase/dhtmlxeditor.js" type="text/javascript"></script>

dhtmlx.image_path = "../../codebase/imgs/";
var editor = new dhtmlXEditor("editorObj");//初始化editor

<script src="../../codebase/ext/dhtmlxeditor_ext.js"></script>//引入会自动关包含工具条
<script src="../../../dhtmlxToolbar/codebase/dhtmlxtoolbar.js"></script>

dhxLayout：

var dhxLayout = new dhtmlXLayoutObject("parentId", "4I");
//layout1 = new dhtmlXLayoutObject(dhxLayout.cells("b"), "2U");
//参数：1C	2E	2U	3E	3W	3J	3T	3L	3U	4H	4I	4T	4U	5H	5I	6I
dhxLayout.cells("a").setText("Main Page");
dhxLayout.cells("b").setText("Site Navigation");
dhxLayout.cells("c").setText("Support & Feedback");
dhxLayout.cells("d").setText("Comments");

//其他操作
dhxLayout.items[getInd()].hideHeader();//隐藏layout头
dhxLayout.items[getInd()].expand();//展开
dhxLayout.items[getInd()].collapse();//缩起
dhxLayout.items[getInd()].progressOn();//按下后的过渡效果
dhxLayout.items[getInd()].progressOff();
dhxLayout.cells("a").collapse();//缩起
dhxLayout.setCollapsedText("a", "Main Page");//缩起后的小标题
dhxLayout.cells("a").attachObject("objId");
dhxLayout.forEachItem(function(item) {
	item.setText(newNames ? names[j++] : item.getId());
});

//attach操作：
Attach dhtmlxMenu to Layout's Top
Attach dhtmlxToolbar to Layout's Top
Attach StatusBar to Layout's Bottom
Attach dhtmlxTree to Layout
Attach dhtmlxGrid to Layout
Attach dhtmlxTreeGrid to Layout
Attach dhtmlxTabbar to Layout
Attach dhtmlxAccordion to Layout
Attach dhtmlxEditor to Layout
Attach dhtmlxMenu to Layout
Attach dhtmlxToolbar to Layout
Attach StatusBar to Layout
Attach Maps to Layout

dhxPopup：

链接：http://www.dhtmlx.com/docs/products/dhtmlxPopup/samples/05_extra/01_complex_form.html

链接：http://www.dhtmlx.com/docs/products/dhtmlxPopup/samples/05_extra/02_grid_filtering.html

//attach_to_form
function attach_to_form(){
	myForm = new dhtmlXForm("myForm", [{
		type: "settings",
		position: "label-left",
		labelWidth: 120,
		inputWidth: 120
	}, {
		type: "input",
		name: "name",
		label: "Full Name / Nick",
		value: "Ogiwara Masaaki"
	}, {
		type: "password",
		name: "pwd",
		label: "Password",
		value: "12345"
	}, {
		type: "button",
		name: "proceed",
		value: "Proceed"
	}]);
	myForm.setSkin("dhx_skyblue");

	myPop = new dhtmlXPopup({form: myForm,id: ["name", "pwd"]});
	myPop.attachHTML("Please enter something<br>Second line<br>One more line here");

	myForm.attachEvent("onFocus", function(id, value) {
		if (typeof(value) != "undefined") id = [id, value];// for radiobutton        
		myPop.show(id);
	});
	myForm.attachEvent("onBlur", function(id, value) {
		myPop.hide();
	}); 
}

//attach to html
<input type="text" onclick="showPopup(this);" onblur="hidePopup();" value="click">
function showPopup(inp) {
    if (!myPop) {
        myPop = new dhtmlXPopup();
        myPop.attachHTML("You can enter some text into here");
    }
    if (myPop.isVisible()) {
        myPop.hide();
    } else {
        var x = getAbsoluteLeft(inp);
        var y = getAbsoluteTop(inp);
        var w = inp.offsetWidth;
        var h = inp.offsetHeight;
        myPop.show(x, y, w, h);
    }
} 
function hidePopup() {
    if (myPop)
        myPop.hide();
}

//attach操作；
Attach List
Attach Object
Attach HTML
Attach Form
Attach Calendar
Attach Grid
Attach Tree
Attach Layout
Attach Accordion
Attach Tabbar

dhxAjax：

dhtmlxAjax.get("php/process.php?" + encodeURI(document.getElementById('params').value), outputResponse);
dhtmlxAjax.post("php/process.php", encodeURI(document.getElementById('params').value), outputResponse);

&Others...