angular-ui/ui-grid

Discussions concerning ui-grid 4.0 development. See the tutorials: http://ui-grid.info/docs/#/tutorial

Jeff Ackley

@jaackley

That's the first route I went down

They need it to be dynamic - 'they want it when they want it'

Ghost

@ghost~5c363bf4d73408ce4fb42605

U tried . I am proud of u

😆

Oh tough customers

Jeff Ackley

@jaackley

both external and internal customers being tough on this one

Ghost

@ghost~5c363bf4d73408ce4fb42605

Oh well u cant push a rope.

Jeff Ackley

@jaackley

So I think I just found what I was looking for

gridMenuCustomItems: [
      {
        title: 'Rotate Grid',
        action: function ($event) {
          this.grid.element.toggleClass('rotated');
        },
        order: 210
      }
    ],

Ghost

@ghost~5c363bf4d73408ce4fb42605

@jaackley for xml export?

w2olves

@w2olves

Seems like right-click="rightClick($event)" no longer works ? Any ideas or work arounds ?
My code is like this

<div ui-grid="gridOptions" ui-grid-pagination class="grid clsVendorsGrid" ui-grid-selection ui-grid-exporter right-click="rightClick($event)" context-menu="menuOptions" context-menu-class="custom_class"></div>
$scope.gridApi.selection.clearSelectedRows();
var element = angular.element(event.toElement);
Event is undefined ?

Jeff Grossman

@jeffgrossman3000

@w2olves I think the left side of right-click="rightClick($event)" needs to be (contextmenu).

w2olves

@w2olves

@jeffgrossman3000 Could you please elaborate this just a bit ? This is using version 3.0.2 of the UI grid

Maybe I am asking the wrong question, I simply need the ID property when I right click on this grid, it was working till now with the above code but its not working any longer, is there a new way of doing this ?

Jeff Grossman

@jeffgrossman3000

@w2olves Nothing here has changed and your issue isn't in the grid (it's in Angular). You are probably seeing a browser issue, or possibly some kind of deprecation of features. This plunkr works, for example: http://embed.plnkr.co/VJE4G458aOavZAedsjFW/

As to what I wrote yesterday, there is no "right-click" event. It is called "contextmenu" or some variant of it that is suited to the local syntax.

What version of Angular are you using? What browsers?

balulvrs

@balulvrs

Hi team does UI - grid support angular 11?

Jeff Grossman

@jeffgrossman3000

@balulvrs The latest grid supports Angular 1.4 - 1.8.

Jonathan Sanchez

@JxJonathan_twitter

On the homepage, I see this Complex grid that has a bolded Total. How does one get that row implemented into their grid?

Jeff Grossman

@jeffgrossman3000

@JxJonathan_twitter GridOptions.showGridFooter

@JxJonathan_twitter Note that you can 'view source' of the homepage to see the entire definition of the grid.

Seeyko (tom.andrieu)

@Seeyko

Hi everyone, in the scope of my application i would like to add an options to the grid that will force the multi-selection when using the rowHeaderSelection button.
With this options enable, clicking on the row header will have the same effect has a Ctrl+click with modifierKeysToMultiSelect
Is it the good place to ask if this feature fits the scope and aims of the projects ?

Jeff Grossman

@jeffgrossman3000

Does the first demo grid show what you want? (If you click on the check-mark next to the word "Id" then all the rows become checked.) http://ui-grid.info/docs/#!/tutorial/Tutorial:%20210%20Selection

Seeyko (tom.andrieu)

@Seeyko

No because the full row selection and the rowHeaderSelection button work the same way. Here a gif showing what i'll want: https://imgur.com/a/glRABMs

Mike

@mike2011lp

Hey guys, I'm having a hard time trying to figure out what is causing this behavior on a grid implementing treeview and selection. https://gifyu.com/image/Gi3k. (I select a parent record, then scroll up and down, and the selection changed. It is not happening always). Maybe someone have experienced something like this? If some ideas of where to start checking, it would be really appreciated.

Jeff Grossman

@jeffgrossman3000

@Seeyko Thanks. To me, that looks like multiselect:true on the check column and multiselect:false + modkeys:true on the other columns. I don't know how you'd do that because selection is a whole-grid setting, not a per-column setting. You might try adding a cell class to the other columns to munge the grid state, i.e., use the api to deselect all rows then select only the current row. But dealing with the modkeys will be no fun this way. Putting on my DX hat, I'd ask what Use Case are you supporting with this complex behavior?

Jeff Grossman

@jeffgrossman3000

@mike2011lp Sorry, but I've never used the tree features of the grid. However, I'll take a moment to lean in to my ignorance... Could this just be a paint or refresh problem? Can you ask the grid which rows are selected to see whether it matches what is shown? Or, coming from the other side, arbitrarily throw a notifyDataChange() and see whether the refresh looks different?

Mike

@mike2011lp

Sure @jeffgrossman3000 I tried getting current selected data, while I see the inconsistency on the rendered content. The selected records are ok, it seems like something is happening while painting the grid on scrolling. Check the screenshot https://ibb.co/VYGvbH7. It seems like the records are selected but the checkbox on the row (from the select plugin) is not updated correctly

Mike

@mike2011lp

I applied this manually after the issue was ocurring: gridApi.core.notifyDataChange( uiGridConstants.dataChange.ALL) But no changes so far, the checkboxes are not painted consistently

Jeff Grossman

@jeffgrossman3000

I tried to reproduce your problem, @mike2011lp , using one of the sample grids that has a couple 10,000 rows in it. Never lost a selection for me. So, it may be specific to trees or some interaction they have with the Selection plugin. The fact that the right rows are still selected, just not painted correctly, suggests that the plugin has somehow lost track of how many rows are visible in the viewport. Out of my depth to debug, I'm sorry, so I hope someone else can chime in.

Seeyko (tom.andrieu)

@Seeyko

@jeffgrossman3000 The Use Case of our application. We had a custom table and selection system that work this way. It was really crappy and dev a long time ago so i've push the decision in my team to stop using our hacky table and start using a well develop table (aka ui-grid)
So i'm just trying to replicate our previous features within the ui-grid.
If some users doesn't know the modkey + click for multi select we want them to have a way of multi selection. If they make the effort to click on the column header instead of clicking on the full row. It should be a different action (single selection on full row and multi selection on column header or on full row + modkey)
Is that clearer ?

Let me now if you want to tchat about this in another place or if it doesn't aim the project scope

AhsanNissar

@AhsanNissar

Hi guys,
I am new to this group and I joined this group for seeking help regarding angular-ui grid. I have no prior experiene with this package but I have used angular datatables and angular material. the reasson for adopting this package is that the current packages that I am using aren't allowing to implement everything that I need in a table and therefore I thought maybe this package might help. I need a minor help to start with this package and that is please go through these requirements that I have listed and tell me please if these all can be implemented via the angular ui-grid or not? I am studying it right now but its gonna take some time so thought maybe I just seek a little help from you guys.

Screenshot 2021-09-05 at 12.07.54 AM.png

Kirti-Chandra-Shahi

@Kirti-Chandra-Shahi

I am using ui-grid in one of my project. Here I need to export the data of grid. When I click on drop down menu, export options (for pdf and csv) are getting displayed. But clicking on those options nothing happens. Not even an error in console! What makes it more tricky that the older deployments of same project works fine.

Jeff Grossman

@jeffgrossman3000

@Seeyko Thank you. I understand. I think you cannot have all three of behaviors ([1] single selection on full row, [2] multi selection on column header or [3] on full row + modkey). I think you can have any two, though you should definitely double-check ((to get 1+2 you need a cell edit function on the row, to get 2+3 you need to disallow focus, etc.). It might be simpler for the user to enable multi-select + modkey and provide a "Clear All" button if they get in trouble.

Jeff Grossman

@jeffgrossman3000

@Kirti-Chandra-Shahi Still works for me. Implies something is funny with your recent release.

@AhsanNissar Off the top of my head: fixed columns yes, viewport size yes, filters yes, drag yes, resize yes, pix you write a cell class, dunno what the rest of your things mean. You might play around with http://ui-grid.info/docs/#!/tutorial/Tutorial:%20401%20All%20Features

arj060892

@arj060892

I'm trying to figure out a way to show warning message with red borders on a text field which is inside ui-grid based on some custom validation rule
But not able to find any doc or reference
If someone can point me to any reference how can implement it that will be really helpful

Jeff Grossman

@jeffgrossman3000

@arj060892 Write a cell class that invokes a CSS class based on its value (or the value of something else). http://ui-grid.info/docs/#!/api/ui.grid.class:GridOptions.columnDef

Mahdi3989

@Mahdi3989

how can I to get better in js?

Kirti-Chandra-Shahi

@Kirti-Chandra-Shahi

@jeffgrossman3000, I don't think it is the issue of wrong deployment. We copied the published folder from Older deployment, & deployed it in our test server. But it didn't resolve the issue. Everything else works fine, but not the export feature.

Jeff Grossman

@jeffgrossman3000

@Kirti-Chandra-Shahi Write permissions to the folder by the account running the program?

Francois Jalbert

@FranJal_gitlab

Hi everyone, Does anyone know how to flip/transpose UI Grid tables vertically? I've been looking around on Internet, no luck so far. Thanks, Franky

edgehome

@edgehome

Hello All, does ui-grid have drag-to-copy functionality like in excel how you can drag down the bottom right corner of a cell and it copies the data to lower rows?
and is there more advanced filtering like greater than/less than; before / after; selecting multiple vales with check boxes; contains / does not contain, etc.? like:

Jeff Grossman

@jeffgrossman3000

@FranJal_gitlab I don't know of a built-in function to invert a grid. You can code it up yourself fairly easily: declare a hidden column with a sort on it and leave it empty; when you want to invert the grid, assign numbers into the hidden column and throw a notify event.

Jeff Grossman

@jeffgrossman3000

@edgehome I have never seen the drag-copy functionality, but then again, I never looked for it. I imagine it is not built-in. As to fancy filtering, that is in the tutorial in a couple spots, most notably http://ui-grid.info/docs/#!/tutorial/Tutorial:%20401%20All%20Features and http://ui-grid.info/docs/#!/tutorial/Tutorial:%20306%20Custom%20Filters

edgehome

@edgehome

@jeffgrossman3000 Thank you!

Where communities thrive

People

Repo info

Activity