angular-bootstrap-show-errors icon indicating copy to clipboard operation
angular-bootstrap-show-errors copied to clipboard

Support of ui-select

Open ybc37 opened this issue 10 years ago • 12 comments

First, thank you very much for this great directive!

I try to use this with ui-select (https://github.com/angular-ui/ui-select). But I think there are conflicts and I'm not shure how to get it work. Also I'm not sure, if it's fixable in show-errors (maybe it must be "fixed" in ui-select?).

With this plunker (http://plnkr.co/edit/PRsXlYuJfrP46FhC5O0s?p=preview) you can reproduce the following:

  1. Load the plunker + click on Add (don't input any data) -> it works like expected.
  2. Choose an item and fill in a number in the input -> while the error border on the normal input disappears (after validation), the error border on the select persists.
  3. Now click on Add (JavaScript function clears the data and broadcasts show-errors-reset) -> there is still an error indicator on the select (please notice: this is a different one of ui-select -> conflict?)

Do you know a way to fix this? I already tried to "override" the ui-select style. Look at this hack:

.ui-select-bootstrap.ng-dirty.ng-invalid > button.btn.ui-select-match {
    border-color: #CCC !important;
}

Obviously show-error isn't able to set the border-color, anymore.

Any help would be appreciated!

ybc37 avatar Dec 01 '14 16:12 ybc37

I've just downloaded it and found the same following. Let me know if you have any luck.

PeterClough avatar Dec 01 '14 17:12 PeterClough

I was just preparing to open an issue regarding ui-select support and found this.

Any chance to have ui-select integration? :)

adrianandreias avatar Dec 09 '14 21:12 adrianandreias

+1 for a fix of this!

hewstone avatar Jan 25 '15 20:01 hewstone

+1 for a fix of this

I think the issue may indeed be with ui-select. I was able to get this to work by adding on-select="rerunValidation()" to my ui-select. In my controller, the rerunValidation was simply:

$scope.rerunValidation = function() { $timeout(function() {$scope.$broadcast('show-errors-check-validity'} )) }

See a demo here: http://plnkr.co/edit/OjoRp7QWO89OQhNUTlaZ?p=preview

UI-select doesn't seem to be triggering 'blur' or 'onchange' when an element is selected. This is the only way I've been able to get it to work.

morgenes avatar Feb 24 '15 02:02 morgenes

+1

ahuang321 avatar Mar 17 '15 20:03 ahuang321

+1

rigobcastro avatar Mar 19 '15 18:03 rigobcastro

+1

masscrx avatar May 20 '15 11:05 masscrx

@paulyoder Would be cool to have option to specify any element as "input" instead of searching for it automatically. It will solve ui-select or any other directive usage, that wraps <input>

diimpp avatar Aug 23 '15 11:08 diimpp

+1

dudapiotr avatar Sep 08 '15 11:09 dudapiotr

+1

mujing avatar Oct 22 '15 06:10 mujing

+1

brualves avatar Dec 17 '15 00:12 brualves

+1

paveltyk avatar Oct 06 '16 08:10 paveltyk