0 Replies - 3360 Views - Last Post: 24 August 2012 - 07:49 AM

#1 mvcwannab  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 17
  • Joined: 26-July 12

KO.utils.arrayPushAll question

Posted 24 August 2012 - 07:49 AM

I'm implementing a cascading dropdown list, which populate two other areas when the first ddl is selected. The primary box is a multi-select box, containing objects, which are display just the "name" or the "description" field back to the user.
The boxes in use are:
Projects (multi-select)
Tickets (ddl)
Files (grid)

Files contains the files in project, tickets are a list of ticket descriptions for the project. Each project may or may not contain tickets, but they always contain at least one file. I have observableArrays set up for tickets, projects, and files, with chosen project as a regular observable. What I'm trying to do in code is pushall elements coming back from the server, as a JSON response, onto the observable arrays.

$(document).ready(function () {
    function viewModel() {
        this.projects = ko.observableArray();
        this.chosenProject = ko.observableArray();
        this.tickets = ko.observableArray();
        this.files = ko.observableArray();
        this.chosenTicket = ko.observableArray();
        this.chosenProject.subscribe(function (nProjectId) {
            mvvm.tickets(undefined);
            mvvm.files(undefined);
            var nDx;
            if (nProjectId != null) {
                for (nDx = 0; nDx < nProjectId.length; nDx++) {
                    $.ajax({
                        url: '{WorkingURL Replaced}',
                        data: { nProjectId: nProjectId[nDx] },
                        type: 'GET',
                        success: function (data) {
// currently working, but not as described.  thus the example below for files as to how I would like it to work.
// basically I want the array of values to be appended to the top of the list of tickets / files
                            mvvm.tickets(data);
                        },
                        error: function () {
                            alert('Ticket ajax error');
                        }
                    });
                    $.ajax({
                        url: '{Working URL Replaced}',
                        type: 'GET',
                        data: { nProjectId: nProjectId[nDx] },
                        success: function (data) {
// attempt to pushAll data from JSON response into data grid from consuming .cshtml file
// line is not processing.  I can do .stringifyJSON on the data to verify the data coming back is as expected.
// format: from <var> in <IQueryable object> select new { <var>.uploadPath, <var>.fileName}
// ActionResult returns JSON(format);
                            ko.utils.arrayPushAll(mvvm.files, data);
                        },
                        error: function () {
                            alert('File List ajax error');
                        }
                    });
                }
            }
        }, this);
    }
    var mvvm = new viewModel();
    ko.applyBindings(mvvm);
    $.ajax({
        url: '{Working URL Replaced}',
        type: 'GET',
        success: function (data) {
// main starting project data
            mvvm.projects(data);
        },
        error: function () {
            alert('Project List ajax call error');
        }
    });
    
})


I do understand that the $(document).ready function container is not needed, I'm using it for now to testing purposes only.

Is This A Good Question/Topic? 0
  • +

Page 1 of 1