Hi,
I've implemented a customized autocompleter using prototypes and it
actually works like a charm in Firefox, but in IE 6/7 it just doesn't
work because that infernal thing says that 'Autocomp' (the class i
created for the autocompleter) is 'not defined'.
It's kind of weird because I tried to show an alert before of the
class definition but it is not shown even though the error is thrown
at the instantiation of the autocompleter.
I was googling for more than a reasonable time but i did not found the
cause... any help? Please consider that I'm using Portotype framework
(I also tried its Class creation API but the result was the same) and
Scriptaculous (its Ajax.Autocompleter worked without problems, but we
need a more customized control in order to fit our needs).
Sample response file (autocomplete.html):
<table>
<tr><th>Field 1</th><th>Field 2</th><th>Field 3</th></
tr>
<tr class="autocompleteFila"><td>XXXX</td><td><span
class="autocompleteInput">YYYY</span><span
class="autocompleteRet">ZZZZZ</span></td><td>AAAA</td></tr>
<tr class="autocompleteFila"><td>XXXX</td><td><span
class="autocompleteInput">YYYY</span><span
class="autocompleteRet">ZZZZZ</span></td><td>AAAA</td></tr>
<tr class="autocompleteFila"><td>XXXX</td><td><span
class="autocompleteInput">YYYY</span><span
class="autocompleteRet">ZZZZZ</span></td><td>AAAA</td></tr>
<tr class="autocompleteFila"><td>XXXX</td><td><span
class="autocompleteInput">YYYY</span><span
class="autocompleteRet">ZZZZZ</span></td><td>AAAA</td></tr>
</table>
Sample form is:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://
www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="/lib/prototype/prototype.js"></
script>
</head>
<body>
<script type="text/javascript">
/*<[CDATA[*/
alert('HOLA');
var Autocomp = function(inputField, returnField, class, rowClass,
returnClass, returnToInputClass, url, reqParam) {
this.idField = inputField;
this.returnField = returnField;
this.cssClass = class;
this.url = url;
this.cssRowClass = rowClass;
this.cssReturnClass = returnClass;
this.cssToInputClass = returnToInputClass;
this.reqParam = reqParam;
this.configure();
}
Autocomp.prototype.load = function(query) {
var complete = function(transport) {
var numRes = 0;
var f = $(this.returnField);
var input = $(this.idField);
var div = this.div;
var claseRet = this.cssReturnClass;
var claseInputRet = this.cssToInputClass;
this.div.innerHTML = transport.responseText;
this.div.select('.'+this.cssRowClass).each(
function (elem) {
numRes++;
Event.observe(elem, 'click', function
(e) {
f.value =
elem.select('.'+claseRet).reduce().innerHTML;
input.value =
elem.select('.'+claseInputRet).reduce().innerHTML;
div.hide();
});
});
if(numRes == 0) {
this.div.hide();
}
else {
this.div.show();
}
}
var h = $H(this.reqParam);
new Ajax.Request(this.url + '?'+ h.toQueryString() + '&query='
+
escape(query),
{
method: 'get',
onComplete: complete.bind(this)
});
}
Autocomp.prototype.configure = function() {
var f = $(this.idField);
var onKeyPress = function (event) {
if(f.value.length >= 3) {
this.load(f.value)
}
else {
this.div.hide();
}
};
var onFocus = function (event) {
f.clear();
};
Event.observe(f, 'keyup',
onKeyPress.bindAsEventListener(this));
Event.observe(f, 'focus', onFocus.bindAsEventListener(this));
this.div = new Element('div', {'class': this.cssClass,
'style': 'z-index: 1000; position: absolute; display: none; top: 0px;
left:0px'});
f.insert({after: this.div});
this.div.clonePosition(f, {setWidth: false, setHeight: false,
offsetTop: f.getHeight()});
}
alert('HOLA');
/*]]>*/
</script>
<input maxlength="100" type="text" id="txtOrigenOfe"
name="txtOrigenOfe" style="width:180px" value="">
<script type="text/javascript">
/*<[CDATA[*/
var a = new Autocomp('txtOrigenOfe', 'txtOrigenOfe', 'autocomplete',
'autocompleteFila', 'autocompleteRet', 'autocompleteInput', '/
autocomplete.html', {foo: 'bar'});
/*]]>*/
</script>
</body>
</html>
Thanks in advance.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to rubyonrails-spinoffs@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
