.net Mvc 3 Ajax.BeginForm, get the form element

5
votes

I'm trying to work with the form dom element with the OnBegin & OnComplete routines of the Ajax.BeginForm helper in Mvc.

Currently I have this:

@using (Ajax.BeginForm("Contact", "Home", new AjaxOptions { OnBegin = "handleOnBegin" }))

But within the OnBegin / OnComplete handlers, I want to work with the form dom element - is this going to be possible? I've checked the arguments passed to those handlers and I can't see anything.

function handleOnBegin(a, b){
  var f = <get form>;
  animateForm(f);
}

I've even tried passing 'this' with the handlers but that only seems to pass the XHR object (or something similar)... Also, I'm reluctant to tit about with passing id's and adding more code as I'm convinced there's a simpler way.

3
asp.net-mvcformsdomasp.net-ajaxajax.beginform

3 Answers

6
votes

An an ID to your form as the 4th parameter to Ajax.BeginForm:

@using (Ajax.BeginForm("Contact", "Home", 
        new AjaxOptions { OnBegin = "forms.onBegin", OnComplete = "forms.onComplete" },
        new { id = "FormName" }))

Then you can select the form by ID (#FormName).

Edit:

Or see the answers to this question

1
votes

I looked at the arguments also and can't see anything that will help out of the box. Another option is to add a function to your library that will add an onclick event handler to the buttons on your page. Something like

var clickedBtnID = null;
$(document).ready(function()) {
    $(input[type=submit]).click(function() {
        clickedBtnID = $(this).attr("id");
    }
}

Then you can access clickedBtnID from your callback function. Not a perfect solution but it might be general enough.

0
votes

Give CSS classes to the DOM elements you want to work with. So you can find the elements by CSS classes, even if the form is in a partial, and nested in other elements for example.

Something like this:

$form.find(".labelToUpdate").text(response.labelText);