如何實作搜索功能

我在導航中創建搜索欄我想在導航欄中搜索成員，并且我在主頁上創建了引導卡

這是我的會員模型

public class Member
    {
        [Key]
        public int MemberId { get; set; }
        [StringLength(60, MinimumLength = 3)]

        public string? Name { get; set; }

        public string? Gender { get; set; }
        public DateTime DOB { get; set; }

        public string? MaritalStatus { get; set; }

        public string? Address { get; set; }

        public long PhoneNo { get; set; }

        public string? Skills { get; set; }
        public string? Hobbies { get; set; }

        public string? JobTitle { get; set; }

        public string? Technology { get; set; }
        

        public string? ImageName { get; set; }
        public string? ImageLocation { get; set; }

        public Team? Team { get; set; }
        public ICollection<TeamMember>? TeamMembers { get; set; }
        public ICollection<ProjectMember>? ProjectMembers { get; set; }
    }

這是我對搜索欄的看法

<form class="d-none d-md-inline-block form-inline ms-auto me-0 me-md-3 my-2 my-md-0">
                            <div class="input-group">
                                <input class="form-control" type="text" placeholder="Search for..." aria-label="Search" aria-describedby="btnNavbarSearch" />
                                <button class="btn btn-primary" id="btnNavbarSearch" type="button">Search</button>
                            </div>
                        </form>

uj5u.com熱心網友回復：

我在導航中創建搜索欄我想在導航欄中搜索成員，并且我在主頁上創建了引導卡

盡管您給定的代碼不足以為您的背景關系提供完整的示例，但您可以ViewData按照以下步驟大致使用功能實作搜索選項。

這個怎么運作

默認情況下，我們將加載索引頁面上的所有成員。因為一開始search key會是空的。所以我們為此設定了條件。加載所有成員串列后，我們現在可以search。當我們輸入任何search key 內容時，它將使用該值將值提交給控制器ViewData["CurrentFilter"]，最后將通過該值搜索資料庫search key并回傳視圖。

控制器

public IActionResult Index( string searchString)
        {
            ViewData["CurrentFilter"] = searchString;

            var members = from mem in _context.Members
                           select mem;
            if (!String.IsNullOrEmpty(searchString))
            {
                members = members.Where(m => m.Name.Contains(searchString)
                                       || m.Gender.Contains(searchString));
                return View(members);
            }
           
            var memberList = _context.Members.ToList();
            return View(memberList);
            
        }

注意：目前，我們已經實作了搜索Member Name，您也可以通過簡單地添加Like 這種方式Gender擴展到其他屬性 ：|| or

members = members.Where(m => m.Name.Contains(searchString)
          || m.Gender.Contains(searchString || any Other Fields));

看法

@model IEnumerable<DotNet6MVCWebApp.Models.Member>

@{
    ViewData["Title"] = "Index";
}
<div class="form-row">
    <table>
        <tr>
            <td>
                <a asp-action="CreateMemberView" class="btn btn-success">Create New</a>
                
            </td>
        </tr>
    </table>
</div>


<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Gender)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DOB)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ImageName)
            </th>
            <th>
                Member Details
            </th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Gender)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DOB)
                </td>
                <td>
                    <img src="~/ImageName/Cover/@item.ImageName"
                     class="rounded-square"
                     height="50" width="75"
                     style="border:1px"
                     asp-append-version="true" accept="image/*" />
                </td>
                <td>
                    <a asp-action="Details" class="btn btn-primary" asp-route-memberId="@item.MemberId">Details</a> |  <a asp-action="EditMember" class="btn btn-warning" asp-route-memberId="@item.MemberId">Edit</a>
                </td>
            </tr>
        }
    </tbody>
</table>

導航欄

<li class="nav-item">
  <div class="form-row">
        <table>
            <tr>                                       
                <form method="get" action="/YourController/Index">

                              <td style="padding-right:940px">
                                 </td>
                                    <td>
                                        <input class="form-control" type="text" placeholder="Search for..." name="SearchString" value="@ViewData["CurrentFilter"]" aria-label="Search" aria-describedby="btnNavbarSearch" />
                                    </td>
                                    <td>
                                        <input type="submit" value="Search" class="btn btn-primary" />
                                 </td>
                          </form>
                    </tr>
            </table>
     </div>

輸出

如果您在這方面需要任何進一步的幫助，請在此處查看我們的官方檔案。

標籤：网 asp.net-mvc asp.net 核心 asp.net-core-mvc

上一篇：剛剛發現的可視化動態圖庫ipyvizzu，太好看了

下一篇：實體化資料庫背景關系時發生錯誤