Ronald
Ronald

Reputation: 33

MVC jQuery delete action not working

i've been breaking my head over this one for a while now. i have the form below, which works fine.

@using (Html.BeginForm("Edit", "PCLLine", FormMethod.Post))
{
  @Html.AntiForgeryToken()
  @Html.ValidationSummary(true)

  @Html.HiddenFor(model => model.ID)
  @Html.HiddenFor(model => model.Field)
  <div class="small">
    @Html.TextBoxFor(model => model.Number, new { onchange = "setEditWBSElementNumber(this," + Model.ID + ")" })
    @Html.ValidationMessageFor(model => model.Number)
  </div>

  <div class="large">
    @Html.EditorFor(model => model.Description)
    @Html.ValidationMessageFor(model => model.Description)
  </div>

  <div>
    @Html.EditorFor(model => model.NumberTwo)
    @Html.ValidationMessageFor(model => model.NumberTwo)
  </div>

  <div>
    @Html.TextBoxFor(model => model.ConcatNumber, new { @id = Model.ID.ToString() + "_WBSElementNumber" })
    @Html.ValidationMessageFor(model => model.ConcatNumber)
  </div>

  <div class="large">
    @Html.EditorFor(model => model.Remarks)
    @Html.ValidationMessageFor(model => model.Remarks)
  </div>
  <div>
    <input type="submit" class="accept" value="Opslaan" />
  </div>
  <div>
    <input class="folderButton" value="Opties" onclick="pclSubLineDialog()" />
  </div>
  <div>
    <input class="delete" value="Verwijderen" onclick="deleteItem(); return false;" />
  </div>
}

The problem here is in the delete. It calls the function, but does not execute properly. It does not hit my Controller actions, yet trying it with other controller actions, it does work:

function deleteItem() {
    $.ajax({
      url: "PCLLine/Delete",
      type: "POST",
      data: { id: "@Model.ID" },
      dataType: "json",
      success: function (data) {
        alert('');
      }
    });
  }

And the controller:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Delete(int pclLineId)
{
  try
  {
    // TODO: Add delete logic here
    _pclLineBLL.DeletePCLLine(pclLineId);
    return Json(new { success = true });
  }
  catch
  {
    return Json(new { success = false });
  }
}

Upvotes: 0

Views: 944

Answers (3)

joe_coolish
joe_coolish

Reputation: 7259

In your Controller class, you have named the parameter pclLineId instead of id.

You can either:

  1. Rename the parameter id
  2. Change your jQuery function to pass pclLineId instead of id

Upvotes: 2

Systematix Infotech
Systematix Infotech

Reputation: 2365

//Change your function to

function deleteItem() {
    $.ajax({
      url: "PCLLine/Delete",
      type: "POST",
      data: { pclLineId: "@Model.ID" },
      dataType: "json",
      success: function (data) {
        alert('');
      }
    });
  }

Upvotes: 0

Andrei
Andrei

Reputation: 56688

Name of the parameter matters. You should rename your request parameter according to the action declaration:

data: { pclLineId: "@Model.ID" },

Upvotes: 3

Related Questions