title: MVC button save button not working, button does nothing
body: <p>I am trying to append an item to the SQL table but when I press the save button nothing happens. The reset button works but not the Save. Nothing is showing in the database either. Basically, I don't understand why the buttons act as if there was no code attached to it. No Error message or crash shows up either.</p>
  <p><strong>View</strong></p>
  <pre><code>@model BudgetAmazon.ViewModel.ItemViewModel
  @{
      ViewBag.Title = &quot;Item&quot;;
  }
  
  &lt;h2&gt;Index&lt;/h2&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      $(document).ready(function () {
          $(&quot;#btnSave&quot;).click(function () {
              SaveItem();
          });
          $(&quot;#btnReset&quot;).click(function () {
              ResetItem();
          });
      });
  
      function ResetItem() {
          $(&quot;#CategoryId&quot;).val(&quot;1&quot;);
          $(&quot;#ItemCode&quot;).val(&quot;&quot;);
          $(&quot;#ItemName&quot;).val(&quot;&quot;);
          $(&quot;#Description&quot;).val(&quot;&quot;);
          $(&quot;#ItemPrice&quot;).val(&quot;0&quot;);
          $(&quot;#ImagePath&quot;).val(&quot;&quot;);
      }
  
      function SaveItem() {
          var formData = new FormData();
          formData.append(&quot;CategoryId&quot;, $(&quot;#CategoryId&quot;).val());
          formData.append(&quot;ItemCode&quot;, $(&quot;#ItemCode&quot;).val());
          formData.append(&quot;ItemName&quot;, $(&quot;#ItemName&quot;).val());
          formData.append(&quot;Description&quot;, $(&quot;#Description&quot;).val());
          formData.append(&quot;ItemPrice&quot;, $(&quot;#ItemPrice&quot;).val());
          formData.append(&quot;ImagePath&quot;, $(&quot;#ImagePath&quot;).get(0).files[0]);
  
          $.ajax({
              async: true,
              type: 'POST',
              contentType: false,
              processDate: false,
              data: formDate,
              url: '/Item/Index',
              success: function (data) {
                  if (data.success) {
                      alert(data.Message);
                      ResetItem();
                  }
                  
              },
              error: function (data) {
                  alert('There is a problem adding items.');
              }
          });
      }
  &lt;/script&gt;
  &lt;div class=&quot;container&quot;&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Category :
              @Html.DropDownListFor(model =&gt; model.CategoryId, new SelectList(Model.CategorySelectListItem, &quot;Value&quot;, &quot;Text&quot;),
              new { @class = &quot;form-control&quot;})
  
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Item Code :
              @Html.TextBoxFor(model =&gt; model.ItemCode, new { @class = &quot;form-control&quot;, autocomplete = &quot;Off&quot;})
  
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Item Name :
              @Html.TextBoxFor(model =&gt; model.ItemName, new { @class = &quot;form-control&quot;, autocomplete = &quot;Off&quot; })
  
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Description :
              @Html.TextBoxFor(model =&gt; model.Description, new { @class = &quot;form-control&quot;, autocomplete = &quot;Off&quot; })
  
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Item Price :
              @Html.TextBoxFor(model =&gt; model.ItemPrice, new { @class = &quot;form-control&quot;, autocomplete = &quot;Off&quot; })
  
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;col-md-4&quot;&gt;
          &lt;div class=&quot;form-group&quot;&gt;
              Image Path :
              @Html.TextBoxFor(model =&gt; model.ImagePath, new { type = &quot;file&quot;, @class = &quot;form-control&quot;})
  
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div&gt;
          &lt;input type=&quot;button&quot; value=&quot;Save&quot; name=&quot;save&quot; class=&quot;btn btn-primary&quot; id=&quot;btnSave&quot;/&gt;
          &amp;nbsp;
          &lt;input type=&quot;button&quot; value=&quot;Reset&quot; name=&quot;reset&quot; class=&quot;btn btn-danger&quot; id=&quot;btnReset&quot;/&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p><strong>Controller</strong></p>
  <pre><code>using System;
  using System.Collections.Generic;
  using System.IO;
  using System.Linq;
  using System.Web;
  using System.Web.Mvc;
  using BudgetAmazon.Models;
  using BudgetAmazon.ViewModel;
  
  namespace BudgetAmazon.Controllers
  {
      public class ItemController : Controller
      {
          private BudgetAmazonEntities3 objBudgetAmazonEntities;
          public ItemController()
          {
              objBudgetAmazonEntities = new BudgetAmazonEntities3();
  
          }
          // GET: Item
          public ActionResult Index()
          {
              ItemViewModel objItemViewModel = new ItemViewModel();
              objItemViewModel.CategorySelectListItem = (from objCat in objBudgetAmazonEntities.Categories select new SelectListItem()
                                                          {
                                                          Text = objCat.CategoryName,
                                                          Value = objCat.CategoryId.ToString(),
                                                          Selected = true
                                                          });
              return View(objItemViewModel);
          }
  
          [HttpPost]
          public JsonResult Index(ItemViewModel objItemViewModel) 
          {
              string NewImage = Guid.NewGuid() + Path.GetExtension(objItemViewModel.ImagePath.FileName);
              objItemViewModel.ImagePath.SaveAs(Server.MapPath(&quot;~/Images/&quot; + NewImage));
  
              Item objItem = new Item();
              objItem.ImagePath = &quot;~/Images/&quot; + NewImage;
              objItem.CategoryId = objItemViewModel.CategoryId;
              objItem.Description = objItemViewModel.Description;
              objItem.ItemCode = objItemViewModel.ItemCode;
              objItem.ItemId = Guid.NewGuid();
              objItem.ItemName = objItemViewModel.ItemName;
              objItem.ItemPrice = objItemViewModel.ItemPrice;
              objBudgetAmazonEntities.Items.Add(objItem);
              objBudgetAmazonEntities.SaveChanges();
  
              return Json(new {Success = true, Message = &quot;Item is added Successfully.&quot;}, JsonRequestBehavior.AllowGet);
          }
      }
  }
  </code></pre>
  <p><strong>ViewModel</strong></p>
  <pre><code>using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Web;
  using System.Web.Mvc;
  
  namespace BudgetAmazon.ViewModel
  {
      public class ItemViewModel
      {
          public Guid ItemId { get; set; }
          public int CategoryId { get; set; }
          public string ItemCode { get; set; }
          public string ItemName { get; set; }
          public string Description { get; set; }
          public decimal ItemPrice { get; set; }
          public HttpPostedFileBase ImagePath { get; set; }
          public IEnumerable&lt;SelectListItem&gt; CategorySelectListItem { get; set; }
      }
  }
  </code></pre>