inputEx - DSSelectField Usage

Using a DataSource

How to populate the selectField using a YUI datasource (from local data, XHR, JSONP, function, ...):


1	var myDataSource = new YAHOO.util.XHRDataSource("books.json");
2	myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
3	myDataSource.responseSchema = { fields: ["id","quantity","amount","title", "category"], resultsList: "Results" };
4
5	new inputEx.DSSelectField({name: 'country', datasource: myDataSource, valueKey: "id", labelKey: "title", parentEl: 'container1'});
	view plain \| print \| ?

Updated event

How to listen to the updated event :

Log :


1	var myDataSource = new YAHOO.util.XHRDataSource("books.json");
2	myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
3	myDataSource.responseSchema = { fields: ["id","quantity","amount","title", "category"], resultsList: "Results" };
4
5	var el = YAHOO.util.Dom.get('container2');
6	var field2 = new inputEx.DSSelectField({name: 'country', datasource: myDataSource, valueKey: "id", labelKey: "title", parentEl: el});
7
8	var logDiv = inputEx.cn('div', null, null, "Log :");
9	el.appendChild(logDiv);
10	field2.updatedEvt.subscribe(function(e,params) {
11	var value = params[0];
12	logDiv.innerHTML += "Updated at "+(new Date())+" with value "+value;
13	logDiv.appendChild(inputEx.cn('br'));
14	});
	view plain \| print \| ?

Set Value

How to set the value :


1	var myDataSource = new YAHOO.util.XHRDataSource("books.json");
2	myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
3	myDataSource.responseSchema = { fields: ["id","quantity","amount","title", "category"], resultsList: "Results" };
4
5	var el = YAHOO.util.Dom.get('container3');
6	var field3 = new inputEx.DSSelectField({name: 'country', datasource: myDataSource, valueKey: "id", labelKey: "title", parentEl: el});
7
8	var setValueButton = inputEx.cn('button', null, null, "setValue to po-1482");
9	el.appendChild(setValueButton);
10	YAHOO.util.Event.addListener(setValueButton, 'click', function(e,params) {
11	field3.setValue("po-1482");
12	});
	view plain \| print \| ?