Ajax as a data source about nya-bootstrap-select HOT 21 CLOSED

This directive only concern about data in model.
You can get your data through $http, $resource or restAngular. use that data with nya-bs-option just like ng-repeat. once the data is ready. your select will have new options or new selected option.

from nya-bootstrap-select.

You're right but input field which is needed to load new data is in Your directive :/
I hope that You'll give it a try.

from nya-bootstrap-select.

nya-bs-select directive has an input field only when live-search="true". But this input field search through DOM elements not your data collection.
Whenever the collection expression in nya-bs-option changed, new option content would be generated and ready for searching.

In fact, as an angular data manipulating directive, concerning about, the ajax is anti-pattern and not my design goal.

from nya-bootstrap-select.

Well I've got situation:
I want to get company id from data base. In database I can have thousands of companies and I don't want to generate such long list. So I have to use ajax to load best suitable 30 records.

I know that You're input shows only on live-search, but You can widen it to ajax as well.
Please look at ui-select example with refresh.

Ajax input and live-search input are the same input but acts different.
Please consider it in future version.

from nya-bootstrap-select.

Ok, I've learned your situation. Maybe I should add an different search function through and ajax to manipulate the option list. but this is far away from this component primary goal and will increase the complexity and decrease the flexibility.
I'll try to find a way to make it possible.

from nya-bootstrap-select.

Please do... Then I'll swtich to Your script and abandon ui-select ;)

from nya-bootstrap-select.

Maybe your current situation only require an input field with a bootstrap dropdown which list element populate by ng-repeat. That's all your need.

from nya-bootstrap-select.

Well to do this I need value of string in live-search input. I see that it isn't in scope.
Than in ajax function I could change $scope.items.
Here is pholisopy from ui-select:

• Watch value inputed in live-search:

scope.$watch('$select.search', function(newValue) {
    $select.refresh(attrs.refresh);
});

• Trigger refreshing func:

var _refreshDelayPromise;
var refreshDelay=100;
ctrl.refresh = function(refreshAttr) {
      if (refreshAttr !== undefined) {
        if (_refreshDelayPromise) {
          $timeout.cancel(_refreshDelayPromise);
        }
        _refreshDelayPromise = $timeout(function() {
          $scope.$eval(refreshAttr);
        }, ctrl.refreshDelay);
      }
    };

• refresh attr with ajax func.

<li nya-bs-option="item in items" refresh="ajax($select.search)">
            <a>
                {{item.tytul}}
                <span class="check-mark">ok</span>
            </a>
        </li>

I can't do it:/

from nya-bootstrap-select.

This is totally an ui-select feature. ui-select directive has a new child scope inherit from parent scope which give it ability to bind a new model on input field. But nya-bs-select cannot do this directly.

In fact. You can do a little hack on current version. NOTE: This is a dirty way which need you to manipulate DOM directly.

<ol id="mySelect" class="nya-bs-select" live-search="true" ng-mode="model">
   <li nya-bs-option="option in options">
    // content or other...
   </li>
</ol>

delegate a listener on the select to listen input event.

$('#mySelect').on('input', 'input', function(event) {
   var inputField = $(event.target);
   var inputValue = inputField.val();
   //do some ajax request
   $http(url, {param: inputValue})
      .success(function(data) {
          // should refresh the option list.
          $scope.options = data;
          $scope.$digest();
       });
}

from nya-bootstrap-select.

Thanks - I'll give it a try tommorow

from nya-bootstrap-select.

There are two problems.
At start I've got no options and Your script displays NO_SEARCH_RESULT but when I update options that text isn't disapearing. Also data-size attr isn't aplied and whole list is displayed without scrolling.

from nya-bootstrap-select.

Well, This is very hard to solve. Every function of this directive just focus on what it should do. nya-bs-option focus on generate option base on collection expression. nya-bs-select focus on solve user interactive and data-binding with ng-model. None of them expect a more complex situation. So currently you need to achieve this function with another way, like use an input field out side this directive(live-search has its own function, not very suitable on this).

I'm sorry currently I can't do much to help you to solve this problem.

from nya-bootstrap-select.

I understand. I'll wait until You make ajax version :)

from nya-bootstrap-select.

Hi, when You think You'll manage to make new version?

from nya-bootstrap-select.

any news??

from nya-bootstrap-select.

I haven't found any way to make this.

from nya-bootstrap-select.

Do You mean That You won't add it?? Take ui.bootstrap as a source. You have to add this option and Your select component will be the best...

from nya-bootstrap-select.

Sorry for bother.
I need Your declaration, because it's very important form me.
Are You making ajax handling or not?
If not I have to look for other solution.

from nya-bootstrap-select.

No, Ajax is not planned. Sorry for this.

from nya-bootstrap-select.

I am using the component, and this feature is missing for me too. I may develop this internally in the future. Are you open to PRs on this?
Thanks.

from nya-bootstrap-select.

Add ajax data source may make this component too complicated.

from nya-bootstrap-select.