Overriding a javascript onsubmit function

irishdude11 · 03-08-2011 11:05am #1

I need to override the onsubmit attribute of a javascript function. And the following code does the job -

[HTML]<html>
<body>
<form onsubmit="original_function()">
<input type="submit">
</form>

<script>
function original_function()
{
alert("Original");
}

function override_function()
{
alert("Overridden");
}
var form = document.getElementsByTagName("form")[0];
form.onsubmit = override_function;
</script>
</body>
</html>[/HTML]However the particular onsubmit attribute I need to override is in the following form - [HTML]<form onsubmit="return original_function(var1, var2)"[/HTML]As you can see it conatins the 'return' keyword and two variables. So how am I supposed to specify that when overriding the function? Because the following doesn't work -

[HTML]<html>
<body>
<form onsubmit="original_function()">
<input type="submit">
</form>

<script>
function original_function()
{
alert("Original");
}

function override_function(var1, var2)
{
alert("Overridden");
}
var a = 1;
var b = 1;
var form = document.getElementsByTagName("form")[0];
form.onsubmit = "return override_function(a, b)"; // This doesn't work
</script>
</body>
</html>[/HTML]

boblong · 03-08-2011 2:02pm

Something like this?

<html>
<body>
    <form onsubmit="original_function()">
        <input type="submit">
    </form>

    <script>
        function original_function()
        {
            alert("Original");
        }

        function override_function(var1, var2)
        {
            alert("Overridden");
        }
        var a = 1;
        var b = 2;
        var form = document.getElementsByTagName("form")[0];
        form.setAttribute("onsubmit","return override_function(a, b)"); // This does work :)
      </script>
</body>
</html>

irishdude11 · 03-08-2011 3:43pm

Great, that works alright. Cheers mate, had been googling for ages on how to do this.

Overriding a javascript onsubmit function

Comments