根据 CSHTML 中先前查询的结果更新查询结果

Question

我有一个 .NET Core 项目的视图页面，它描述了从其索引控制器生成的两个 ViewBag（ViewBag.Projects 和 ViewBag.VProjectTasks）结果集。这两个 Select 下拉菜单来自包含其他输入和文本区域字段的顶级表单。它们都是为特定项目收集信息的视图页面的一部分。

在我的数据库中，我有两个 Table。一个包含带有 ID 的项目名称列表，例如：ID、Project。第二个 Table 包含任务列表及其项目 ID，例如：ID、项目 ID、任务。

目前，我正在从索引控制器创建两个 ViewBag，我在页面上显示所有项目和所有任务，这变得越来越混乱，因为我已经到了不记得哪个任务属于哪个的地步项目。我想通过使用一个查询的结果实时或动态地显示下一个查询的数据来解决这个问题。

第一个 ViewBag 包含来自项目 Table 的项目字段。一旦客户或用户从项目 Select 下拉列表中选择了一个特定项目，那么，我想使用该结果中的 ID 为 ViewBag.VProjectTasks 生成数据集，从而仅显示任务那个特定的项目，动态地。

<form method="POST" asp-controller=TimeTracker asp-action="Create" accept-charset="UTF-8">
    <div class="form-group ">
        <input class="form-control" asp-for=Date type="text">
        <input class="form-control" asp-for="GrandTotal" type="hidden">
    </div>
...
<div class="row">
    <div class="col-sm-12">
        <div class="form-group service-line-field ">
            <label for="Project" class="control-label">Project List</label>
            <select class="form-control" asp-for=Project>
                @foreach(var prj in ViewBag.Projects)
                {                                
                    <option value="@prj.Project">@prj.Project</option>
                }
                </select>
            <span class="form-group-highlight"></span>
            <span class="form-group-bar"></span>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-sm-12">
        <div class="form-group activity-field ">
            <label for="Task" class="control-label">Task</label>
            <select class="form-control" asp-for="Task">
            @foreach(var prj in ViewBag.VProjectTasks)
            {                                
                <option value="@prj.Task">@prj.Task</option>
            }
            </select>
            <span class="form-group-highlight"></span>
            <span class="form-group-bar"></span>
        </div>
    </div>
</div>
...
<br>
<div class="row text-right">
    <div class="col-sm-12">
        <div class="btn-group dropup dropdown-toggle-wrapper">
            <button class="btn btn-m btn-primary" type="submit">Save</button>
        </div>
    </div>
</div>
</form>

这可能吗？我试图防止数据库凭据在视图中公开，同时为该 Vew 页面保持稳定的动态数据流。

请指教

Answer 1

我建议您使用 ajax 来检索所有任务然后为 select 添加 id 并删除第二个 select 选项，例如

<select id="project" class="form-control" asp-for=Project>
                @foreach(var prj in ViewBag.Projects)
                {                                
                    <option value="@prj.Project">@prj.Project</option>
                }
                </select>
 <select id="task" class="form-control" asp-for="Task">
           
            </select>

然后为产品添加 onchange 以使用 ajax 按项目 ID 值检索任务像这样

$("#Project").on("change", function() {
           
                function ("/api/ProjectTasks/"+parseInt($("#Project").val()), {}, "json", success) {
        $.ajax({
            url: url,
            data: paramters,
            contentType: "application/json; charset=utf-8",
            dataType: returnFormat,
            success: function (data) {
                success(data);
                let htmlData = "<option value='' selected disabled hidden>select task...</option>";
                            
                            for (let i = 0; i < Object.values(data)[1].length; i++) {
                                htmlData = htmlData + Template(Object.values(data)[1][i]);
                                }
                            $("#task").html(htmlData);
            },
            type: 'GET',
        });
    }
             function Template(item) {
                        let itemHtml = "<option value='" + item.id + "'>" + item.taskname + "</option>";
                        return itemHtml;
                    }

根据 CSHTML 中先前查询的结果更新查询结果

Updating Query results from the result of a previous query in CSHTML

.net

linq

database

sql-server