Setting filters in ui-grid doesn't work - angularjs

I am trying to set the filter in ui-grid pragmatically but doesn't seem to work with ranges.
This plunkr shows one of the filters working perfectly (the name). But the age filter populates the input box but doesn't appear to update the grid's filter.
Do I have to manually update the filter?
I have also tried setting the entire filter when the button is clicked by:
$scope.ageColumn.filters=$scope.ageFilter;
but that also doesn't work.
Any idea how to get this to work?

Looks like we need the term to be a string - when it's a number it doesn't work.
$scope.ageColumn.filters[0].term='30';
http://plnkr.co/edit/2TvIqdKYeRuYXUx1bRNo?p=preview
Not sure why that would be the case, so I need to take a look at that.

Related

How To Force Table Filters To Use Input Boxes?

There seems to be a minor bug with the default dropdown filters when you enable filtering, is there a simpler way to force a table to use all input box style filters rather than to implement custom filters for each default drop down.
I think custom filters will solve the issue, but the problem is that doing so for the many tables will probably take far too long.
yes - you get dropdowns for fields where you are adding LOVs to.
But if you will create a duplication of the field (one attribute with LOV, a second attribute - without), you can show inside the table the-attribute-with-LOV, but in filter you will use the-attribute-without-LOV.
You will need to edit the jsff sources yourself.

ExtJs - Is it possible to have a tree with input fields in a leaf?

I'd like to expose the settings of my app to the user in a tree view. There should not be a problem to display. The setting and its value can be displayed as a text node.
Now comes the hard part. I'd like the settings to be editable. When I click on a setting, I want it to be editable, with different fields :
Display a checkbox
Display a textfield to change the value
Display a combobox with valid values
Is there a possiblity to achieve something similar, or do I imagine the impossible here ?
I saw an example which checkboxes, but I'm not sure if it is possible to mix fields.
I'm not asking for code, I just liked to know if someone already tried something similar.
That's exactly what Ext.grid.property.Grid does (minus the checkbox). Since a tree is a gridpanel with a special column, you should be able to mix the two. I would start by porting the propertygrid.
I never tried the the combobox-part, but everything else is definitely possible
All the fields are editable with with the celledit plugin
Hope this helps and I understood your question correctly

How to get ng-grid to hide certain rows

I have an array of objects that I want to show in ng-grid. Each row has a boolean property isVisible. In the ng-grid I want to show only the rows where isVisible is true. The other rows should be completely hidden.
I have tried using a rowTemplate and databinding a ng-show to isVisible. That hides the content of the row, but leaves the actual row in place, showing an empty row.
I have tried using filterOptions, but can't figure out the correct syntax to do such a filtering. I couldn't find any good documentation on how to set it.
I have even tried modifying the gridTemplate in the ng-grid source, by trying to add a filter on ng-repeat=\"row in renderedRows\", but I haven't gotten that to work either.
I guess I could modify the array itself, by temporarily removing rows, but I would prefer not to do it that way, since I have to be able to show the rows again (It is actually an expander that I'm doing, that should hide/show sub-rows)
Try also conditionally setting the height of the row in the template to '0' based on isVisible or use a CSS class with ng-class. Play with the CSS of it until you get the desired effect and then you can use that in your template.
This sounds like the type of thing that would benefit from using height and CSS animations actually so it opens and closes with an animated style. If you have a jsFiddle sample I'd be happy to try and help.
Edit: After looking at how the grid actually lays out it's rows (absolutely positioned) you only really have two options I can think of:
1) Filter the data you are binding to the grid through a function like dataVisible() but keep the full data list internally in the controller so you can show/hide easily
2) Submit a patch to the ng-grid project (or fork it) with the filtering capability you are looking for. Out of the box it doesn't appear to support this scenario.

Grid not updating upon change in model in angularjs

Folks,
I am using ng-grid to display a list of items.
I want to give my users ability to rearrange the rows in the list.
i.e move the rows up and down as they please.
Now,
However when I update the grid data in the backend i.e say change the index of a particular row, that row does not automatically change locations in the front-end.
What am i missing here ?
I have created a plunker to describe the problem
http://plnkr.co/edit/s1hrTSqF2zeZo3Btaln0
The grid doesn't use the index of the array to order it, so even if you are changing it, because the data is still there nothing happens.
What you could do is define an order field and update the value then changing the values as shown in this plukr. The order field you can hide it from the grid if required using columnDefs to explicitly defined which column should be shown.
Regards

Extjs grid Filter

I am filter on a grid and I am trying to run the filter on it. I want o run the filter from code when a user selects a value from a drop down else where in the page.
I see that grid.getFilter('dataIndex').setActive(true) is setting the filter active but i am not sure how to set the value. There is a methid called setValue() but it is a private methos. Is there any way i could do it.
Thanks,
SS
You can filter the grid's store easily..
grid.getStore().filter('field', 'valueToSearchFor');
PagingToolbar may be just what you are looking for. Alternatively, I've come across cases where I could set the filtration params as baseParams and then blow that out when I'm done with it.

Resources