Question

I have an ajax.beginform() like this :

@using (Ajax.BeginForm("Create_Product", "Admin", new AjaxOptions() { OnFailure = "alert(\"Error !!!\")", HttpMethod = "post"}))
{
//blah blah
}

It sends the form data to an ActionMethod called Create_Product…
Inside this ActionMethod, before I save the data as a new ‘product’ to the database, – inside a try/catch – I check to see whether the inserted product already exists or not. And if already exists, I need to return to the view AND trigger/run the OnFailure method of the ajax form 🙂

Is it possible ? how is it done ?

Answer 1

Remove the Ajax Beginform and use the normal form

@using(Html.Beginform("Create_Product","Admin"))
{
  <input type="text" name="productName" />
  <input type="submit" id="saveNewProduct" />
}

And some javascript now to handle our Ajax Saving

<script type="text/javascript">
  $(function(){

       $("#saveNewProduct").click(function(e){
          var item=$(this);
          e.preventDefault();

          $.post("@url.Action("Create_Product","Admin")",
                                item.closest("form").serialize(),function(data){
                if(data.Status=="Exist")
                { 
                   alert("The Product already exist");
                }
                else if(data.Status=="Success")
                {
                  alert("Saved Successfully");   
                }

           });  

       });    
  });

</script>

Assuming your Action method Returns a JSON back in the below format, if it is successfully inserted

{   "Status": "Success"   }

If the Product already exist, It returns this

{  "Status": "Exist"  }

So your Action method can look like this

[HttpPost]
public ActionResult Create_Product(YourViewModel model)
{
  try
  {
     //check product exist, if yes return the below commented JSON 
     // return Json(new { Status="Exist" });
    //else , Insert the data and Return Succes in JSON
     // return Json(new { Status="Success" });
  }
  catch(Exception ex)
  {
     // log error
    return Json(new { Status="Error" });
  }
}