ASP MVC淘汰json嵌套foreach数据绑定

时间:2015-11-19 10:30:21

标签: c# json knockout.js asp.net-web-api data-binding

很抱歉,如果已经提出这个特殊问题,我遇到了无数类似的问题,但似乎与我的问题无关。

我对MVC Web API很新,并且使用JavaScript / knockout。

查看模型脚本 - QuestionItems.js

var SectionModel = function (data) {
    var self = this;

    self.SectionName = ko.observable(data.SectionName);
    self.SectionNumber = ko.observable(data.SectionNumber);

    self.Questions = ko.observableArray();

};

var questionnaireViewModel = function () {

    self.sections = ko.observableArray();
    self.error = ko.observable();

    var itemsUri = '/api/QuestionnaireItems/';
    var sectionsUri = '/api/QuestionnaireSections/';

    function ajaxHelper(uri, method, data) {
        self.error('');
        return $.ajax({
            type: method,
            url: uri,
            dataType: 'json',
            contentType: 'application/json',
            data: data ? JSON.stringify(data) : null
        }).fail(function (jqXHR, textStatus, errorThrown) {
            self.error(errorThrown);
        });
    }

    function getAllQuestions() {
        ajaxHelper(itemsUri, 'GET').done(function (data) {
            for (var s = 0; s < self.sections.length; s++) {
                // find all the questions for this section
                var sectionQuestions = data.filter(function (item) {
                    return item.SectionName == self.sections[s].SectionName;
                });
                // add the questions to each section
                self.sections.Questions(sectionQuestions);
            }
        });
    }

    function getAllSections() {
        ajaxHelper(sectionsUri, 'GET').done(function (data) {
            // map each data item to a SectionModel and store that in your main viewModel
            var sectionsTemp = data.map(function (item) {
                return new SectionModel(item);
            });
            self.sections(sectionsTemp);
        });
    }

    getAllSections();
    getAllQuestions();

};

ko.applyBindings(questionnaireViewModel);

我的观点 - Index.cshtml

@section scripts {
    @Scripts.Render("~/bundles/QuestionItems")
}

<div class="col-lg-12">
    <h1 class="page-header">SQA</h1>
    <ul class="list-unstyled" data-bind="foreach: sections">
        <li>
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div><strong data-bind="text: SectionNumber"></strong>. <strong data-bind="text: SectionName"></strong></div>
                </div>
                <div class="panel-body">
                    <ul data-bind="foreach: Questions">
                        <li>
                            <span data-bind="text: QuestionNumber"></span>. <span data-bind="text: QuestionName"></span>
                        </li>
                    </ul>
                </div>
            </div>
        </li>
    </ul>
</div>

在数据库中,我有一个QuestionnaireItems表,它存储所有问题详细信息和一个外键到sections表,以检索每个问题相关部分:

QuestionnaireItems

还有一个QuestionnaireSections表,其中包含每个部分的名称和订单号:

QuestionnaireSections

我已设法显示部分,但问题不是。如果我只是提出问题而没有将它们与正确的部分相匹配则会显示。我假设这是条件设置方式的问题,但我完全失去了如何解决这个问题。

我还测试了Postman中的控制器,所有正确的数据都在通过。

QuestionItemList.cs(DTO):

public class QuestionItemList
{
    public int Id { get; set; }

    public int SectionNumber { get; set; }

    public string SectionName { get; set; }

    public int QuestionNumber { get; set; }

    public string QuestionName { get; set; }
}

SectionItemList.cs(DTO)

public class SectionItemList
{
    public int Id { get; set; }

    public int SectionNumber { get; set; }

    public string SectionName { get; set; }
}

QuestionnaireItemsController:

    public class QuestionnaireItemsController : ApiController
    {
        private SQAContext db = new SQAContext();

        // GET: api/QuestionnaireItems
        [HttpGet]
        public IQueryable<QuestionItemList> GetItems()
        {
            var items = from a in db.QuestionnaireItems
                        select new QuestionItemList()
                        {
                            Id = a.PID,
                            SectionNumber = a.QuestionnaireSection.Number,
                            SectionName = a.QuestionnaireSection.Name,
                            QuestionNumber = a.Number,
                            QuestionName = a.Name
                        };

            return items;
        }

        protected override void Dispose(bool disposing)
        {
            if (disposing)
            {
                db.Dispose();
            }
            base.Dispose(disposing);
        }

        private bool QuestionnaireItemExists(int id)
        {
            return db.QuestionnaireItems.Count(e => e.PID == id) > 0;
        }
    }

QuestionnaireSectionsController:

public class QuestionnaireSectionsController : ApiController
{
    private SQAContext db = new SQAContext();

    // GET: api/QuestionnaireSections
    [HttpGet]
    public IQueryable<SectionItemList> GetSectionItems()
    {
        var items = from a in db.QuestionnaireSections
                    select new SectionItemList()
                    {
                        Id = a.PID,
                        SectionNumber = a.Number,
                        SectionName = a.Name
                    };

        return items;
    }


    protected override void Dispose(bool disposing)
    {
        if (disposing)
        {
            db.Dispose();
        }
        base.Dispose(disposing);
    }

    private bool QuestionnaireSectionExists(int id)
    {
        return db.QuestionnaireSections.Count(e => e.PID == id) > 0;
    }
}

0 个答案:

没有答案