Question

我在ASP.NET Core MVC网站上创建了一个注册表单，我要求用户提供邮政编码以及其他用户信息。

如果只有一个县与该邮政编码相关联，我不想显示选择县的下拉菜单，否则如果有多个县，我想显示用户选择县的下拉菜单。 / p>

public class RegisterUser
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string BirthDate { get; set; }
    public string EmailAddress { get; set; }
    public string ZipCode { get; set; }
    public string County { get; set; }
}

观点：

<form asp-action="Register" method="post" asp-controller="User" asp-antiforgery="true">
    <div asp-validation-summary="ModelOnly" class="text-danger"></div>
    <div class="form-group">
        <label asp-for="FirstName" class="control-label col-sm-3"></label>
        <div class="col-md-9">
            <input asp-for="FirstName" class="form-control text-box single-line input-validation-error" />
            <span class="text-danger field-validation-error" asp-validation-for="FirstName"></span>
        </div>
    </div>
    <div class="form-group">
        <label asp-for="LastName" class="control-label col-sm-3"></label>
        <div class="col-md-9">
            <input asp-for="LastName" class="form-control text-box single-line input-validation-error" />
            <span class="text-danger field-validation-error" asp-validation-for="LastName"></span>
        </div>
    </div>
    <div class="form-group">
        <label asp-for="BirthDate" class="control-label col-sm-3"></label>
        <div class="col-md-9">
            <input asp-for="BirthDate" class="form-control text-box single-line input-validation-error" />
            <span class="text-danger field-validation-error" asp-validation-for="BirthDate"></span>
        </div>
    </div>
    <div class="form-group">
        <label asp-for="EmailAddress" class="control-label col-sm-3"></label>
        <div class="col-md-9">
            <input asp-for="EmailAddress" class="form-control text-box single-line input-validation-error" />
            <span class="text-danger field-validation-error" asp-validation-for="EmailAddress"></span>
        </div>
    </div>
    <div class="form-group">
        <label asp-for="ZipCode" class="control-label col-sm-3"></label>
        <div class="col-md-9">
            <input asp-for="ZipCode" class="form-control text-box single-line input-validation-error" />
            <span class="text-danger field-validation-error" asp-validation-for="ZipCode"></span>
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-12 button-holder">
            <input type="submit" value="Continue" class="button-green btn btn-default pull-right" />
        </div>
    </div>
</form>

在这种情况下该怎么办？我还没有添加我的下拉逻辑。

Answer 1

您只需要一些JavaScript和潜在的AJAX。基本上，您绑定到邮政编码输入的输入/模糊事件。然后，您的代理将隐藏下拉列表或根据某种逻辑显示下拉列表。

要确定哪些国家/地区“属于”特定邮政编码，您需要一个端点（ASP.NET核心操作），该端点可以接受邮政编码作为参数，然后使用该端点查找相关联的国家/地区。然后，您将该国家/地区列表作为JSON返回。

当然，您需要通过AJAX请求此端点，传递邮政编码。然后，您的“成功”委托将获取返回的JSON并使用它来构建您的下拉选项，然后显示下拉列表，假设有多个项目。如果只有一个项目，您可以不执行任何操作，也可以隐藏下拉列表（如果它当前正在显示）。

您可能会考虑使用像Knockout.js，Vue.js等库，因为它需要大量的手动工作。无论做多少，做一些研究，尝试，如果你有其他问题或遇到问题，你可以回来问另一个问题。

根据文本框值隐藏或显示下拉列表

1 个答案: