Post Form Data from Within a Loop

Question

I would like to submit form data when clicking a check box within a list. Currently I am using the onclick event which does not work because it sends a get request and I need it to send a post request.

How can I post the two parameters to my controller method from within the loop.

EDIT From the comments below I need to use AJAX as I was intending to remain on the same page. I incorrectly thought a post request would do that. If someone is willing to point me in the right direction with AJAX that would be appreciated.

Here is the code:

@for (var i = 0; i < Model.Count(); i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].InvoiceID)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].Description)                     
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].InvoiceDate)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].DueDate)
                </td>
                <td>                        
                    <input asp-for="@Model[i].Paid" onclick="location.href='@Url.Action("UpdatePaidStatus", "Billing", new { invoiceID = Model[i].InvoiceID, paid = Model[i].Paid })'" />                       
                </td>                   
            </tr>
        }

Use a form with a submit button (and add invoiceID and paid as route parameters or hidden inputs) — user3559349
– user3559349, Commented Jan 18, 2016 at 10:07
Url.Action just redirects, which is a get by definition. Use either javascript to send the post request or use some sort of form construction that uses Form.FormActionMethod = FormActionMethod.Post — Glubus
– Glubus, Commented Jan 18, 2016 at 10:08
@Stephen - But if I use a form, how do I tell it which list item to use? Wouldnt the form just use the parameters from the first list item? — Reafidy
– Reafidy, Commented Jan 18, 2016 at 10:09
@Reafidy, ajax stays on the same page, so if your redirecting in the POST method, then its pointless. If however you want to stay on the same page and keep submitting value then its the way to go. — user3559349
– user3559349, Commented Jan 18, 2016 at 10:15
Yes [ you are wrong :) ] - you need to use ajax if you want to stay on the same page. — user3559349
– user3559349, Commented Jan 18, 2016 at 10:21

user3559349 · Accepted Answer · 2016-01-18 11:06:08Z

Based on your comments, you want to post the invoiceID of the model in the row along with a value indicating the state of the checkbox. Change you html to

<input type="checkbox" class="status" value="@Model[i].InvoiceID />

and add the following script

var url = "@Url.Action("UpdatePaidStatus", "Billing");
$('.status').click(function() {
  var id = $(this).val();
  var isPaid = $(this).is(':checked');
  $.post(url, { id: id, isPaid : isPaid }, function(data) {
    if (data) {
      // do something based on the data you return
    } else {
      // oops
    }
  }).fail(function() {
     // oops
  });
});

which would post to the following method

[HttpPost]
public JsonResult UpdatePaidStatus(int ID, bool isPaid)
{
  // save something
  return Json(true); // or return Json(null) is it fails?
}

You have not indicated what you might what to happen when the ajax call succeeds or fails, but for example you might update the DOM to display a message indicating success or otherwise.

Side note: ajax may not really be necessary here. If you included a hidden input for Model[i].InvoiceID in each row and do a normal form submit to

public ActionResult UpdatePaidStatus(IList<yourmodel> model)

then your model will be correctly bound with the InvoiceID and Paid properties so you can update all items in the collection in one action.

Community · Accepted Answer · 2017-05-23 11:59:17Z

1

You can either create your own handler using jQuery to collect all the data from the form and then manually do a post to your controller or use Ajax.BeginForm. Some relevant answers have already been posted here and here.

edited May 23, 2017 at 11:59

CommunityBot

11 silver badge

answered Jan 18, 2016 at 10:46

drcolombo

3341 silver badge6 bronze badges

Collectives™ on Stack Overflow

Post Form Data from Within a Loop

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related