galdaka
29 Aug 2007, 12:35 PM
I want to share this widget, is a union of historycombobox.js and clearablecombobox.js in a ux format.
example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>HistoryClearableCombobox</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script> <!-- ENDLIBS -->
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../../ux/form/HistoryClearableComboBox.js"></script>
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../examples.css" />
<style type="text/css">
p { width:650px; }
</style>
<script>
Ext.onReady(function(){
var combo = new Ext.ux.form.HistoryClearableComboBox({
emptyText:'Type your search...',
selectOnFocus:true,
resizable:true
});
combo.applyTo('historyCombo');
});
</script>
</head>
<body>
<p>Remember on enter</p>
<div>
<input type="text" id="historyCombo" size="20"/>
</div>
</body>
</html>
example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>HistoryClearableCombobox</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script> <!-- ENDLIBS -->
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../../ux/form/HistoryClearableComboBox.js"></script>
<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../examples.css" />
<style type="text/css">
p { width:650px; }
</style>
<script>
Ext.onReady(function(){
var combo = new Ext.ux.form.HistoryClearableComboBox({
emptyText:'Type your search...',
selectOnFocus:true,
resizable:true
});
combo.applyTo('historyCombo');
});
</script>
</head>
<body>
<p>Remember on enter</p>
<div>
<input type="text" id="historyCombo" size="20"/>
</div>
</body>
</html>