Question

我有一个要隐藏的表，没有要显示的数据。

我有一个控制器操作，该操作返回数据以显示该表。如果返回数据，我希望显示该表，否则我希望将其隐藏。我已经尝试了几种方法来解决这个问题，并且看来我的修复程序正在起作用（持续了几秒钟），但是一旦控制器返回模型，该表就会再次被隐藏。我做错了。我怎样才能解决这个问题？下面是我的代码：

HTML：

         @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "submitForm"}))
     {
            <div class="row">
                <div>
                    @Html.DropDownList("CasinoID", Model.TerminalReceiptPostData.CasinoIdDDL, "Select Casino", new { id = "cIdSearch", @class = "custom-class-for-dropdown card" })
                </div>
                &nbsp;
                <div>
                    <input id="datepicker" class="datepicker-base card" name="Date" placeholder="MM/DD/YYY" type="text"/>
                </div>
                &nbsp;
                <div>
                    <button type="submit" class="btn btn-sm btn-primary" id="search"> Search Transactions</button>
                </div>
            </div>
     }

     <hr />
        <div class="row" id="ReceiptsMainDiv">
            <div class="col-md-12" style="overflow-y:scroll">
                <table class="table table-striped table-hover table-bordered" id="terminalReceipts">
                    <thead>
                        <tr>
                            <th>Terminal ID</th>
                            <th>Local Transaction Time</th>
                            <th>Amount</th>
                            <th>Receipt</th>
                            <td class="hidden"></td>
                        </tr>
                    </thead>
                    <tbody>

                        @foreach (var item in Model.TransactionsTests)
                        {
                            <tr id="@String.Concat("rowIndex", Model.TransactionsTests.IndexOf(item))">
                                <td>@item.TerminalID</td>
                                <td>@item.TransactionTime</td>
                                <td>@item.Amount</td>
                                @*<td>@Html.ActionLink("View Receipt", "ViewReceipt", new { id = item.Id }, new { @class = "btn btn-primary btn-sm" }) <br /></td>*@
                                <td class="transactionID hidden">@item.Id</td>
                                <td>
                                    @if (item.ReceiptData == null)
                                    {
                                        <button class="btn btn-sm btn-primary viewReceipt" disabled>View Receipt</button>
                                    }
                                    else
                                    {
                                        <button class="btn btn-sm btn-primary viewReceipt" data-rowindex="@String.Concat("rowIndex", Model.TransactionsTests.IndexOf(item))">View Receipt</button>
                                    }
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
    </div>

控制器动作：

      [HttpPost]
    public ActionResult Index(string CasinoID, DateTime Date)
    {

        //var id = Int32.Parse(Request.Form["CasinoID"].ToString());

        var Cid = Request.Form["CasinoID"];
        Cid = GetNumbers(Cid);

        var id = Int32.Parse(Cid);

        var model = TRBL.GetTransactionTestsData(id, Date);
        model.TerminalReceiptPostData = TRBL.GetCasinosDDL();
        return View(model);
    }

最后是我的JS函数：

    window.onload = function () {


    $("#ReceiptsMainDiv").toggle();

    var rowCount = $("#rowindex").length;

    console.log(rowCount);

    if (rowCount > 0) {
        $("#ReceiptsMainDiv").toggle();
     }

};

如您所见，顶部的窗体包含按钮，下面的块是需要切换的表。

让我知道你们是否还有其他需求。

Answer 1

当要显示结果时，<tr id="@String.Concat("rowIndex", Model.TransactionsTests.IndexOf(item))">不会产生“ rowIndex”的ID（与您期望的不同）。相反，您将拥有“ rowIndex0”，“ rowIndex1”等。因此，rowCount之后为零，并且您将不会切换。

根据返回的数据隐藏和取消隐藏表div

1 个答案: