jQuery UI Widgets Forums Grid filteritems and initial filters are not updated onchange event

This topic contains 0 replies, has 1 voice, and was last updated by  sonu 5 years, 6 months ago.

Viewing 1 post (of 1 total)
  • Author

  • sonu
    Participant

    I want to update the grid and status column filteritems based on event. I have a default selected option in dropdown based on which i have set the initial filter in the grid.

    Look at image

    $('#jqxgrid').jqxGrid(
        {
          source: dataAdapter,
          altrows: true,
          width: 1106,
          autoheight: true,
          sortable: true,
          filterable: true,
          showfilterrow: true,
          showsortmenuitems: false,
          pageable: true,
          virtualmode: true,
          rendergridrows: function(obj) {
            return obj.data;
          },
          ready: function () {
            addfilter()
          },
          sorttogglestates: 1,
          autoshowloadelement: false,
          columnsresize: true,
          autorowheight: true,
          columnsheight: 40,
          enablebrowserselection: true,
          columns: [
            {
              text: 'Id',
              columntype: 'textbox',
              width: '100',
              cellsalign: 'center',
              datafield: 'id',
            },
            {
              text: 'Customer',
              columntype: 'textbox',
              datafield: 'last_name',
              cellsalign: 'center',
              hidden: false,
            },
            {
              text: 'Store',
              columntype: 'textbox',
              datafield: 'store',
              cellsalign: 'center',
              hidden: false,
            },
            {
              text: 'Status',
              datafield: 'repairer_status',
              filtertype: 'checkedlist',
              filteritems: new $.jqx.dataAdapter(repairerSource),
              cellsalign: 'center',
              //filter: firstNameColumnFilter,
              createfilterwidget: (column, htmlElement, editor) => {
                editor.jqxDropDownList(
                  {displayMember: 'label', valueMember: 'value'})
              },
            }
            },
          ],
        })

    So when the page is load so i checked the selected dropdown value and parsed data to initial filter (addfilter) function.

    `var addfilter = function () {
    var filtergroup = new $.jqx.filter();
    var repLen = repairerSource.localdata;
    for (var j = 0; j < repLen.length; j++) {
    var filter_or_operator = 1;
    var filtervalue = repLen[j].label;
    var filtercondition = ‘equal’;
    var filter = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);
    filtergroup.addfilter(filter_or_operator, filter);
    }
    $(“#jqxgrid”).jqxGrid(‘addfilter’, ‘repairer_status’, filtergroup);
    $(“#jqxgrid”).jqxGrid(‘applyfilters’);
    }`

    I have called onchange event based on dropdown and set the data to the variable repairerSource . The repairerSource is having the data of status filteritems.

    `var repairerSource =
    {
    datatype: ‘array’,
    datafields: [
    { name: ‘label’, type: ‘string’ },
    { name: ‘value’, type: ‘string’ },
    ]
    };

    $(‘#quickFilter’).change(function () {
    var selectedVal = this.value
    var objd = JSON.parse(filterData);
    let defaultData = findObjectByKey(objd, ‘name’, selectedVal);
    source.data = {
    params: {
    conditions: defaultData.conditions,
    retailer_id: [1, 2, 4, 5, 12, 20, 23, 24],
    is_sandbox_on: [0]
    }
    }
    html = ”;
    repairerSource.localdata = defaultData.repairer_status;
    //alert(JSON.stringify(repairerSource.localdata));
    $(‘#jqxgrid’).jqxGrid(‘setcolumnproperty’, ‘repairer_status’, ‘filteritems’, repairerSource.localdata);
    $(‘#jqxgrid’).jqxGrid(‘updatebounddata’,’data’)
    $(‘#jqxgrid’).jqxGrid(‘refreshfilterrow’)
    })`

    so when i change the option in dropdown so all the new filteritems should be selected and grid should be loaded but in my current code filteritems are updated but not all selected and grid is not loaded . so please help me on this i want to load the data and filteritems based on onchange event of dropdown.

    You can look into my code also here.

    • This topic was modified 5 years, 6 months ago by  sonu.
Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.