feature: make searchbox much more extensible

[igorlino]

Hi,

The advance searchbox component is a very interesting component. Thanks a lot!

In order to fully exploit the potential of the searchbox, I think some extension points could be very useful:

The following extensions come to my mind:

1. easy overriding of classes of the searchbox
2. easy overriding of the remove/delete icon class. Depending on context/web project some rigid L&F style guides would require an specific icon.
3. Overriding the template-url (Default: 'dist/angular-advanced-searchbox.html'). In case some needs more structure changes to the HTML.
4. Overriding the "Parameter Suggestions" text. Sometimes you may want to use something different or also localize it to other language. for example tile="{{'Title in spanish'} | translate}"
5. Generic way how to add other types of parameters/filters (like date, integer, float, list/selectbox)
6. Generic way how to add validation.

Does it make sense ?

If help is needed I think I could spend some efforts to add some of them.

[dnauck]

Question to 3.)

There is an templateUrl property, does it not work?

[igorlino]

First of all, thank you for the last updates (not only related to this issue), one cannot underestimate how much easier for end-users when a component is well fined tuned. +1

The templateUrl cannot be overwritten from the html directive, you need to make the templateUrl use a function that reads, if existent, some attribute.

myApp.directive('myDirective', function() {
  return {
    restrict: 'A',
    templateUrl: function(element, attrs) {
      var templateUrl = 'angular-advanced-searchbox.html';
      if (angular.isDefined(attrs.nitTemplate)) {
        return attrs.nitTemplate;
     }
    }
  }
});

[dnauck]

Ah, thanks.

[dnauck]

Released that change with version 2.0.1

[dnauck]

Question to 6.)

What kind of validation are you talking about? The build in browser validation of point 5.) ?

[igorlino]

I think we can drop 6. I thought about the 6. together with 5., now that I think about it, perhaps 6. does not make sense. This is because we can always listen to the model changes and determine if its valid or not (like for example some dates, or some specific syntax in some field (maybe some characters are not allowed etc.)). and based on that, enable or disable ng-class. So only CSS would then show whaever color is needed.

[gauravbhusare]

When I use type=date at that time it is not supporting in Mozilla Firefox and Internet Explorer? Any suggestions?