tabalinas/jsgrid

initializing grid on done of ajax request throws "jsGrid is not a function" error

Open

Aperta il 6 dic 2017

Vedi su GitHub
 (3 commenti) (0 reazioni) (0 assegnatari)JavaScript (1520 star) (356 fork)batch import
help wanted

Descrizione

Hi!

I have been trying to make this work and somehow it doesn't. The code is just initializing the jsGrid on the "done" of the ajax call, as follows (I have simplified the grid, I am only showing the one column I want to bind):

    $.ajax({
               method: "GET",
               url: "/User/GetList"
           }).done(function (users) {

             console.log("data from ajax call:", users);

            $("#jsGrid").jsGrid({

                width: "900px",
                height: "700px",

                filtering: true,
                inserting: true,
                editing: true,
                sorting: true,
                paging: true,
                autoload: true,

                pageSize: 10,
                pageButtonCount: 5,

                deleteConfirm: "Do you really want to delete client?",
                controller: {
                    loadData: function (filter) {
                        return $.ajax({
                            type: "GET",
                            url: "/X/GetList",
                            data: filter
                        });
                    },
                    insertItem: function (item) {
                        return $.ajax({
                            type: "POST",
                            url: "/X/Create",
                            data: item
                        });
                    },
                    updateItem: function (item) {
                        return $.ajax({
                            type: "PUT",
                            url: "/X/Update",
                            data: item
                        });
                    },
                    deleteItem: function (item) {
                        return $.ajax({
                            type: "DELETE",
                            url: "/X/Delete",
                            data: item
                        });
                    }
                },
                fields: [
                    { name: "UserName", type: "select", width: 300, items: users, valueField: "ID", textField: "UserName" },
                    { type: "control" }
                ]
            });
        });

Now, the result is the following:

image

What could be the issue? I have tried everything, but it only works if the array passed on items is a static one. I did check issue #15 already, as well as this example.

Thanks!

Guida contributor