0

I had to make some changes on the webpage i'm working, before this, i had an input textfield to filter results on a table, this was the code:

  <p><input type="text" class="form-control"  ng-model="search" placeholder="Search..."></p>

and the code for the table was:

<tr ng-repeat="data in someFile| filter:search | orderBy:'name'">
     <td>{{data.state + ', ' + data.city}}</td>
     <td> more data goes here etc...</td>
</tr>

that worked just fine, but now i need to change the input textfield for jQuery chosen select to get different info with multiple filters.

The code i tried is this:

 <select   data-placeholder="Search..." multiple class="control-group chosen-select" chosen id='sl_edo'  style="width:200px;">
            <optgroup   ng-repeat="data in someFile[0].state | orderBy:'name'" label={{data.name}}>
                <option  value=""> </option>
                <option  ng-model="search" ng-repeat="city in data.city | orderBy:'name'">
                                  {{city.name}}</option>
            </optgroup>
  </select>

i know that the ng-model code should go in the html select tag like this:

<select  ng-model="search" data-placeholder="Search..."  etc..

but that doesn't filter the results in the table, what happens is that the table goes blank, i have no idea why, unless i quit the filter the data goes back to table. What i can do to make the code work as intended?

EDIT: i have been watching what are the values in ng-model="search", so far they are treated like an array like this: ["data1","data2"...] (since i added the value={{localidad.nombre}} on the options tag), if i access to certain value in the array like this {{search[0]}}, displays the text normally like this data1, but still not filtering the table results, the table goes blank, any ideas on what's going on?

EDIT 2:i stumbled on some questions on stack overflow How to filter multiple values (OR operation) in angularJS, this could be an issue? i mean the filters are supposed to be multiple.

Community
  • 1
  • 1
Progs
  • 1,059
  • 7
  • 27
  • 63

2 Answers2

2

Forgive me if this in a different Tangent to what your after but I wrote a quick example. Which I think covers what your trying to go after.JsFiddle Driven of the Value you have assigned to the option tag.

            <p><select data-ng-model="search"  >
            <option value="NY">New York</option>
            <option value="NV">New Vegas</option>
            <option value="AL">Alabama</option>
            </select>
            </p>

            <table>
            <tr ng-repeat="data in someFile| filter:search | orderBy:'name'" style="border: 1px solid black;" >
            <td>{{data.number}}</td>
             <td>{{data.state + ', ' + data.city}}</td>
             <td> more data goes here etc...</td>
            </tr>
            <table>
Londoner_Tom
  • 21
  • 6
  • This gets closer to the solution, but as i mentioned before when i print the value of the **ng-model** display now like this **["someCity1","someCity2"]**, at least it's much better than this **["\n\t\t\t\t\t\t\t\t someCity1","\n\t\t\t\t\t\t\t\t someCity2"]** – Progs Sep 02 '15 at 18:40
1

What you're missing is what within your search model you want it to go by. search itself is an object of key values.

<tr ng-repeat="data in someFile | filter:search.XXXX | orderBy:'name'">

Where XXXX is the property name of what you're trying to search by. Whether it be search.Guid / search.Name whatever you have there.

Mark Pieszak - Trilon.io
  • 61,391
  • 14
  • 82
  • 96
  • Yes, this kinda works when i print the ng-model values on the webpage i get something like this **["\n\t\t\t\t\t\t\t\t someCity1","\n\t\t\t\t\t\t\t\t someCity2"]**, so in way it's working, but for some reason when i try to put in the filter the name of the property, it doesn't print nothing and doesn't filter the table either. – Progs Sep 02 '15 at 16:00