Ajax.BeginForm(), OnSuccess - get event target

Question

I can't get the the target of the element which fired OnSuccess() method within Ajax.BeginForm(). So here is the code snippet:

@using (Ajax.BeginForm("InsertModel", "Home", new AjaxOptions
{
    HttpMethod = "POST",
    OnSuccess = "doWork(this,'SomeCustomText')"
}))
{
    <div id="container">
       <--Some HTML--!>
      <input type="submit" value="OK"/>
    </div>
}

<script>
function doWork(e,customText)
{
   alert(customText);  //It shows 'SomeCustomText', so its good.

   alert(e);  //[Object] object
   alert(e.prop("tagName"));  //Object #<Object> has no method 'prop' 
   alert(e.attr("tagName"));  //Object #<Object> has no method 'attr' 
   alert(jQuery(e).html());  //undefined
   alert(jQuery(e).prop("tagName"));  //undefined
   alert(e.target);  //undefined
   alert(jQuery(e).target);  //undefined
 }
<script/>

The Question:

How to get target?! Thank you

Update 1

The jQuery version should look like this:

jQuery.ajax({
    url:"/Home/InsertModel",
    data:"some post data",
    type:"POST",
    success:function(data){ 
          doWork(this,data); // so i really do not care about data! I just need jQuery(this)
    }
  })

Luxate

What is the HTML being generated? – Strategic

I do not care about the return data. Here is an example: jQuery.ajax(){url:"/Home/Insert",type:"POST",success:function(data){ alert(data); // so i do not care about data! I just need jQuery(this); where this - I suppose it should be the form()}} – Luxate

Your question is a bit unclear. What do you mean by "which element fired OnSuccess()"? – Masterpiece

Try to think about "who is" this, inside OnSuccess = "doWork(this,'SomeCustomText')" – Luxate

Answer 1

If you want to access the form element you have many options, if you only have one form on the page you can do $("form") and jquery will give you the form element.

Another option is changing the Ajax.BeginForm constructor that takes the form id as parameter like so:

@using (Ajax.BeginForm("InsertModel", "Home",null, new AjaxOptions
{
    HttpMethod = "POST",
    OnSuccess = "doWork('SomeCustomText')"
}, new {id = "myFormId"}))
{
    <div id="container">
       <--Some HTML--!>
      <input type="submit" value="OK"/>
    </div>
}

And in javascript

<script>
function doWork(customText)
{
   alert(customText);  //It shows 'SomeCustomText', so its good.

   // find the form by id
   $("#myForm1");

   // find forms in the page
   $("form")


 }
<script/>

In plain JQuery:

$.ajax({
    url:"/Home/InsertModel",
    data:"some post data",
    type:"POST",
    success:function(data){ 
       // find the form by id
       $("#myForm1");

       // find forms in the page
       $("form")        

       ...
    }
  });

Grocer

Your "javascript" example uses jQuery, therefore requiring a jQuery library. – Masterpiece

He is already using Jquery in the question... Jquery is the same as $ sign. – Grocer

I'm aware of this, but you said "And in javascript" when in reality it was jQuery. – Masterpiece

Thank you for your answer, it's a good point, but it does not fit my scenario. Because I have 10+ forms like this one, or.. nested forms, so I'm interested in doing something generic using this, in order to avoid hard-coding the formId. MVC already generates a formId with the in-built Ajax.BeginForm() helper. Thank you again – Luxate