c# - checking returned children in knockout js -
i using knockout display items on page. have list of groups ex: group 1, group 2,... each group in it's own div. when click on 1 of groups open , display items in group. of groups don't have items display , instead of not showing change display: "no items in group"
i having trouble doing in view in javascript , thought able in knockout/jquery script
view:
<div class="accordion-group elements-by-item"> <div class="accordion-heading"> <a class="ui_title accordion-toggle text_x-large item_accordion_toggle" data-toggle="collapse" data-parent="#bytimeindex" data-bind="text: title() != null ? title() : identity(), attr: { 'href': '#itemcontent_' + id(), 'data-item-id': id() }"> </a> </div> <div class="accordion-body collapse state-loading" data-bind="attr: { 'id': 'itemcontent_' + id(), 'data-item-id': id() }"> @html.partial("_itemelements") </div> </div> **_itemelements page:** <div class="accordion-inner no_border" data-bind="foreach: children"> <div class="element"> ........ </div> <div>
knockout/jquery js
$idx.itemsretrieved = new array(); $idx.getitemcontent = function (element) { var _itemid = element.attr('data-item-id'); var _elementdata = $idx.itemdata; this.getelementcontent({ groupid: _itemid, groupdata: _elementdata.items, elementdata: _elementdata, apiurl: _courseindexoptions.getitemurlprefix + _itemid, accordionbodyselector: '.accordion-body[data-item-id="' + _itemid + '"]', accordionbtnselector: 'a[data-item-id="' + _itemid + '"]', viewmodel: $idx.timeviewmodel }); } $idx.getelementcontent = function (options) { if (linq.from($idx.itemsretrieved).any(function (x) { return x == options.groupid })) { $(options.accordionbodyselector).removeclass(constants.stateclasses.loading); return; } return ajax.get({ url: options.apiurl, onsuccess: function (data) { var _items = linq.from(options.groupdata); var _itemtoupdate = _items.where(function (x) { return x.id == options.groupid; }); if (_itemtoupdate.any()) { _itemtoupdate.first().children = data.items; } ko.mapping.fromjs(options.elementdata, options.viewmodel); sections.elementarray.addrange(data.items); $(options.accordionbodyselector).removeclass(constants.stateclasses.loading); $idx.itemsretrieved.push(options.groupid); $(options.accordionbtnselector).click(); } });
how can check if children itemsretrieved = 0 , set message "no items" show in view page?
you can :
<div class="accordion-inner no_border" > <div data-bind="foreach: children"> <div class="element"> </div> </div> <span data-bind="if : children().length == 0">no items in group</span> <div>
i hope helps.
Comments
Post a Comment