如何在选中无数据库数据的语言时显示指定提示消息

开发者阿泽

2026-7-5

问题描述

我有一个可正常工作的语言下拉选择列表，目前的问题是：当选中的语言在数据库中没有对应信息时，如何显示“没有工作人员会说该语言”的提示？我曾尝试在if语句中使用Console.WriteLine输出该消息，但选中无数据的语言时消息并未显示，不确定是代码位置错误还是该方法本身不适用，恳请提供解决方案。

现有代码

视图(View)

@model IEnumerable<Language>

@{ 
    ViewData["Title"] = "FLIP";
}

<html>
<head>
    <title>@ViewData["Title"]</title>
</head>
<body>
    <form id="languageForm" method="post" action="/Home/Results">
        <select name="LanguageList" id="LanguageList">
            <option Value=""> 1) Select a Language . . .</option>
            <option value="American Sign English (ASE)">American Sign English (ASE)</option>
            <option value="American Sign Language (ASL)">American Sign Language (ASL)</option>
            <option value="Arabic: Algerian">Arabic: Algerian</option>
            <option value="Arabic: Egyptian">Arabic: Egyptian</option>
            <option value="Awadhi">Awadhi</option>
            <option value="Azerbaijani">Azerbaijani</option>
            <option value="Bengali">Bengali</option>
            <option value="Bhojpuri">Bhojpuri</option>
            <option value="Chinese: Cantonese">Chinese: Cantonese</option>
            <option value="Chinese: Fukein">Chinese: Fukein</option>
            <option value="Chinese: Jinyu">Chinese: Jinyu</option>
            <option value="Chinese: Mandarin">Chinese: Mandarin</option>
            <option value="Chinese: Min Nan">Chinese: Min Nan</option>
            <option value="Chinese: Wu">Chinese: Wu</option>
            <option value="Creole">Creole</option>
            <option value="Creole-Jamaican">Creole-Jamaican</option>
            <option value="Czech">Czech</option>
            <option value="Dutch">Dutch</option>
            <option value="Esperanza">Esperanza</option>
            <option value="Estonian">Estonian</option>
            <option value="Farsi">Farsi</option>
            <option value="French">French</option>
            <option value="Gaelic">Gaelic</option>
            <option value="German">German</option>
            <option value="Greek">Greek</option>
            <option value="Hausa">Hausa</option>
            <option value="Hebrew">Hebrew</option>
            <option value="Hindi">Hindi</option>
            <option value="Hmong">Hmong</option>
            <option value="Hungarian">Hungarian</option>
            <option value="Icelandic">Icelandic</option>
            <option value="Italian">Italian</option>
            <option value="Japanese">Japanese</option>
            <option value="Kannada">Kannada</option>
            <option value="Korean">Korean</option>
            <option value="Lao">Lao</option>
            <option value="Latin">Latin</option>
            <option value="Maithili">Maithili</option>
            <option value="Marathi">Marathi</option>
            <option value="Malayalam">Malayalam</option>
            <option value="Native American: Blackfoot">Native American: Blackfoot</option>
            <option value="Native American: Cheyenne">Native American: Cheyenne</option>
            <option value="Native American: Chippewa">Native American: Chippewa</option>
            <option value="Native American: Cree">Native American: Cree</option>
            <option value="Native American: Dakota">Native American: Dakota</option>
            <option value="Native American: Lakota">Native American: Lakota</option>
            <option value="Native American: Lenape">Native American: Lenape</option>
            <option value="Native American: Navajo">Native American: Navajo</option>
            <option value="Native American: Ojibwi">Native American: Ojibwii</option>
            <option value="Native American: Oneida">Native American: Oneida</option>
            <option value="Native American: Onodaga">Native American: Onodaga</option>
            <option value="Native American: Paivte">Native American: Paivte</option>
            <option value="Native American: Shoshoni">Native American: Shoshoni</option>
            <option value="Native American: Sioux">Native American: Sioux</option>
            <option value="Niger-Congo: Akan">Niger-Congo: Akan</option>
            <option value="Niger-Congo: Twi">Niger-Congo: Twi</option>
            <option value="Norwegian">Norwegian</option>
            <option value="Oriya">Oriya</option>
            <option value="Panjabi">Panjabi</option>
            <option value="Patois">Patois</option>
            <option value="Polish">Polish</option>
            <option value="Portuguese">Portuguese</option>
            <option value="Romanian">Romanian</option>
            <option value="Russian">Russian</option>
            <option value="Serbian">Serbian</option>
            <option value="Serbo-croatian">Serbo-croatian</option>
            <option value="Sign Language">Sign Language</option>
            <option value="Sindhi">Sindhi</option>
            <option value="Slovaic(Slovak)">Slovaic(Slovak</option>
            <option value="Spanish">Spanish</option>
            <option value="Sunda">Sunda</option>
            <option value="Swedish">Swedish</option>
            <option value="Tagalog">Tagalog</option>
            <option value="Tamil">Tamil</option>
            <option value="Telugu">Telugu</option>
            <option value="Thai">Thai</option>
            <option value="Turkish">Turkish</option>
            <option value="Ukrainian">Ukrainian</option>
            <option value="Urdu">Urdu</option>
            <option value="Vietnamese">Vietnamese</option>
        </select>
        <button type="submit" id="searchButton">Search</button>
        
    </form>

    @if (Model != null && Model.Any())
    {
        <br />
        <h6>Click a OfficerName in the grid below to list detail information on how to contact the officer.</h6>
        <h6>Click a Column Heading to sort the grid</h6>
        <table class="table table-bordered table-striped" style="width:100%;
        background-color: lightgray; border:1px solid black; border-color:black ">
            <thead>
                <tr>
                    <th style="color:blue">Name</th>
                    <th style="color:blue">Fluency</th>
                     

                </tr>
            </thead>

            @foreach (var lang in Model)
            {
                <tr>
                    <td>@lang.LanguageName</td>
                    <td>@lang.Fluency</td>
                </tr>
            }
        </table>
    }   
    
    <script src=https://code.jquery.com/jquery-3.6.0.min.js></script>
    <script>
        $('#selectedLanguage').change(function () {
            $('#languageForm').button();
        });
    </script>
</body>
</html>

控制器(Controller)

public IActionResult Test()
{
    List<string> lang = _Db.Languages.Select(s => s.LanguageName).Distinct().ToList();
    ViewBag.Languages = lang;
    return View();
}

[HttpPost]
public IActionResult Results(string LanguageList)
{
    List<Language> Languages;

    if (string.IsNullOrEmpty(LanguageList))
    {
        Languages = null;
    }
    else
    {
        IQueryable<Language> query = _Db.Languages;

        if (!string.IsNullOrEmpty(LanguageList))
        {
            query = query.Where(s => s.LanguageName == LanguageList);
        }
        Languages = query.ToList();
    }
    ViewBag.SelectedLanguage = Languages;
    ViewBag.Languages = _Db.Languages.Select(s => s.LanguageName).Distinct().ToList();
    return View("Test", Languages);
}

解决方案

首先明确：Console.WriteLine是输出到服务器控制台的，前端页面无法看到，所以这个方法不适用，必须在视图中直接渲染提示文本。

步骤1：修改控制器传递选中语言名称

在Results方法中新增一行代码，把用户选中的语言名称传到ViewBag，用于视图判断是否是主动选择的有效语言：

[HttpPost]
public IActionResult Results(string LanguageList)
{
    List<Language> Languages;

    if (string.IsNullOrEmpty(LanguageList))
    {
        Languages = null;
    }
    else
    {
        IQueryable<Language> query = _Db.Languages;

        if (!string.IsNullOrEmpty(LanguageList))
        {
            query = query.Where(s => s.LanguageName == LanguageList);
        }
        Languages = query.ToList();
    }
    ViewBag.SelectedLanguage = Languages;
    ViewBag.SelectedLanguageName = LanguageList; // 新增：传递选中的语言名称
    ViewBag.Languages = _Db.Languages.Select(s => s.LanguageName).Distinct().ToList();
    return View("Test", Languages);
}

步骤2：修改视图添加无数据提示

在现有表格判断的下方添加else分支，处理无数据的情况：

@if (Model != null && Model.Any())
{
    <!-- 原有表格代码保持不变 -->
}
<!-- 添加以下else分支 -->
else if (!string.IsNullOrEmpty(ViewBag.SelectedLanguageName))
{
    <br />
    <p style="color: red; font-weight: bold;">没有工作人员会说该语言</p>
}

额外优化：修复无效JS代码

视图中原有JS的选择器$('#selectedLanguage')找不到对应元素，因为下拉框ID是LanguageList，如果不需要自动提交功能，直接删除这段JS即可；如果需要选择后自动提交，修改为：

$('#LanguageList').change(function () {
    $('#languageForm').submit();
});

这样，当用户选中某个语言且数据库无对应数据时，页面会显示红色加粗的提示文本；若用户未选择语言（默认空选项），则不会显示提示，符合业务逻辑。

内容的提问来源于stack exchange，提问作者cg1323

如何在选中无数据库数据的语言时显示指定提示消息

视图(View) #

控制器(Controller) #

步骤1：修改控制器传递选中语言名称 #

步骤2：修改视图添加无数据提示 #

额外优化：修复无效JS代码 #

视图(View)

控制器(Controller)

步骤1：修改控制器传递选中语言名称

步骤2：修改视图添加无数据提示

额外优化：修复无效JS代码