Question

在我的MVC 3项目中，我使用相当奇怪的代码来选择表中的行并执行一些更新。我的问题是我不确定如何验证是否已选择该行。

以下是我视图中的代码：

<p><i>Select an invoice from the grid below:</i></p>

@if (!string.IsNullOrEmpty(TempData["PaymentError"] as string))
{
<div id="error" style="margin: 0 auto; width: 400px;">
    <p style="width: 400px;"><img src="../../Content/images/errorsm.png" style="vertical-align: middle; padding: 5px;"/><span style="color: #A62000;font-weight: bold;">@(TempData["PaymentError"] as string)</span></p>
</div>
}

<table id="database">
<tr>
<th></th>
    <th>
        Invoice Number
    </th>
    <th>
        Invoice Amount
    </th>
    <th>
        Invoice Month
    </th>
    <th>
        Invoice Status
    </th>
    <th>
        Client
    </th>
    <th></th>
</tr>
@using (Html.BeginForm("Confirm", "Invoice"))
{

foreach (var item in Model)
{
    string selectedRow = "";
    if (item.InvoiceNumberID == ViewBag.InvoiceNumberID)
    {
        selectedRow = "selectedRow";
    } 

<tr class="@selectedRow" valign="top">
            <td> 
           <a href='javascript:void(0)' class='select' data-id=@item.InvoiceNumberID >Select</a>


        </td> 
     <td>
        @Html.DisplayFor(modelItem => item.InvoiceNumberID)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.InvoiceAmount)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.InvoiceMonth)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.InvoiceStatus)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Client.FullName)
    </td>
    <td>
        @Html.ActionLink("Edit", "Edit", new { id = item.InvoiceNumberID }) |
        @Html.ActionLink("Details", "Details", new { id = item.InvoiceNumberID }) |
        @Html.ActionLink("Delete", "Delete", new { id = item.InvoiceNumberID })
    </td>

</tr>

}
<input type='hidden' id='id' name='id' value='0' />

<p>
<a href='@Url.Action("CreateBulkInvoices", "Invoice")'>Generate Invoices</a>
</p>
<table>
<br />
<i>Select an amount below to confirm as paid:</i><br /><br />
<tr><td><b>Monthly Amounts:</b></td><td><b>Weekly Amounts:</b></td></tr>
<tr><td>Private Lesson (1 Hour) @Html.RadioButton("InvoiceAmount", "640", true) R640.00<br /></td><td>Private Lesson (1 Hour) @Html.RadioButton("InvoiceAmount", "140", true) R160.00<br />    </td></tr>
<tr><td>Private Lesson (1/2 Hour) @Html.RadioButton("InvoiceAmount", "350", true) R350.00<br /></td><td>Private Lesson (1 Hour) @Html.RadioButton("InvoiceAmount", "87.50", true) R87.50<br /></td></tr>
<tr><td>Group Lesson (1 Hour) @Html.RadioButton("InvoiceAmount", "460", true) R460.00</td>  <td>Private Lesson (1 Hour) @Html.RadioButton("InvoiceAmount", "115", true) R115.00<br /></td></tr>
<tr><td>Custom Amount @Html.RadioButton("InvoiceAmount", "115", true)    @Html.TextBox("InvoiceCustomAmount")<br /></td></tr>
</table> 
<br />
<p><i>Select a payment type:</i>
</p> 
<p>@Html.RadioButton("PaymentType", "EFT", true) EFT<br />
@Html.RadioButton("PaymentType", "Credit Card", true) Credit Card<br />
@Html.RadioButton("PaymentType", "Cheque", true) Cheque


</p>                                                         
<p><input type="submit" value="Confirm" /></p>       
}
</table>
<br />



<script type='text/javascript'>
    $('.select').click(function(){
        $('#id').val($(this).attr('data-id'));
        $(this).closest('table').find('tr').removeClass('selectedRow');
        $(this).closest('tr').addClass('selectedRow');
             });
</script>

我控制器中的代码是：

public ActionResult Confirm(int id, long InvoiceAmount, string PaymentType, float? InvoiceCustomAmount)
    {
        var invoice = db.Invoice.Find(id);

        //now validate that if the logged in user is authorized to select and confirm this invoice or not.
        var clientPayment = new ClientPayments();

        clientPayment.InvoiceNumberID = id;

        if (InvoiceAmount == 115)
        {
            InvoiceAmount = (long)InvoiceCustomAmount;
        }

        var TotalPayments = invoice.ClientPayments.Sum(payment => payment.PaymentAmount) + InvoiceAmount;

        if (TotalPayments > invoice.InvoiceAmount)
        {
            TempData["PaymentError"] = "You cannot pay more than the invoice amount";
            return RedirectToAction("Index");
        }


        clientPayment.PaymentAmount = InvoiceAmount;

        clientPayment.PaymentType = PaymentType;
        clientPayment.PaymentDate = DateTime.Now;
        db.ClientPayments.Add(clientPayment);

        if (TotalPayments != invoice.InvoiceAmount)
        {
            invoice.InvoiceStatus = "Partly Paid";
        }
        else
        {
            invoice.InvoiceStatus = "Confirmed";
        }

        // You don´t need this, since "invoice" was retrieved earlier in the method the database context
        // knows that changes have been made to this object when you call "SaveChanges".
        // db.Entry(invoices).State = EntityState.Modified;

        db.SaveChanges();

        return View();
    }

是否有一种简单的方法可以验证在提交表单时是否已选择行？

谢谢，艾米

Answer 1

那么，除非您确实选择了某些内容，否则不启用提交按钮呢？您最初可以将提交按钮设置为禁用。像这样：

<input type="submit" value="Confirm" class="mysubmit" />

$(document).ready(function () {
   $('.mysubmit').attr('disabled', 'disabled');

   // whatever else...
});

可以通过删除该属性来重新启用：

$('.mysubmit').removeAttr('disabled');

您认为可以修改click来执行此操作：

<script type='text/javascript'>
    $('.select').click(function(){
        $('#id').val($(this).attr('data-id'));
        $(this).closest('table').find('tr').removeClass('selectedRow');
        $(this).closest('tr').addClass('selectedRow');
        // enable your submit button
        $('.mysubmit').removeAttr('disabled');
    });
</script>

没有测试它，但似乎确保用户在点击提交按钮之前点击select类链接。

验证行是否被选中MVC 3

1 个答案: