Ajax form submitted in jQuery not firing events

Ajax form submitted in jQuery not firing events

I have an ajax form and when I submit the form via jQuery the event
handlers are not triggered. Can anyone perhaps spot the error of my way?
index.cshtml
//abbreviated
@Html.Partial("_derp")
//abbreviated
<input type="button" value="Derpina" onclick="derpinski()" id="derpButton" />
//abbreviated
<div id="spinner" style="display: none;">
<img src="../images/loading.gif">
</div>
_derp.cshtml
<div>
@using (Ajax.BeginForm("DoTheDerp", "Derp", null, new AjaxOptions()
{
LoadingElementId = "spinner",
OnBegin = "DerpBegin",
OnComplete = "DerpComplete"
}, new {id = "theDerpForm"}))
{
//abbreviated stuff
}
</div>
derp.js
function derpinski()
{
//abberviated
$("#theDerpForm").submit();
}
function DerpBegin()
{
alert("begin"); // never fires
}
function DerpComplete(){
{
alert("complete") // never fires
}
My "spinner" is never shown and neither are my Begin and Complete
functions triggered. I read somewhere that I need to include the
unobtrusive-ajax javascript and I have already done that without effect.
Any help is well appreciated, thank you.