Arranging the data alphabetically in wijmo listbox

Posted by: nivishapanwar on 10 February 2021, 1:37 am EST

  • Posted 10 February 2021, 1:37 am EST

    Hello,

    How can we arrange the data in listbox alphabetically on selection of radio button. Using typescript code.

    Thank you.
    Regards,
    Nivisha Panwar
  • Replied 11 February 2021, 7:01 pm EST

    Hi Nivisha,

    You may add SortDesription object to the collectionView.sortDescriptions collection to sort the data. You May refer to the following sample demonstrating the same:
    https://codesandbox.io/s/wijmo-angular-forked-yjn5r?file=/src/app/app.component.ts

    Regards
    Sharad
  • Replied 15 February 2021, 1:47 am EST

    Hi Sharad,
    I tried with the same logic, but it didnt work for me.
    name: CollectionView<any>;
    this.name = new CollectionView(this.recordData);
    rChange(val) {
    //let cv = this.ListData.collectionView;
    if (val) {
    this.name.sortDescriptions.push(new wjCore.SortDescription(null, true));
    } else {
    this.name.sortDescriptions.clear();
    }
    }
    <wj-list-box #ListData [itemsSource]="name"
    (selectedIndexChanged)="displayListBoxValueInTextField(ListData)">
    </wj-list-box>
    </div>
    <div class="form-group col-lg-12">
    <input type="radio" name="sortedData" value="true" (change)="rChange(true)" />Alphabetical
    <input type="radio" name="sortedData" value="false" (change)="rChange(false)" />Logical
    </div>
    Does the soln doesnt work for dynamic data?
    Thank you,
    Nivisha
  • Replied 16 February 2021, 5:05 am EST

    Hi Nivisha,

    The solution is supposed to work with dynamic data too. Please explain about the issue you are facing and share a sample that replicates the issue so that we could further investigate it and assist you accordingly.

    Regards
    Sharad
  • Replied 19 February 2021, 1:43 am EST

    Hello Sharad,
    The issue is when I choose alphatical radio box , the data is not getting sorted.
    name: CollectionView<any>;
    this.name = new CollectionView(this.recordData);
    rChange(val) {
    //let cv = this.ListData.collectionView;
    if (val) {
    this.name.sortDescriptions.push(new wjCore.SortDescription(null, true));
    } else {
    this.name.sortDescriptions.clear();
    }
    }
    <wj-list-box #ListData [itemsSource]="name"
    (selectedIndexChanged)="displayListBoxValueInTextField(ListData)">
    </wj-list-box>
    </div>
    <div class="form-group col-lg-12">
    <input type="radio" name="sortedData" value="true" (change)="rChange(true)" />Alphabetical
    <input type="radio" name="sortedData" value="false" (change)="rChange(false)" />Logical
    </div>
    Thank you.
    Regards,
    Nivisha
  • Marked as Answer

    Replied 22 February 2021, 7:33 pm EST

    Hi Nivisha,

    Nothing in the code snippet seems out of ordinary. Please share a sample that replicates the issue so that we could further investigate it and assist you accordingly.

    Regards
    Sharad
  • Replied 23 February 2021, 5:09 pm EST

    Hi Sharad,
    Thank you for the help. It's working fine now.

    Regards,
    Nivisha
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels