recordselect not updating list as I type.
coalex
I wanted to have an autocomplete field on a few forms where the drop downs are getting too long.
So...
I got recordselect working, but the list of options do not dynamically update as I type in the form field.
There are no obvious errors in the console.
Any ideas, Thank you!!
Started GET "/locationtypes/browse?search=" for 127.0.0.1 at 2014-12-30 17:22:05 -0700
Processing by LocationtypesController#browse as */*
Parameters: {"search"=>""}
(1.0ms) SELECT COUNT(*) FROM "locationtypes"
Rendered .../gems/recordselect-d5ed9fff0efc/app/views/record_select/_search.html.erb (1.0ms)
Locationtype Load (2.0ms) SELECT "locationtypes".* FROM "locationtypes" ORDER BY name LIMIT 12 OFFSET 0
Rendered .../gems/recordselect-d5ed9fff0efc/app/views/record_select/_list.html.erb (5.0ms)
Rendered .../gems/recordselect-d5ed9fff0efc/app/views/record_select/_browse.html.erb (17.0ms)
Completed 200 OK in 83.0ms (Views: 73.0ms | ActiveRecord: 5.0ms)
Rails 3.2.17
active_scaffold (3.3.3)
recordselect 3.4.3 from git://github.com/scambra/recordselect.git (at master)
jquery-rails 3.0.4
jquery-ui-rails 4.1.0
Sergio Cambra
Do you get requests to browse action on server or network tab of web inspector?
coalex
Sergio Cambra
delayedObserver code was updated on ActiveScaffold and RecordSelect. You are using a new recordselect version (with updated code) with an old ActiveScaffold version (with old code). You can downgrade recordselect to 3.3.0, upgrade ActiveScaffold, or try to set this code above activescaffold:
if (typeof(jQuery.fn.delayedObserver) === 'undefined') {
(function($){
$.extend($.fn, {
delayedObserver: function(callback, delay, options){
return this.each(function(){
var el = $(this);
var op = options || {};
el.data('oldval', el.val())
.data('delay', delay || 0.5)
.data('condition', op.condition || function() { return ($(this).data('oldval') == $(this).val()); })
.data('callback', callback)
[(op.event||'keyup')](function(){
if (el.data('condition').apply(el)) { return; }
else {
if (el.data('timer')) { clearTimeout(el.data('timer')); }
el.data('timer', setTimeout(function(){
var callback = el.data('callback')
if (callback) callback.apply(el);
}, el.data('delay') * 1000));
el.data('oldval', el.val());
}
});
});
}
});
})(jQuery);
};
Copy this code to a file and require it above activescaffold on your assets manifest.
Alexander Mendoza
mvargo
Sergio Cambra
Do you get any JS error on web inspector console?
mvargo
Sergio Cambra
Can you check css properties for that record-select div with inspector? Is there any display: none property?
mvargo
...
mvargo
Sergio Cambra
El Miércoles, 25 de marzo de 2015 16:04:14 mvargo escribió:
> A bit more info. I find that if I use a tall monitor and scroll the page
> so that there is plenty of room for the autocomplete to fit below the input
> element, the recordselect div positions correctly. It's only when I don't
> have room below to fit the div it puts in the bottom value that is too
> large.
>
> looking at the code I see in the show: function on the Recordselect
> (jquery/record_select.js in the gem line 214 is show:)
>
> if (position == 'top') this.container.css('top', top);
> else this.container.css('bottom', document_height - offset.top);
>
> So it seems to me the calculation of the bottom height is not working.
> Document_height is found above there as
>
> document_height = jQuery(document).height();
>
> Maybe that is the entire document height but you want the window height?
> I'm not really an expert at client side javascript...
How is input positioned? static? fixed? If record select has an absolute position, we want document height, because bottom 0 is at document bottom. However if input has fixed position, then we need to use window height.
I would need a test page so I can see why is not positioned right to fix it.
Sergio Cambra
I see the issue. body or html needs to be positioned relative. In other case recordselect position absolute works like position fixed, i.e. relative to window instead of document, so bottom: 0px is window bottom.
I usually have body { position: relative; } in my css, however I have added some code to fix position record select above input when body or html doesn't have position relative.
You can update record select or add body { position: relative; } to your css.
Mike Vargo
Mike
--
You received this message because you are subscribed to a topic in the Google Groups "ActiveScaffold : Ruby on Rails Gem" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/activescaffold/kZBG-B3E3kY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to activescaffol...@googlegroups.com.
To post to this group, send email to actives...@googlegroups.com.
Visit this group at http://groups.google.com/group/activescaffold.
For more options, visit https://groups.google.com/d/optout.