Unfortunately, whilst i still don't understand how to use firefbug, i
can say for sure that none of the 3 ideas (i.e. input,
[EMAIL PROTECTED] or .pickme) work when it comes to the type="file"
input.
As mentioned before, when i remove type="file" from the input, then
the code works fine and the page validates 100 % as strict xhtml.
This is the exact html:
<ul class="form">
<li>
<label for="title_new">Title</label>
<div class="input">
<input name="title_new" id="title_new"/>
</div>
</li>
<li>
<label for="message_new">Message</label>
<div class="input">
<textarea name="message_new"
id="message_new"></textarea>
</div>
</li>
<li>
<label for="attachment_new">Attachment</label>
<div class="input">
<input type="file" name="attachment_new"
id="attachment_new"/>
</div>
</li>
</ul>
And this is the exact script:
$(function()
{
$("ul.form").find("input,select,textarea,option")
.focus
(
function()
{
$(this).parents('li').addClass('odd');
}
)
.blur
(
function()
{
$(this).parents('li').removeClass('odd');
}
);
});
And i'm using FireFox 2.0.0.3 on a Windows XP....
UPDATE: Having typed in the last line regarding my system, i thought
to try this out on other browsers:
- IE7 - works perfectly fine
- Opera 9.1 & 9.21 - works perfectly fine
- Netscape - it doesn't work as described above
- Firefox 2.0.0.3 - it doesn't work as described above
Any ideas?
On May 25, 7:46 pm, Daemach <[EMAIL PROTECTED]> wrote:
> Hmm - input should get it by itself I would think. Are you certain
> it's not picking up the file field? Use firebug and console.log($
> ('input'));
>
> The fastest solution may be to add a class to all of the elements you
> want to select and use that instead. ('input.pickme'). When I get
> back in I'll have to test a file field.
>
> On May 25, 9:24 am, fambizzari <[EMAIL PROTECTED]> wrote:
>
> > I've tried
>
> > - $("ul.form").find("input,select,textarea,option,[EMAIL PROTECTED]")
> > and
> > - $("ul.form").find(":input")
>
> > And neither of those work!!!
>
> > I've removed file="type" from the input just to make sure that is the
> > problem and everything works fine if its gone.
>
> > Any more ideas?
>
> > On May 25, 7:14 pm, Daemach <[EMAIL PROTECTED]> wrote:
>
> > > Try $("fieldset").find(":input") to grab all form fields. (http://
> > > docs.jquery.com/DOM/Traversing/Selectors)
>
> > > If that doesn't work, [EMAIL PROTECTED] should pick it up.
>
> > > On May 25, 9:08 am, fambizzari <[EMAIL PROTECTED]> wrote:
>
> > > > Unfortunately, whilst your suggestions work excellently, the following
> > > > piece of code:
>
> > > > $("fieldset").find("input,select,textarea,option")
>
> > > > does not work with
>
> > > > <input type="file"/>
>
> > > > Any idea what i should do to fix it?
>
> > > > On May 25, 3:50 pm, fambizzari <[EMAIL PROTECTED]> wrote:
>
> > > > > Thanks Guys.
>
> > > > > Most helpful
>
> > > > > On May 25, 11:32 am, George Adamson <[EMAIL PROTECTED]>
> > > > > wrote:
>
> > > > > > Daemach2's solustion would do it, and if your <li> elements are
> > > > > > nested
> > > > > > inside other <li> elements, you may wish to restrict the parents()
> > > > > > method to
> > > > > > match only the first <li> up the tree by using
> > > > > > $(this).parents('li:first').addClass('on'); instead, that way you
> > > > > > won't set
> > > > > > addClass('on') for more than one <li>
>
> > > > > > George
>
> > > > > > Daemach2 wrote:
>
> > > > > > > You should be able to do:
>
> > > > > > > $(function()
> > > > > > > {
> > > > > > > $("fieldset").find("input,select,textarea,option").focus
> > > > > > > (function()
> > > > > > > {
> > > > > > > $(this).parents('li').addClass('on');
> > > > > > > }
> > > > > > > )
> > > > > > > .blur
> > > > > > > (function()
> > > > > > > {
> > > > > > > $(this).parents('li').removeClass('on');
> > > > > > > }
> > > > > > > );
>
> > > > > > > });
>
> > > > > > > On May 24, 9:48 pm, fambizzari <[EMAIL PROTECTED]> wrote:
> > > > > > >> Hi everyone,
>
> > > > > > >> Imagine the following HTML scenario:
>
> > > > > > >> <li>
> > > > > > >> <label for="title_new">Title</label>
> > > > > > >> <div class="input"><input name="title_new"
> > > > > > >> id="title_new"/></div>
> > > > > > >> </li>
> > > > > > >> <li>
> > > > > > >> <label for="message_new">Message</label>
> > > > > > >> <div class="input">
> > > > > > >> <div>
> > > > > > >> <div>
> > > > > > >> <div>
> > > > > > >> <input name="message_new"
> > > > > > >> id="message_new"/>
> > > > > > >> </div>
> > > > > > >> </div>
> > > > > > >> </div>
> > > > > > >> </div>
> > > > > > >> </li>
>
> > > > > > >> How could i modify the following jquery code so that it effects
> > > > > > >> the
> > > > > > >> parent <li> and and not the parent node:
>
> > > > > > >> $(function()
> > > > > > >> {
> > > > > > >> $("fieldset").find("input,select,textarea,option").focus
> > > > > > >> (function()
> > > > > > >> {
> > > > > > >> this.parentNode.className = "on";
> > > > > > >> }
> > > > > > >> )
> > > > > > >> .blur
> > > > > > >> (function()
> > > > > > >> {
> > > > > > >> this.parentNode.className = "";
> > > > > > >> }
> > > > > > >> );
>
> > > > > > >> });
>
> > > > > > >> I hope that makes sense.
>
> > > > > > --
> > > > > > View this message in
> > > > > > context:http://www.nabble.com/Finding-a-parent-list-item.-tf3814215s15494.htm...
> > > > > > Sent from the JQuery mailing list archive at Nabble.com.
