On 6/21/07, Brad Perkins <[EMAIL PROTECTED]> wrote:
On Jun 21, 11:29 am, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> Brad,
>
> Glad to help, I had to solve a similar problem a few months back.
>
> Regarding the use of the already-present names instead of duplicating
them
> to IDs, it may be worth the duplication for speed of selectors if that
is a
> concern.
> It wholly depends on how many elements there are in the page - what
could be
> useful is to give each <tr> an id of "row-304".
Even with the original traverse up, then down code, selection was
quick, but I didn't like the syntax.
In the actual page the rows do have ids and I don't think the number
of elements will be an issue.
What I meant by this was that an operation like getting elements by name is
a 'slow' operation - I don't think the browser has any 'shortcuts' it can
take to find them, so must search through the entire DOM to find all
matching elements. Conversely, when getting an element by ID, the browser
knows there is only one and can retrieve it very quickly.
Thus, more elements => retrieving by name is slower
That way you can use that as
> a context for retrieving something by name, e.g. [untested]:
>
> var row = $("#row-"+index);
>
> > $('[EMAIL PROTECTED]'], row).val(...);
>
I'll give that a try. If I understand that selector correctly that
will "find the input element with name 'serial-304' within the tr
referenced by 'row'"?
Correct. The second paramater is 'context' - the selector provided will be
limited to elements in the context, which defaults to the current document.
I'm not certain of how beneficial either of those suggestions would be
> speed-wise though, it could be worth testing if important.
Out of curiosity, and for future reference what is the best way to
measure the selection speed?
If available, a Javascript profiler such as the one provided in the
excellent Firefox plugin firebug (http://www.getfirebug.com).
Otherwise best is to output start and end times of functions yourself. Do
whatever benchmark a few hundred times to get a good average, then compare
the methods.
Thanks Again!
> --rob
>
> On 6/21/07, Brad Perkins <[EMAIL PROTECTED]> wrote:
>
>
>
>
>
> > Rob,
>
> > That is an excellent suggestion. I didn't give actual source in the
> > example, but it turns out that each of the selects and inputs have
> > unique numbered "name" attributes already, e.g., name="serial-304".
> > The numeric part correspond to keys in the db backend. So I can either
> > add a redundant id attribute or just lookup based on $
> > ('[EMAIL PROTECTED]']) or $('[EMAIL PROTECTED]']).
>
> > re: not using .val
>
> > For some reason I thought that had been deprecated when .id and .name
> > were. Thanks for pointing out that it still exists.
>
> > On Jun 21, 2:29 am, "Rob Desbois" <[EMAIL PROTECTED]> wrote:
> > > I would suggest making all of these items related via numeric IDs,
you
> > then
> > > dispose with having to traverse up and back down the DOM to find the
> > related
> > > elements:
>
> > > <tr>
>
> > > > <td>
> > > > <select id="select_1">...</select>
> > > > </td>
> > > > <td>
> > > > <input id="text_1a" type="text" ... />
> > > > </td>
> > > > <td>
> > > > <input id="text_1b" type="text" ... />
> > > > </td>
> > > > <td>
> > > > <input id="text_1c" type="text" ... />
> > > > </td>
> > > > <td>
> > > > ...
> > > > </td>
> > > > </tr>
>
> > > > // Update 2nd column <input> with new_value.
> > > > // $(this) is the select in the first row cell.
> > > > var index = /select_(\d+)/.exec(this.id)[1]; // Get the number
from
> > the
> > > > ID. There is no checking if it doesn't match.
> > > > var new_value = $(this).val();
> > > > $("text_"+index+"a").val(new_value);
>
> > > Incidentally, as I've used here, the .val() function is a handy
shortcut
> > for
> > > .attr("val", ...)
>
> > > I don't know what the speed difference is here but I'm guessing
it'll be
> > > pretty good.
>
> > > HTH,
> > > --rob
>
> > > On 6/21/07, Brad Perkins <[EMAIL PROTECTED]> wrote:
>
> > > > Imagine a table row like this
>
> > > > <tr>
> > > > <td>
> > > > <select>...</select>
> > > > </td>
> > > > <td>
> > > > <input type="text" ... />
> > > > </td>
> > > > <td>
> > > > <input type="text" ... />
> > > > </td>
> > > > <td>
> > > > <input type="text" ... />
> > > > </td>
> > > > <td>
> > > > ...
> > > > </td>
> > > > </tr>
>
> > > > Depending on the select option I need to modify or clear values in
the
> > > > text inputs in the 2nd, 3rd, and 4th cells.
>
> > > > I find that this code works, but suspect there may be a better way
to
> > > > achieve the same result with less code?
>
> > > > // Update 2nd column <input> with new_value.
> > > > // $(this) is the select in the first row cell.
> > > > $
>
> >
(this).parent('td').parent('tr').children('td').eq(1)children('input').attr("value",new_value);
>
> > > > Since I'll be updating various cells I suppose this helps, but
again
> > > > suspect there is a better way.
> > > > var cells = $(this).parent('td').parent('tr').children('td');
> > > > cells.eq(1).children('input').attr("value",new_value_1);
> > > > cells.eq(3).children('input').attr("value",new_value_2);
> > > > cells.eq(4).children('input').attr("value",new_value_3);
>
> > > > Thanks
>
> > > > Brad
>
> > > --
> > > Rob Desbois
> > > Eml: [EMAIL PROTECTED]
> > > Tel: 01452 760631
> > > Mob: 07946 705987
> > > "There's a whale there's a whale there's a whale fish" he cried, and
the
> > > whale was in full view.
> > > ...Then ooh welcome. Ahhh. Ooh mug welcome.
>
> --
> Rob Desbois
> Eml: [EMAIL PROTECTED]
> Tel: 01452 760631
> Mob: 07946 705987
> "There's a whale there's a whale there's a whale fish" he cried, and the
> whale was in full view.
> ...Then ooh welcome. Ahhh. Ooh mug welcome.
--
Rob Desbois
Eml: [EMAIL PROTECTED]
Tel: 01452 760631
Mob: 07946 705987
"There's a whale there's a whale there's a whale fish" he cried, and the
whale was in full view.
...Then ooh welcome. Ahhh. Ooh mug welcome.
