<html>
<head>
<script src="../../runtime/lib/aw.js"></script>
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet"></link>
</head>
<body>
<style>
/********************************************************************
Combo
********************************************************************/
#myCombo {width: 100px; height: 22px}
</style>
<p style="font:menu">
see page source
</p>
<script>
/********************************************************************
/////////////////////////////////////////////////////////////////////
Combo box object is not completed yet
/////////////////////////////////////////////////////////////////////
********************************************************************/
var obj = new AW.UI.Combo;
obj.setId("myCombo");
obj.setControlText("Some text");
obj.setControlImage("favorites");
obj.setItemText(["Home", "Favorites", "Font size", "Search"]);
obj.setItemImage(["home", "favorites", "fontsize", "search"]);
obj.setItemCount(4);
// ADDED THIS LINE TO PREVENT USER FROM TYPING IN THE TEXT AREA.
// THE DROPDOWN STILL WORKS AND THE USER CAN SELECT A VALUE
obj.getContent('box/text').setAttribute('readonly', true);
obj.onControlActivated = function(){ return true; }
// WHY THE onControlActivated IS NEEDED BEATS ME?
document.write(obj);
</script>
</body>
</html>
obj.getContent('box/text').setAttribute('readonly', true);
obj.onControlActivated = function(){ return true; }
obj.onControlClicked = function() {
this.showPopup();
}
<html>
<head>
<script src="../../runtime/lib/aw.js"></script>
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet"></link>
</head>
<body>
<style>
/********************************************************************
Combo
********************************************************************/
#myCombo {width: 200px; }
#myCombo-popup {width: 250px; height: 250px;}
#myCombo-popup .aw-mouseover-item {background: #fca}
</style>
<script>
var lastvalue="";
var dropdowntext = ["home", "favorites", "fontsize", "search"];
var obj = new AW.UI.Combo;
obj.setId("myCombo");
obj.setControlText("<< Select One >>");
obj.setControlImage("favorites");
obj.setItemText(dropdowntext);
obj.setItemImage(["home", "favorites", "fontsize", "search"]);
obj.setItemCount(4);
// COMPARE NEW TEXT WITH LAST KNOWN GOOD VALUE AND ARRAY OF
// VALID VALUES. IF NO MATCH IS FOUND THEN USER MUST BE
// TYPING SO WE DROP THE COMBO AND SET THE VALUE BACK TO
// THE LAST KNOWN GOOD VALUE
obj.onControlTextChanged = function(text){
if (text!=lastvalue) {
var foundit=false;
for (var x = 0; x <= dropdowntext.length-1; x++) {
if (dropdowntext[x]==text) { foundit=true; break; }
}
if (foundit==false) { obj.setControlText(lastvalue); this.showPopup(); }
};
lastvalue=obj.getControlText();
}
// GET THE INITIAL TEXT. NOTE, THIS MIGHT NOT BE A VALUE
// IN THE LIST INSTEAD IT MIGHT BE SOMETHING LIKE '<<Select>>
obj.onControlActivated = function(event){ lastvalue=obj.getControlText(); };
document.write(obj);
</script>
</body>
</html>
obj.setCellEditable(false,x) // x=column number
obj.getContent("box/text").setAttribute("readonly", true);
obj.onControlEditStarted = function(){
this.getContent("box/text").element().contentEditable = false;
}
var obj = new AW.UI.Combo;
obj.setControlText("combo");
obj.setItemText(function(i){return "item " + i});
obj.setItemCount(5);
// make input box readonly
obj.getContent("box/text").setAttribute("readonly", true);
// fix for 'contentEditable' attribute
obj.onControlEditStarted = function(){
this.getContent("box/text").element().contentEditable = false;
}
document.write(obj);
This topic is archived.