Thursday 27 February 2014

Knockoutjs arrayIndexOf or indexOf

arrayIndexOf() || indexOf()

Using arrayIndexOf() or indexOf(), find all matched items from an array collection. If items matched then returns true else returns false.

 var arrayIndexOffunction (keyword) {
           try {
               var keyText = keyword.toLowerCase();         
               if (!keyText) {
                   return arrayCollection();
               }
               else {
                   if (arrayCollection().length > 0) {
                       var match = ko.utils.arrayIndexOf(arrayCollection(), function (item){  
                                    return item.Lable.toLowerCase() === keyword.toLowerCase();      
                       });

                       If(match){
                   return true;
                        }
                        else{
                            return false;
                        }
                  }
               }
           }
           catch (ex) {
               //TODO: something..
          }

  };


Knockoutjs Array First

Array First returns only first matched value. If exist more than one item then ignore it.

 var arrayFirst = function (labelName, arrayCollection) {
         try {
                 if (arrayCollection.length > 0) {
                     return ko.utils.arrayFirst(arrayCollection, function (item) {
                         return (item.labelName.toLowerCase().indexOf(labelName.toLowerCase()) > -1);
                     });
                 };
          }
          catch (ex) {
               //TODO: as per need.
          }

  }; 

Wednesday 26 February 2014

Knockoutjs array filter

arrayFilter

In arrayFilter, search items from existing array collection. If items are matched then returns true else returns false.

filterTxt = ko.observableArray([]);
Here filterTxt is observable array which bind with input field. i.e.

HTML :

<input id="filterText" data-bind="value: SearchText, valueUpdate: 'afterkeyup' />
<div data-bind="foreach: arrayFilter ">
   <p data-bind="text: Label"></p>
   <p data-bind="text: Description"></p>
</div>


SCRIPT :

var arrayFilter = ko.computed(function () {
           try {
               var text = filterTxt.toLowerCase();         
               if (!text) {
                   return arrayCollection();
               }
               else {
                   if (arrayCollection().length > 0) {
                       return ko.utils.arrayFilter(arrayCollection (), function (item) {
                           if (item.Label.toLowerCase().indexOf(text) > -1 || item. Description.toLowerCase().indexOf(text) > -1) {
                               return true;
                           }
                           else {
                              return false;
                           }
                       });
                   }
               }
           }
           catch (ex) {
               //TODO: as per need.
           }

 });

Knockoutjs Array functions

All Knockoutjs Array functions are working with ko.utils namespace. As per my knowledge, In knockout js have 9 array operations which are give below
  1. arrayFilter
  2. arrayFirst
  3. arrayIndexOf
  4. arrayMap
  5. arrayForEach
  6. arrayPushAll
  7. arrayRemoveItem
  8. arrayGetDistinctValues
  9. compareArrays 

Knockoutjs Array Filter

In arrayFilter, search items from existing array collection. If items are matched then returns true else returns false.

filterTxt = ko.observableArray([]);
Here filterTxt is observable array which bind with input field. i.e.

HTML :

<input id="filterText" data-bind="value: SearchText, valueUpdate: 'afterkeyup' />
<div data-bind="foreach: arrayFilter ">
    <p data-bind="text: Label"></p>
    <p data-bind="text: Description"></p>

</div>


SCRIPT CODE:

var arrayFilter = ko.computed(function () {
           try {
               var text = filterTxt.toLowerCase();         
               if (!text) {
                   return arrayCollection();
               }
               else {
                   if (arrayCollection().length > 0) {
                       return ko.utils.arrayFilter(arrayCollection (), function (item) {
                           if (item.Label.toLowerCase().indexOf(text) > -1 || item. Description.toLowerCase().indexOf(text) > -1) {
                               return true;
                           }
                           else {
                              return false;
                           }
                       });
                   }
               }
           }
           catch (ex) {
               //TODO: as per need.
           }


 });


Knockoutjs Array First

Array First returns only first matched value. If exist more than one item then ignore it.

 var arrayFirst = function (labelName, arrayCollection) {
         try {
                 if (arrayCollection.length > 0) {
                     return ko.utils.arrayFirst(arrayCollection, function (item) {
                         return (item.labelName.toLowerCase().indexOf(labelName.toLowerCase()) > -1);
                     });
                 };
          }
          catch (ex) {
               //TODO: as per need.
          }
  }; 


Knockoutjs ArrayIndexOf || indexOf

Using arrayIndexOf() or indexOf(), find all matched items from an array collection. If items matched then returns true else returns false.

 var arrayIndexOffunction (keyword) {
           try {
               var keyText = keyword.toLowerCase();         
               if (!keyText) {
                   return arrayCollection();
               }
               else {
                   if (arrayCollection().length > 0) {
                       var match = ko.utils.arrayIndexOf(arrayCollection(), function (item){  
                                    return item.Lable.toLowerCase() === keyword.toLowerCase();      
                       });

                       If(match){
                   return true;
                        }
                        else{
                            return false;
                        }
                  }
               }
           }
           catch (ex) {
               //TODO: something..
          }
  };

Why knockout js different from MVC ?