Question

我有两个级联的下拉列表，我想根据我的knockout.js绑定。基本上我想要实现的是两个下拉列表，它从公司的每个分支的数据库填充，并根据在另一个下拉列表中选择的分支填充各个部门。我在转换为列表然后绑定到下拉列表时遇到问题。

function CompanyViewModel() {

    var self = this;

    self.DepartmentName = ko.observable(" ")
    self.Department =ko.observableArray([]);
    self.DepartmentName = ko.Observable([]);
    self.Branch =ko.observableArray([]);
    self.BranchName = ko.Observable([])
}
CompanyViewModel = new CompanyViewModel();
ko.applyBindings(CompanyViewModel);


function  populateCompanyBranches() {

    $.ajax({
        type: "GET",
        $.when(getSecureData("/api/Branches/" ))
        .done(function (Branches) {
            Branch.unshift({ "BranchID": 0, "department name": "Please select a Branch." });
            CompanyViewModel.Branch(Branch);
        })
        .fail(function (message) {
            $.msgbox(message);
        });
};



function populateBranchDepartments() {
    $("#Branches").change(function () {
                var BranchID = $("#Branches").val();                           
                $.ajax({
                    type: "GET",
          $.when(getSecureData("/api/Departments/GetDepartment" + BranchID))
        .done(function (Department) {
        CompanyDepartment.unshift({ "CompanyID": 0, "departmentName": "Please select a department" });
            CompanyViewModel.Department(Department);
        })
        .fail(function (message) {
            $.msgbox(message);
            });
        };
}

查看

Branch Name: <select data-bind="options:  CompanyViewModel. CompanyViewModel, optionsCaption: 'Select a Branch',
    optionsValue: function (item) { return item.BranchId; },
    optionsText: function (item) { return item.BranchName; }, value: Branch,
    valueUpdate: 'change'" id="Branches" name="Branch"></select>
<br />

Deaprtment Name: <select data-bind="options: CompanyViewModel.Department, optionsCaption: 'Choose Department...',
    optionsValue: function (item) { return item.DepartmentId; },
    optionsText: function (item) { return item.DepartmentName; },  value: DepartmentName,
    valueUpdate: 'change'" id="Department" name="Department"></select>
<br />   
  </div>

public class CompanyDTO
{
    public int BranchId { get; set; }
    public string BranchName { get; set;}  
    public int DepartmentId { get; set; }
    public string DepartmentName { get; set;}  
}

public static class CompanyBranchList
{
    public static CompanyDTO DepartmentToBranchDTO(listing e)
    {
        return new CompanyDTO 
        {
            BranchId = e.BranchId,
            BranchName = e.BranchName
            DepartmentId = e.DepartmentId
            DepartmentName = e.DepartmentName

        };
    }


    public static List<CompanyDTO> ListBranchToDepartmentDTO(List<listing> e)       
    {
        List<CompanyDTO> lstCompanyDTO= e.Select(
          lstng => new CompanyDTO()
          {
            BranchId = lsting.BranchId,
            BranchName = lsting.BranchName
            DepartmentId = lsting.DepartmentId
            DepartmentName = lsting.DepartmentName
          }).ToList();
        return ListBranchToDepartmentDTO;
    }

存储库

public class CompanyRepository : IComapnyRepository
{
    public List<CompanyDTO> GetBranches()
    {
        using (TestDBEntities dbcontext1 = new TestDBEntities())
        {
            var lstCountries = from r in dbcontext1.Branches select r;
            List<CompanyDTO> lst = new List<CompanyDTO>();
            lst = CompanyBranchList.DepartmentToBranchDTO(lstCompanyDTO.ToList());
            return lst;
        }
    }

控制器

public List<CompanyDTO> GetDepartments(int deparmentId)
{
    using (TestDBEntities dbcontext = new TestDBEntities())
    {
        var lstDep = dbcontext.States.Where(b => b.DepartmentID == departmentId).ToList();
        List<CompanyDTO> list = new List<CompanyDTO>();
        list = CompanyBranchList.ListBranchToDepartmentDTO(lstDep.ToList());
        return list;
    }
}

Answer 1

您可以通过以下方式实现级联下拉列表：

#!/usr/bin/perl
use strict;

my @list =
  ("JK_HJ_Lancaster", "SY4_TS_HJ_1000ng",
   "NB_E_200cc_caHJ_Rep1", "HB_E_100cc_caHJ_Rep1",
   "HB_E_200cc_caHJ_Rep1", "Normal_Lancaster",
   "NB15_OP_HJ_1000ng","Zoey_HJ_Slough",
   "NB_E_100cc_caHJ_Rep1","Normal_Slough",
   "JK_caHJ_Slough","Zoey_HJ_Lancaster");

print "# Straight sort\n";
foreach my $elem (sort @list) {
  print "$elem\n";
}

print "# Sort grouped by string distance\n";
foreach my $elem (sort { sort_magic_here() }  @list) {
  print "$elem\n";
}

如何使用knockout和MVC以及Entity Framework对下拉列表进行数据绑定

1 个答案: