1

I am using Ajax.BeginForm in my partial view to submit the data.

Partial view - _getCategoryMaster.cs

<div>
    @using (Ajax.BeginForm("Submit", "CategoryMasterDataEntry", new AjaxOptions { OnSuccess = "OnDatatSuccess", OnFailure = "OnDataFailure", HttpMethod = "POST" }, new { enctype = "multipart/form-data" }))
    {
           <div style="float:left;width:100%;">
                <hr class="horizontal-line-bottom" />
                <div class="form-buttons tab-footer">
                    <button class="btn btn-md" type="submit" id="saveData" @if (TempData["DisplayAccess"].ToString() == "view") { <text> disabled </text>  }>SAVE</button>
                </div>
            </div>
     }
</div>

Now i'm trying to call this submit event from my parent view on the click event of the link from Jquery

Parent View - 

<html>
<head>
<script type="text/javascript">
 $(document).on('click', '.getProducts', function (e) {
        alert("Start");

        $('form#ajaxForm').trigger('submit');

        alert("End");
</script>
</head>
<body>
 <a id="anchId" href="javascript:void(0);" class="getProducts">
 <img src="~/Images/bullets.png" class="bullet-image" /> 
  <span class="menu-text">LinkName</span> 
  </a>
</body>
</html>

But its not firing that submit event of the partial view. I am getting those alerts (start and End). But its not firing that submit event.

What am I doing wrong here?

Tieson T.
  • 20,774
  • 6
  • 77
  • 92
omkar patade
  • 1,442
  • 9
  • 34
  • 66

1 Answers1

3

You do not have a form with id="ajaxForm". Replace new { enctype = "multipart/form-data" } (which is pointless since you cannot submit files using Ajax.BeginForm()) with new { id= "ajaxForm" }

@using (Ajax.BeginForm("Submit", "...", new AjaxOptions { ... }, new { id = "ajaxForm" }))

or simply use $('form').trigger('submit');

  • Can you answer while using `Ajax.BeginForm` why `event.stopPropagation();` and `e.preventDefault();` doesn't works on `OnBegin= "return MyBeginFunction(event)"` but `return false ;` works. [here](https://stackoverflow.com/a/48203120/2218697) is my answer. – Shaiju T Jan 11 '18 at 09:36
  • @stom, The `OnBegin()` is a function that is called immediately before the actual ajax call. If it returns `false` the subsequent ajax call is not executed. There is no 'event' that is being handled. And in your answer, you cannot call `$('Ajax_form').trigger('submit');` inside `OnBegin()` - that would create an infinite loop –  Jan 11 '18 at 10:07