How to put a jQuery code into one file which will be referenced by all pages?

I have a login popup that will pop up on every page of my site. What I want to do is once the user clicks submit, to have a single JS file where the jQuery code for handling that request lives, and makes an AJAX call to validate the parameters in the DB.

I am able to get the pop up box to pop up. And the form loads. I am thinking my jQuery code will live in a separate imported file and look like this:

<script type="text/javascript" >
$  (function()
{
    $  ("input[type=submit]").click(function()
    {
        var some_params= $  ("#param").val();

        var dataString = 'Some url to send to ajax';

        if( params validated ok )
        {
            $  ('.success').fadeOut(200).hide();
            $  ('.error').fadeOut(200).show();
        }
        else
        {
            $  .ajax({
                type: "POST",
                url: "/problems/add_problem.php",
                dataType: "json",
                data: dataString,
                success: function(json)
                {
                    $  ('.success').fadeIn(200).show();
                    $  ('.error').fadeOut(200).hide();
                }
            });
        }

        return false;
    });
});
</script>

So my question is how do I make this get invoked only when the right form is submitted? The form would have some id=”some_name” but I don’t really understand how to make this jQuery code get executed only when that form element is called.

Any ideas?

Thanks!!

newest questions tagged jquery – Stack Overflow