jQuery UI Widgets Forums Grid Datagrid, ComboBox with remoteDatascoure updatebounddata issue

This topic contains 4 replies, has 2 voices, and was last updated by  DavidSimmons 11 years, 4 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author

  • DavidSimmons
    Participant

    Can you tell why when using a datagrid with ComboBox editor with a remoteDataSource if you perform updatebounddata on the grid the ComboBox datasource is destroyed or the datasource for the ComboBox is not refreshed with the datagrid’s data source. Is this by design or possibly and bug? I would think that the ComboBox’s dataSource should be refreshed at the same time….

    $(jqxgrid).jqxGrid(‘updatebounddata’);


    Peter Stoev
    Keymaster

    Hi David,

    When “updatebounddata” is called, all editors are destroyed, the Grid performs data binding operation again and re-renders itself. This means that when you open the ComboBox again, the column’s createeditor callback will be called.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com


    DavidSimmons
    Participant

    That is not what I am seeing when using remoteAutoComplete. After the refresh, when you start typing for the next lookup the ComboBox is blank and does not populate. This is with large list. I have a product list of 10000 plus. If you do not refresh they all work very fast every time.

    If you are using small list were you do not need the remoteAutoComplete and you are only using the ComboBox’s dropdown arrow it will work after the refresh.

    My Datasource
    var ProductSearch=”;
    var ProductSource = {
    datatype: “json”,
    datafields: [
    { name: ‘ID’ },
    { name: ‘Product’ }
    ],
    id: ‘id’,
    url: ‘../Product/ProductJSON.php’,
    async: false,
    data: {
    featureClass: “P”,
    style: “full”,
    maxRows: 12
    }
    };

    var ProductDataAdapter = new $.jqx.dataAdapter(ProductSource, {
    formatData: function (data) {
    data.name_startsWith = ProductSearch;
    return data;
    }
    });

    My Editor
    { text: ‘Product’, datafield: ‘Product’, width: 180, editable: true, filterable: true, filtertype: ‘textbox’, columntype: ‘combobox’,
    createeditor: function (row, column, editor) {
    editor.jqxComboBox({selectedIndex: 0, source: ProductDataAdapter, remoteAutoComplete: true, autoOpen: false, dropDownHeight: 250, displayMember: “Product”, valueMember: “ID”,
    renderer: function (index, label, value) {
    var item = ProductDataAdapter.records[index];
    if (item != null) {
    var label = item.Product;
    return label;
    }
    return “”;
    },
    renderSelectedItem: function(index, item) {
    var item = ProductDataAdapter.records[index];
    if (item != null) {
    var label = item.Product;
    return label;
    }
    return “”;
    },
    search: function (searchString) {
    ProductSearch = searchString;//**** Used for my search
    ProductDataAdapter.dataBind();
    }
    });
    editor.bind(‘select’, function (event) {
    var item = event.args.item;
    if (item) {
    var value = item.value;
    var label = item.label;
    selectionID = value;/**** Used to capture the selectionID
    }
    });
    },
    cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
    if (newvalue == “”) return oldvalue;
    }
    },


    Peter Stoev
    Keymaster

    Hi David,

    As you use an external dataAdapter for populating the ComboBox, you should probably update it after updating the Grid’s data source. So you can use the ProductDataAdapter.databind() to make an update.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com


    DavidSimmons
    Participant

    I have been testing the databind() you suggested when the user clicks the refresh button and I am not seeing any change. Does this look like the correct way to perform it? I am still getting an empty Product List in my combobox after a refresh.

    refreshButton.click(function (event) {
    $(‘jqxgrid’).jqxGrid(‘updatebounddata’);
    ProductDataAdapter.databind();
    });

    var ProductSource = {
    datatype: “json”,
    datafields: [
    { name: ‘ID’ },
    { name: ‘Product’ }
    ],
    id: ‘id’,
    url: ‘../Product/ProductJSON.php’,
    async: false,
    data: {
    featureClass: “P”,
    style: “full”,
    maxRows: 12
    }
    };

    var ProductDataAdapter = new $.jqx.dataAdapter(ProductSource, {
    formatData: function (data) {
    $(“#message”).html(“Lookup: ” + lookupSearch);
    data.name_startsWith = lookupSearch;
    return data;
    }
    });

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.