Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
igGrid Combobox not working, unsure why not...

I have copied syntax from another page that is working properly (4 comboboxes,1 utilizing multi-select), created by my predecessor.

Here is the code that isn't working properly:

    ViewBag.Title = "XEUS Product Design Mapping";
    Layout = "~/Views/Shared/_Layout.cshtml";
    const string gridId = "xeusDesignMappingGrid";
    var securityUnLocked = Functions.IsAdministrator();
@if (securityUnLocked)
    //only Admins can add new design
    <div style="margin-bottom: 1px; margin-top: 5px; padding-bottom: 5px; height: 10px;">
        <span style="position: relative; float: right!important; margin-right: 10px;">
            <span id="addNewDesignLookup" class="span-button" onclick="addNewRow(this, '@gridId');" style="padding-bottom: 4px; padding-top: 4px;">
                <span class="add-icon"></span>
                <span title="Add A New Xeus Design Lookup" class="icon-btn">Add New Lookup</span>
    <div class="gridcontainer margintenpixel">
    .Caption("Xeus Design Lookups")
    .Columns(column =>
        column.For(x => x.Id).HeaderText("Mapping Id").DataType("string").Hidden(true);
        column.For(x => x.XeusDesignId).HeaderText("Xeus Id").DataType("string").Hidden(true);
        column.For(x => x.XeusDesign).HeaderText("Xeus Design").DataType("string");
        column.For(x => x.DesignId).HeaderText("Commits Id").DataType("string").Hidden(true);
        column.For(x => x.Design).HeaderText("Commits Design").DataType("string");
        if (securityUnLocked) // only Admin can edit and delete xeus design mappings
            column.Unbound("Actions").HeaderText("Actions").Template("<a title='Edit Lookup' href='#' onclick='editRow(\"" + gridId + "\", \"${Id}\")'>Edit</a> | <a title='Delete Lookup' href='#' onclick='deleteRow(\"" + gridId + "\", \"${Id}\")'>Delete</a>");
    .Features(features =>
            .AddClientEvent("rowAdding", "gridHideDefaultRow")
            .AddClientEvent("editRowEnding", "saveEditedRow")
            .ColumnSettings(settings =>
                settings.ColumnSetting().ColumnKey("Xeus Design").EditorType(ColumnEditorType.Combo).Required(true).ComboEditorOptions(co => co.DataSource(Model.XeusDesigns).ID("xeusDD").ValueKey("Id").TextKey("XeusDesign").Mode(ComboMode.DropDown));
                settings.ColumnSetting().ColumnKey("Commits Design").EditorType(ColumnEditorType.Combo).Required(true).ComboEditorOptions(co => co.DataSource(Model.Designs).ID("commitDD").ValueKey("Id").TextKey("Design").Mode(ComboMode.DropDown));

I need "Commits Design" and "Xeus Design" to both be comboboxes because of the volume of information in the first and users not having other access to the second. They are the only 2 columns visible to the users.

I have a mapping object (XeusDesignMapping is an entity in the C# code) which should store the names and GUIDs of the pair to be matched in the back-end and a GUID created in the back-end that will be populated when the mapping is created.

Everything appears to be populating properly, as I have checks for the stored procs which populate both design sets and the mapping object set, but there are no comboboxes. I just have blank inputs with no filtering applied.

Let me know what I'm doing wrong and what I can do to fix it.

  • 0
    Offline posted

    I found the answer here api documentation

    and I was then able to call into the grid and get the columnSettings object upon successfully retrieving the combo box data from the server.

     function populateUserDirectoryMappings() {
          console.log("calling populateUserDirectoryMappings()");
            type: "GET",
            url: '/userdirectory/GetUserDirectoryMappings',
            dataType: "json",
            success: function(childData) {
              mapToUserGroupList = childData.UserGroups;
              mapToTeamList = childData.Teams;
              return childData;
            error: function() {
          }).done(function(data) {
            mapToUserGroupList = data.UserGroups;
            var grid = $('#groupMappingTable').data('igGridUpdating');
            var updating = grid.options.columnSettings;
            console.log("map to user group list");
            $.each(updating, function(index, data) {
              if (data.columnKey == "MapToUserGroup") {
                data.editorOptions.dataSource = mapToUserGroupList;

    try this and then let me know


    Reliable Permit Solutions, LLC

Reply Children
No Data