On 09/08/06, Dan Atkinson <[EMAIL PROTECTED]> wrote:
>
> I've had a thought about this which may make it slightly more efficient.
>
>
> Instead of generating each selectbox on load, along with their respective
> options, wouldn't it be better to create on hover, and then hide it when the
> element is mouseout'd.
>
>
> If the element is then hovered over again, then check to see if it exists,
> and show if it is. I see something like this:
>
>
>
> $("#tablename td", this).hover(
> function(element){
> if (/* If select exists in element (not sure if
> $("select",element).find() would return bool or not)... */)
> {
> $("select",element).show();
> }
> else
> {
> /* Usual select creation code here */
> }
> },function(element){
> /* Turn selected value/text into element text */
> $("select",element).hide();
> }
> )
>
>
>
> I'm bringing this up here because, when I first tried out Sam's code, I
> experienced massive delays in loading, as several hundred td's were
> populated with select boxes (even when there were just two options). When
> creating them on the fly, I saved a lot of time, as it only had to create
> them, and hide them when they moved the mouse away.
>
>
> Anyhoo, tell me if I'm crazy and don't know enough about JS (I don't! ;)).
> This just seems a better way to do things on large datasets where the
> loading time needs to be less than 20+ seconds.
> --
It doesn't scale that well (I've only used it with about 50 cells). If
you have the same dropdown in many cells, you can always create it
before hand and use cloneNode (not tested):
var myselect;
$(window).load(init);
function init()
{
myselect = document.createElement("select");
var option1 = document.createElement("option");
var option2 = document.createElement("option");
option1.text = "Yes";
option1.value = "1";
option2.text = "No";
option2.value = "0";
myselect.options.add(option1);
myselect.options.add(option2);
$("#mytable td").each(
function()
{
this.appendChild(myselect.cloneNode(true));
}
)
}
You could combine both approaches though - create the select on page
load, but only add when you hover over a cell.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
