如何通过仅搜索.net core razor 在表中显示数据，我在表上有此数据视图，我希望仅在搜索时显示行答案

【问题标题】：how display data in table by search only .net core razor , i have this data view on table i want appear row when searching only如何通过仅搜索.net core razor 在表中显示数据，我在表上有此数据视图，我希望仅在搜索时显示行
【发布时间】：2022-11-14 12:03:26
【问题描述】：

'如何通过仅搜索.net core razor 在表格中显示数据，我在表格上有此数据视图，我希望仅在搜索时显示行`

<tbody id="tblBody" >
@{
    foreach (var item in Model.Patients)
    {
            <tr id="row_@item.Id">

                <td id="patientName_@item.Id" class="table-cell-arabic">@item.PatientName</td>
                <td id="phone_@item.Id">@item.Phone</td>
                <td id="Diseases_@item.Id">@item.Diseases</td>
                <td>
                    <button class="btn btn-danger btn-xs sm-btn-table" type="button" onclick="OnDelete(@item.Id)">Delete</button>
                    <button class="btn btn-success btn-xs sm-btn-table" type="button" onclick="OnEdit(@item.Id)">Edit</button>
                    <button class="btn btn-success btn-xs sm-btn-table" type="button" onclick="OnDetails(@item.Id)">Details</button>

                </td>
            </tr>
        
    }
}

</tbody>

【问题讨论】：

你可以做一个if语句。 @if(Model.SearchComplete) 或 Model.Patients.Any()。然后在 else 中会出现类似的结果：未找到患者或请先搜索患者。

标签： asp.net asp.net-core

【解决方案1】：

您是否想通过这样的搜索按钮加载数据（以 Id 为例）：

索引.cshtml.cs：

public void OnGet()
{
}

public JsonResult OnGetTest(int Id)
{
     if (Id == 0)
     {
          var patient = (from m in _context.Patient select m).ToList();
          return new JsonResult(patient);
     }
     else
     {
          var patient = (from m in _context.Patient select m).Where(c => c.Id == Id).ToList();
          return new JsonResult(patient);
     }
}

索引.cshtml：

<div>
    <input id="Search" />
    <button class="btn-primary" onclick="Test()">Search</button>
</div>
<div>
    <table class="table">
        <thread>
            <tr>
                <td>PatientName</td>
                <td>Phone</td>
                <td>Diseases</td>
            </tr>
        </thread>
        <tbody id="tbody">
        </tbody>
    </table>
</div>

<script>
    function Test() {
        $.ajax({
            url: '?handler=Test&id=' + $("#Search").val(),
            success: function (result) {
                var html = "";
                for (var i = 0; i < result.length; i++) {
                    html += "<tr><td id='patientName_'" + result[i].id + ">" + result[i].patientName + "</td>"
                        + "<td id='phone_'" + result[i].id + ">" + result[i].phone + "</td>"
                        + "<td id='Diseases_'" + result[i].id + ">" + result[i].diseases + "</td></tr>"
                }
                $("#tbody").html(html);
            },
            error: function (error) {
                console.log(error);
            }
        });
    }
</script>

结果：

搜索前：搜索后：

如果你使用 MVC：

控制器：

public IActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public IActionResult Index(int Id)
        {
            if (Id == 0)
            {
                var patient = (from m in _context.Patient select m).ToList();
                return Json(patient);
            }
            else 
            {
                var patient = (from m in _context.Patient select m).Where(c => c.Id == Id).ToList();
                return Json(patient);
            }
            
        }

看法：

<div>
    <input id="Search"/>
    <button class="btn-primary" onclick="Test()">Search</button>
</div>
<div>
    <table class="table">
        <thread>
            <tr>
                <td>PatientName</td>
                <td>Phone</td>
                <td>Diseases</td>
            </tr>
        </thread>
        <tbody id="tbody">

        </tbody>
    </table>
</div>

<script>
    function Test()
    {
        $.ajax({
            type: 'POST',
            url: "/Home/Index",
            data: { id: $("#Search").val()},
            success: function (response) {
                var html = "";
                for(var i=0;i<response.length;i++)
                {
                    html += "<tr><td id='patientName_'" + response[i].id + ">" + response[i].patientName + "</td>"
                        + "<td id='phone_'" + response[i].id + ">" + response[i].phone + "</td>"
                        + "<td id='Diseases_'" + response[i].id + ">" + response[i].diseases + "</td></tr>"
                }
                $("#tbody").html(html);
            },
            error: function(error){
                console.log(error);
            }
        });
    }
</script>

这是你想要的吗？

【讨论】：