[jQuery] Re: Select all controls of the form

[Karl Rudd]

You shouldn't need to use $.extend in this case. Something like this
should work:

jQuery.fn.debug = function() {
  return this.each(function(){
    alert(this);
  });
};

Taken from http://docs.jquery.com/Plugins/Authoring

As for your selection code, you need to use "find" instead of
"filter". The "filter" removes non-matching elements, if you pass in a
"form" element then it won't do what you want. The "find" function
works on the child elements of the given elements, which is what you
want.

Karl Rudd

On Tue, Jan 13, 2009 at 7:17 PM, JQueryProgrammer
<jain.ashis...@gmail.com> wrote:
>
> I want to convert some existing code from traditional javascript for
> loop to $.each. Here is my code:
>
> var oEl = document.getElementById("my_form_id").elements;
>
> for(var i=0; i < oEl.length; i++) {
>     //do something
> }
>
> In jquery I have written a $.fn.extend function and the code as:
>
> $.fn.extend({
>    test: function() {
>
>        //I want to filter only input controls from hte form
>        var $this = $(this).filter(":input");
>
>        $.each($this, function() {
>                //do something
>        });
>    }
> })
>
> $("#my_form_id").test();
>
> But it is not working.
>
> On Jan 13, 12:05 pm, Karl Rudd <karl.r...@gmail.com> wrote:
>> Errr <img> elements aren't form controls. <input type="image">
>> elements are but ":input" selects those. I'm not sure what you mean.
>>
>> Karl Rudd
>>
>> On Tue, Jan 13, 2009 at 5:43 PM, JQueryProgrammer
>>
>> <jain.ashis...@gmail.com> wrote:
>>
>> > The above code selects all the controls except <img> tag.
>>
>> > On Jan 13, 11:26 am, Karl Rudd <karl.r...@gmail.com> wrote:
>> >> The '*' selector will select _all_ the nodes (including the <br/>s).
>> >> Try using the ':input' selector:
>>
>> >> $("#form1 :input")
>>
>> >>http://docs.jquery.com/Selectors
>>
>> >> Karl Rudd
>>
>> >> On Tue, Jan 13, 2009 at 5:16 PM, JQueryProgrammer
>>
>> >> <jain.ashis...@gmail.com> wrote:
>>
>> >> > I am trying to validate all the controls that exist in the form. My
>> >> > form code looks like:
>>
>> >> > <form id="form1">
>> >> >        <input type="text" id="txt1" name="txt1" />
>> >> >        <br/>
>> >> >        <textarea name="txtArea" id="txtArea" cols="100" rows="4" />
>> >> >        <br/>
>> >> >        <select id="sel1" name="sel1" style="width: 250px;" >
>> >> >                <option value="">Select</option>
>> >> >                <option value="1">One</option>
>> >> >                <option value="2">Two</option>
>> >> >                <option value="3">Three</option>
>> >> >        </select>
>> >> >        <br/>
>> >> >        <input type="radio" id="rdo1" name="rdo1"
>> >> > value="Option1">&nbsp;Option 1&nbsp;
>> >> >        <br/>
>> >> >        <input type="radio" id="rdo2" name="rdo1"
>> >> > value="Option2">&nbsp;Option 2&nbsp;
>> >> >        <br/>
>> >> >        <button id="btn1">Submit</button>
>> >> >        <button id="btn2">Reset</button>
>> >> > </form>
>>
>> >> > I want to select only the controls of the form viz: textbox, textarea,
>> >> > select, radio & button (Total 7). I am trying to extract them as
>>
>> >> > $("#form1 *").each(function() {
>> >> >     alert($("#+this").attr("id"));
>> >> > })
>>
>> >> > it gives me total 16 alerts. I want just 7. Any help..?