Select a default value with remote fetching

[Nishchit14]

I am using two form one for add items and second for edit items. Now my problem is at add time i am fetching data from service and store item in database.

Now while at edit time i can't set previously saved selector value as default, At edit time also i am fetching data from service.

What i think should be. I think while editing it, custom options can be set with array of single value of assigned model of selector.

Like

vm.item = {

  name : "Pizza",
  belongTo: "Fast Food"
}

vm.belongTos = [ vm.item.belongTo ]

<select selector
        id="itemSearch"
        multi="false"
        model="vm.item.belongTo"
        options="vm.belongTos"
        remote="vm.searchItem(search)"
        label-attr="name"
        view-item-template="vm.itemTemp"
        dropdown-item-template="vm.itemTemp"
        placeholder="Select item ...">

</select>

Here we can set custom options for selector for EDITING FORM purpose.

[indrimuska]

Hi @Nishchit14, it's a little hard for me to understand the question without an example that explains the scenario. Could you please provide a little working one? Thanks :)

[Nishchit14]

Hi @indrimuska ,

Its simple scenario 1) I have items in grid. 2) I want to update single item from list. 3) Click on edit icon of any row. 4) Modal(popup) will open with item's detail 5) Now this item has one key group as item.group (It is selected by selector) 6) So i want to set group value as default selected in selector when popup opens. 7) Then if i want to change it then use remote options to fetch new group

[indrimuska]

Ok, maybe I have understand the scenario, but I still don't understand where the problem stands.

Correct me if I'm wrong. You have a lot of items with the same structure in a grid. Each of them has a group property that you want to be able to change. So, using a modal, you want to change the group of one these item by using Angular Selector in a remote configuration. Right?

Well, what's the problem? You can't change it with a remote configuration?

[Nishchit14]

Yes perfectly, My problem is how to set default selected group first time when modal open.

[indrimuska]

Can't you just assign a default value at the initialization time? or when you open the modal?

[Nishchit14]

That's the problem Do we have any example for this ?

I have value for model at initialization time but don't have dropdown options array. So how to set it ?

[indrimuska]

I think I need a little similar working example, I cannot completely figure out the problem without it, sorry.

[Nishchit14]

Here is plunkr.

I want to let AF as default selected by any trick. Because i am not firing any query if search is empty.

[indrimuska]

I was completely out of the way, now I can understand your problem and it seems similar to #34. Let me make some tests and I'll come back to you.

[indrimuska]

This is an updated plunker for your scenario. It uses the same logic of this comment. What do you think about?

[indrimuska]

The main problem is that if you manually set a given value to your model, I can validate that value only by using your service (or any other remote service). That would mean I have to fetch another remote request every time the value changes, and I don't think it should be the best behavior.

[indrimuska]

I'm going to close this issue and move the conversion to issue #40.

[andreialecu]

The problem with the updated plunker is that it changes the API a bit and the implementor needs to take care that search may be an array. This is fine, but it needs to be labeled as a potential breaking change.

To understand what I mean, try changing countries to something like: $scope.countries = ["AF", "DE"];

It won't work by default without further changes to the code.