Forums Ignite UI for jQuery
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
Close
Norm
150
iggrid combo box appears at bottom of the screen instead of inside grid
posted

I created an Ignite UI MVC 5 (Raxor) project in Visual Studio 2015 using version 16.2 of Infragistics and version 3.3.7 of bootstrap. Everything for the most part is working, but when I click on the combo box, it appears at the bottom left of the page and not inside the grid. Here is the grid code.

@(Html.Infragistics()

    .Grid(Model)
    .ID("igGrid")
    .Width("100%")
    .Height("600px")
    .AutoGenerateColumns(false)
    .PrimaryKey("CompositeID")
    .UpdateUrl(Url.Action("SaveData"))
    .Columns(column =>
    {
        column.For(x => x.CompositeID).HeaderText("CompositeID").Hidden(true);
        column.MultiColumnHeader().HeaderText("Product").Group(sub =>
        {
            sub.For(x => x.Name).HeaderText("Name");
            sub.For(x => x.Barcode).HeaderText("Barcode").FormatterFunction("barCode");
            sub.For(x => x.BarcodeType).HeaderText("Type").FormatterFunction("barCodeType");
        });
    })
    .Features(f =>
    {
        f.Filtering()
            .Mode(FilterMode.Simple);
        f.Sorting()
            .Mode(SortingMode.Single);
        f.MultiColumnHeaders();
        f.Updating()
              .ColumnSettings(cs =>
              {
                  cs.ColumnSetting().ColumnKey("CompositeID").ReadOnly(true);
                  cs.ColumnSetting().ColumnKey("Name").EditorType(ColumnEditorType.Text);
                  cs.ColumnSetting().ColumnKey("Barcode").EditorType(ColumnEditorType.Text).Required(true);
                  cs.ColumnSetting().ColumnKey("BarcodeType").EditorType(ColumnEditorType.Combo).ComboEditorOptions(co =>
                  {
                      co.DataSource(ViewBag.BarCodes)
                          .Mode(ComboMode.DropDown)
                          .EnableClearButton(false)
                          .DataBind();
                  });
              })
      .EnableAddRow(true)
      .EnableDeleteRow(true)
      .EditMode(GridEditMode.Row);
    })
    .DataSourceUrl(Url.Action("GetBarCodes"))
    .DataBind()
    .Render())
Does anyone have any suggestions as to why the combo is not rendering in the proper location?
Thanks,
Parents
No Data
Reply
  • 7495
    Offline posted

    Hello Norm,

    I followed the steps you suggested and was unable to reproduce the behavior you're describing. 

    I have created a sample of iggrid with a combo editor using version 16.2 .
    When I run the sample and open the combo box , it does appear inside the grid.

    I have attached the sample project I used to test this.  Please test this project on your PC; whether or not it works correctly may help indicate the nature of this problem. And you can also test the sample by modifying the bootstrap which you have.

    If the project does not work correctly, then the change in behavior is due to differences in your environment from mine .
    If the project does show the product feature working correctly, then more information will be needed to reproduce the issue in a sample that can be used for debugging.  It will help if you can provide a small, isolated sample application that demonstrates the behavior you are seeing.  This can be done by either making the sample that I provided more like your application or by isolating the behavior from your application by removing dependencies on any third parties or databases.

    Please let me know if I can provide any further assistance.

    igGrid_DropDownColumn.zip
Children