Question

I’m having a little problem with form submission with jquery. I’ve submitted a lot of forms with it in the past but I was just thinking, how can I use the event handler .submit() to submit a form and it’s elements without callin the forms ID. The problem is that I can’t seem to be able to chain elements with $(this) (it’s possible using .children() but I just want to use .each() through the input fields).

Here is a code snippet:

$('.editTimeLink').click(function () {
    var id = $(this).attr('rel');
    $.get('<?php echo $config["httpRoot"]; ?>/ajax.php?ajax=1&sec=time&a=edit&id=' + id, {}, function (data) {
        if (data.returnCode == 1) {
            $('#timeBox_' + id).html(data.data);
            $('#timeBox_' + id + ' form').bind('submit', function () {
                //$(this).$(':input').each(function () {
                //$(this).(':input').each(function () {
                $(this).each(':input', function () {
                    alert("adsf");
                });

                return false;
            });
        } else if (data.returnCode == 0) {
            alert(data.data);
        }
    }, 'json');

    return false;
});

Like you can see I’m trying to alert the string “asdf” for each input element in the form “this”.

You can see where the 2 lines are commented out what I have been trying to manage. The line that isn’t commented out doesn’t work neither. I know how I can fix this, for instance pass the form selectors name to the lambda function but I was just thinking if there’s a more “clean” way to do this?

Thanks in advance.
Kristinn.

Answer 1

Why can’t you use children()? You can still use each().

$(this).children(':input').each(...);

However, this does not work:

$(this).each(':input', function () {
    alert("test");
});

Because each() only takes one argument, a callback (doc here).

By the way: using a JS debugger, e.g., Firebug, is a good idea to find out why stuff is not working.