How to get the data-id Send to another controller mvc

Question

How to get the data-id sent to another controller in ASP.NET MVC?

The employee submits the form, automatically determines the id and department position, and then sends it to the manager for approval.

The manager clicks approval or reject on this page, and the form is sent to the next person for approval. At this step, the page prompts that id = null cannot be run. What should I do?

But Google background shows that I got this Id, how to send this Id to action?

public PartialViewResult saveStatus(int id, string Status, string AddDate, string Remark)
{
    int approvalId;

    if (id == 0 && Session["AppId"] == null)
    {
        var staff = db.Staffs.Where(s => s.UserName == User.Identity.Name).FirstOrDefault();

        RequestForApproval ap = new RequestForApproval
                    {
                        RequestToStaffId = staff.Id,
                        RequestDate = DateTime.Now,
                    };

        db.RequestForApprovals.Add(ap);
        db.SaveChanges();

        Session["AppId"] = ap.ReimbursementID;
        approvalId = ap.Id;
    }
    else
    {
        approvalId = int.Parse(Session["AppId"].ToString());
    }

    ApprovalStatus temp = new ApprovalStatus
                {
                    Id = approvalId,
                    Remark = Remark,
                    AddDate = DateTime.Now
                };

    db.ApprovalStatuses.Add(temp);
    db.SaveChanges();

    var df = db.ApprovalStatuses.Where(s => s.Id == approvalId).ToList();
    return PartialView(df);
}

public JsonResult CreateStatus()
{
    List<ApprovalStatus> mv = new List<ApprovalStatus>();

    if(Session["AppId"] == null)
    {
        ViewBag.Ae = 0;
    }
    else
    {
        ViewBag.Ae = Session["AppId"];
        int approvalId = int.Parse(Session["AppId"].ToString());
        mv = db.ApprovalStatuses.Where(s => s.Id == approvalId).ToList();
    }

    return Json(mv);
}

public ActionResult AddRequestForApproval()
{
    // var staffUser = db.StaffPositions.Where(a => a.Staff.UserName == System.Web.HttpContext.Current.User.Identity.GetUserId());
    var rmid = Session["RmId"].ToString();

    if (string.IsNullOrEmpty(rmid))
    {
        return RedirectToAction("Index");
    }

    int reimbursementId = int.Parse(rmid);
    Session["RmId"] = null;

    var Res = db.Reimbursements.Find(reimbursementId);
    var managerId = GetByStaffId(Res.StaffId,reimbursementId);

    RequestForApproval temp = new RequestForApproval();
    temp.ReimbursementID = reimbursementId;
    temp.RequestDate = DateTime.Now;
    temp.RequestToStaffId = managerId;

    db.RequestForApprovals.Add(temp);
    db.SaveChanges();

    return RedirectToAction("Index");
}

View:

@model Reimbursements.Models.RequesViewModel

@{
        ViewBag.Title = "Index";
        var add = Session["AppId"];
}

<h2>Index</h2>

<table class="table" id="table1">
        <tr>
            <th></th>
            <th>
                Staff Fname
            </th>
            <th>
                RequestDate
            </th>
            <th></th>
        </tr>

        @foreach (var item in Model.GetReApproval)
        {
            <tr>
                <td>
                    <a href="~/Reimbursements/GetOtherDetails/@item.ReimbursementId">@item.ReimbursementId</a>
                </td>
                <td>
                    @item.StaffName

                </td>
                <td>
                    @item.RequestDate
                </td>
                <td>
                    <button type="button" class="btn btn-primary"  data-toggle="modal" data-id="@item.RequerForApprovalId" data-target="#exampleModal" id="SelectBtn">Select</button>

                    <div class="modal fade" id="exampleModal"  tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h4 class="modal-title" id="Title">Select and Confirm</h4>
                                </div>
                                <div class="modal-body">
                                    <form>
                                        <div class="form-group" >
                                            <input type="hidden" id="Reid" />
                                            @Html.DropDownList("ApprovalStatus", null, new { @class = "btn btn-info",id="enumId" })
                                            @*@Html.DropDownList("Index", ViewBag.DropDownList as SelectList,null, new { @class = "btn btn-info",@id="DropDownList" })*@
                                        </div>
                                        <hr />

                                        <div class="form-group" style="visibility:visible" id="remarktext">
                                            <label for="message-text" class="control-label">Remark:</label>
                                            <textarea class="form-control" id="message-text" ></textarea>
                                        </div>

                                    </form>
                                </div>
                                <div class="modal-footer">
                                    @*<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            <button type="button" class="btn btn-primary">Confirme</button>*@
                                   <button data-id="@item.ReimbursementId" class="btn btn-primary" id="Submit" @*onclick="location.href='@Url.Action("AddRequestForApproval","Reimbursements")'"*@>Submit</button>
                                    <button class="btn btn-default" data-dismiss="modal" type="reset" id="Clear">Close</button>
                                </div>
                            </div>
                        </div>
                    </div>

                </td>
            </tr>
        }
    </table>
    @section Scripts {
        <script src="~/Scripts/jquery-3.3.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#table1").on('click', '#SelectBtn', function () {
                    $('#Submit').click('#enumId', function () {
                        var bid = $(this).attr('data-id');
                        var status = $("#enumId option:selected").val();
                        var mess = $('#message-text').val();
                        var Rmid;
                        console.log(bid, status, mess);
                       // var b = $("#NewId");
                        @*if ($("#NewId").val() == undefined) {
                            Rmid = 0;
                        } else {
                            Rmid = $("#NewId").val();
                        } 
            $.ajax({
                type: 'POST',
                dataType: 'html',
                url: '@Url.Action("saveStatus")',
                data: { id: bid, status: status, Remark: mess },
                 success: function (data) {
                     console.log(data);
                     status.val('').url(data);
                     mess.val('');

                }, error: function (data) {
                      alert("error");
                        },
            })*@
                  })
                })
            })

        </script>
    }

Answer 1

Instead of putting data-id there, you can just put it as value of a hidden filed in your form so that it gets posted when the form submitted:

<input type = "hidden" name="id" value="@item.ReimbursementId" />

If the value may change that you want to send different values when different buttons are clicked, then you can have a hidden input and set its value before submit:

$('#Submit').click('#enumId', function () {
    var bid = $(this).data('id');
    $('[name="id"]').val(bid);
    // rest of your code....
});

Edit : if you are going to post it with ajax, please note that you should get data like:

$(this).data('id');