Hi Angrez,
Please find the source of web page developed using smartlcient,
Please let me know weather watir can be used for this.
Source.
<!--------------------------------------------------------------------
SmartClient SDK
Component Data Binding example
Copyright 2001-2007 Isomorphic Software, Inc. (www.isomorphic.com)
---------------------------------------------------------------------->
<HEAD><TITLE>
SmartClient SDK - Component Data Binding example
</TITLE></HEAD><SCRIPT>window.isomorphicDir='../../isomorphic/';</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Core.js?isc_version=5.6.js
></SCRIPT><SCRIPT>isc._lastModule='Core';</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Foundation.js?isc_version=
5.6.js></SCRIPT><SCRIPT>isc._lastModule='Foundation';</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Containers.js?isc_version=
5.6.js></SCRIPT><SCRIPT>isc._lastModule='Containers';</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Grids.js?isc_version=
5.6.js></SCRIPT><SCRIPT>isc._lastModule='Grids';</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Forms.js?isc_version=
5.6.js></SCRIPT><SCRIPT>isc._lastModule='Forms';</SCRIPT>
<SCRIPT
SRC=../../isomorphic/system/modules/ISC_DataBinding.js?isc_version=5.6.js
></SCRIPT><SCRIPT>isc._lastModule='DataBinding';</SCRIPT>
<SCRIPT SRC=../../isomorphic/skins/SmartClient/load_skin.js?isc_version=
5.6.js></SCRIPT>
<BODY BGCOLOR=#D3D3D3><SCRIPT>
// load datasources
isc.DataSource.create({
serverType:"sql",
fields:{
itemID:{primaryKey:true, hidden:true, type:"sequence",
name:"itemID"},
itemName:{
title:"Item",
required:true,
type:"text",
length:128,
name:"itemName"
},
SKU:{
title:"SKU",
required:true,
type:"text",
length:10,
name:"SKU"
},
description:{
title:"Description",
type:"text",
length:2000,
name:"description"
},
category:{
title:"Category",
required:true,
type:"text",
length:128,
foreignKey:"supplyCategory.itemName",
name:"category"
},
units:{
title:"Units",
valueMap:["Roll", "Ea", "Pkt", "Set", "Tube", "Pad", "Ream",
"Tin", "Bag", "Ctn", "Box"],
type:"enum",
length:5,
name:"units"
},
unitCost:{
title:"Unit Cost",
required:true,
type:"float",
validators:[
{
type:"floatRange",
min:0,
errorMessage:"Please enter a valid (positive) cost"
},
{
type:"floatPrecision",
errorMessage:"The maximum allowed precision is 2",
precision:2
}
],
name:"unitCost"
},
inStock:{title:"In Stock", type:"boolean", name:"inStock"},
nextShipment:{title:"Next Shipment", type:"date",
name:"nextShipment"}
},
tableName:"supplyItem",
testFileName:"supplyItem.data.xml",
ID:"supplyItem"
})
isc.DataSource.create({
serverType:"sql",
fields:{
Name:{
title:"Name",
type:"text",
length:128,
name:"Name"
},
EmployeeId:{title:"Employee ID", primaryKey:true, required:true,
type:"integer",
name:"EmployeeId"},
ReportsTo:{title:"Manager", required:true, type:"integer",
rootValue:"1",
foreignKey:"employees.EmployeeId",name:"ReportsTo"},
Job:{
title:"Title",
type:"text",
length:128,
name:"Job"
},
Email:{
title:"Email",
type:"text",
length:128,
name:"Email"
},
EmployeeType:{
title:"Employee Type",
type:"text",
length:40,
name:"EmployeeType"
},
EmployeeStatus:{
title:"Status",
type:"text",
length:40,
name:"EmployeeStatus"
},
Salary:{title:"Salary", type:"float", name:"Salary"},
OrgUnit:{
title:"Org Unit",
type:"text",
length:128,
name:"OrgUnit"
},
Gender:{
title:"Gender",
valueMap:["male", "female"],
type:"text",
length:7,
name:"Gender"
},
MaritalStatus:{
title:"Marital Status",
valueMap:["married", "single"],
type:"text",
length:10,
name:"MaritalStatus"
}
},
tableName:"employeeTable",
testFileName:"employees.data.xml",
ID:"employees"
})
isc.DataSource.create({
serverType:"sql",
fields:{
commonName:{title:"Animal", type:"text", name:"commonName"},
scientificName:{title:"Scientific Name", primaryKey:true,
required:true, type:"text",
name:"scientificName"},
lifeSpan:{title:"Life Span", type:"text", name:"lifeSpan"},
status:{title:"Endangered Status", type:"text", name:"status"},
diet:{title:"Diet", type:"text", name:"diet"},
information:{
title:"Interesting Facts",
type:"text",
length:1000,
name:"information"
}
},
tableName:"animals",
testFileName:"animals.data.xml",
ID:"animals"
})
// create clickable list of datasources
// This is a good example of a small, read-only list of data for which
// it is appropriate to set the listGrid.data property directly.
ListGrid.create({
ID:"dsList",
left:20, top:75, width:130,
leaveScrollbarGap:false,
showSortArrow:"none",
canSort:false,
fields:[
{title:"Select a DataSource", name:"dsTitle"}
],
data:[
{dsTitle:"Animals", dsName:"animals"},
{dsTitle:"Office Supplies", dsName:"supplyItem"},
{dsTitle:"Employees", dsName:"employees"}
],
selectionType:"single",
recordClick:"bindComponents(record.dsName)"
});
// bind components to the selected datasource, and execute
// a fetch operation with no criteria to populate the boundList
function bindComponents(ds) {
boundList.setDataSource(ds);
boundViewer.setDataSource(ds);
boundForm.setDataSource(ds);
boundList.fetchData();
newBtn.enable(); // can't create a new record until a datasource is
selected
saveBtn.disable(); // no record selected for editing, so disable save
button
}
// create ListGrid, DetailViewer, & DynamicForm components to bind to
datasources
// (nested inside a VStack to manage layout)
VStack.create({
left:170, top:75,
width:"70%",
membersMargin:20,
members:[
Label.create({
ID:"helpText",
contents:"<ul>" +
"<li>select a datasource from the list at left to bind to
these components</li>" +
"<li>click a record in the grid to view and edit that
record in the form</li>" +
"<li>click <b>New</b> to start editing a new record in the
form</li>" +
"<li>click <b>Save</b> to save changes to a new or edited
record in the form</li>" +
"<li>click <b>Clear</b> to clear all fields in the
form</li>" +
"<li>click <b>Filter</b> to filter (substring match) the
grid based on form values</li>" +
"<li>click <b>Fetch</b> to fetch records (exact match) for
the grid based on form values</li>" +
"<li>double-click a record in the grid to edit inline
(press Return, or arrow/tab to another record, to save)</li>" +
"</ul>"
}),
// databound ListGrid
// * click records to edit in boundForm and view in boundViewer
// * double-click record to edit inline (Return or arrow/tab off
current row to save)
ListGrid.create({
ID:"boundList",
height:200,
canEdit:true,
recordClick:"boundForm.editRecord(record); saveBtn.enable();
boundViewer.viewSelectedData(boundList)"
}),
// databound DynamicForm
// * click boundList records to edit
DynamicForm.create({
ID:"boundForm",
numCols:"6",
autoFocus:false
}),
// toolbar to perform various actions using the boundForm values
(see helpText above)
Toolbar.create({
autoDraw:false,
membersMargin:10,
buttonConstructor: "IButton",
height: 22,
buttons:[
// click can be defined as a function or a string of
script to execute.
{title:"Save", click: function () {
boundForm.saveData();
if (!boundForm.hasErrors()) {
boundForm.clearValues();
this.disable();
}
},
ID:"saveBtn", disabled:true},
{title:"New", click:"boundForm.editNewRecord();
saveBtn.enable()", ID:"newBtn", disabled:true},
{title:"Clear", click:"boundForm.clearValues();
saveBtn.disable()"},
{title:"Filter", click:"boundList.filterData(
boundForm.getValuesAsCriteria()); saveBtn.disable()"},
{title:"Fetch", click:"boundList.fetchData(
boundForm.getValuesAsCriteria()); saveBtn.disable()"}
]
}),
// databound DetailViewer
// * click boundList records to display
DetailViewer.create({
ID:"boundViewer"
})
]
});
</SCRIPT>
</BODY></HTML>
Thanks,
Sadeesh
_______________________________________________
Wtr-general mailing list
Wtr-general@rubyforge.org
http://rubyforge.org/mailman/listinfo/wtr-general
