rhuntington icon

Working JS Grid Script

rhuntington | PRO | 03/11/20 07:29:17 PM UTC | 0 ⭐ | 322 👁️ | Never ⏰ | []
JavaScript |

1.67 KB

|

None

|

0 👍

/

0 👎

let roomChange;
 
let actions = [
    { "Action": "Set" },
    { "Action": "Mod" },
    { "Action": "Strike" },
    { "Action": "Carry" }
];
 
let rooms = [
    { "Room": "Empire", id: 0 },
    { "Room": "Empire A", id: 1 },
    { "Room": "Empire B", id: 2 },
    { "Room": "Empire C", id: 3 },
 
];
 
$("#jsgrid").jsGrid({
    width: "100%",
    height: "400px",
 
    inserting: true,
    editing: true,
    sorting: true,
    paging: true,
 
    // data: clients,
 
    fields: [
        {
            name: "Room", type: "select", items: rooms, textField: "Room", valueField: "id", validate: "required"
        },
        { name: "Action", type: "select", items: actions, textField: "Action", valueField: "Action" },
        { name: "Note", type: "text" },
        { name: "Day", type: "date" },
        { type: "control" }
    ],
    controller: {
        insertItem: (item) => {
            if (item.Note == "") {
                item.Note = "-";
            }
            if (item.Action == "Mod") {
                // if action = mod, get extra input and set the roomChange var to value of what user selects
                $("#exampleModal").modal();
                /* NO ACTUAL FUNCTIONALITY! JUST PROOF OF CONCEPT */
                roomChange = 1; // Set var to user's val
            } else {
                // If not mod, then set/reset var to what user has selected in the table
                roomChange = item.Room;
            }
        },
 
    }
});
 
/* Event listener for insert button click */
$(document).on('click', '.jsgrid-insert-button', () => {
    $("select").val(roomChange); // updates select value based on user's input
});

Comments