I am using tabulator to build a table builder that my users can modify how the table looks(columns, pagination, data etc).
I have a right-click menu on the headers with options to edit the column title, or delete a column.
It all works fine and is how I want it the first time around.
When the user modifies how it looks, for example, changing from no pagination to pagination, I am destroying the table and rebuilding it... like this...
this.element.empty();
this.table.destroy();
this.table = null;
this.initTable();
Everything gets drawn right, with all the correct data, however I can no longer use the right click menu, it just does nothing and I get an error in the console..
tabulator.min.js:10 Uncaught TypeError: e.action is not a function
at HTMLDivElement.<anonymous>
I am guessing the problem is something to do with event listeners? Am I destroying the table in the best way?
Any advice would be appreciated.
I am using tabulator v4.8.4 - I cannot go to v5 right now as it's a substantial change.
You will need to upgrade to Tabulator 5.1 there were issues with the menu library in that version that did not properly clear out references to previous menus when the table was destroyed
Related
I need one help related to view panel column headers. I am using view panel to pull the data from SQL using JDBC Connection manager and displaying in view panel control using Xpages. I am displaying 500 rows at a time and when users trying to scroll the data the column headers are going scrolling up. So, now I need to fix all view column header should be fixed when the rows are scrolling up/down. Can anybody help me regarding this?
You can add that capability to an existing viewPanel with the jQuery.Thead plugin. There are only 2 steps involved:
Download the library and add it to your XPage/ application.
Activate the plugin for your viewPanel (or repeat):
x$("#{id:viewPanel1}").floatThead({});
(the x$ function comes from the ExtLib Bootstrap theme)
I've put together a small demo here:
http://bootstrap4xpages.com/bs4xp/demos.nsf/fixedHeaders.xsp
May be have a look at DataTables, for details to implement this in XPages see the blogs ofOliver Busse, http://oliverbusse.notesx.net/hp.nsf/blogpost.xsp?documentId=D5E
The easiest way will be to add viewStyle to your viewPanel and set it to 100%.
I hope this helps!
I'm new to Domino Designer. I'm trying to modify an existing application which is running on a remote server. I create a blank xPage and view in browser and it works. I add a label and view in browser and it works. I add a combo box and setup a data source for my xPage. The data source is in the current application and I'm using a view. I setup my combo to point to that data source and specify BindTo value. I view it in browser and I get Error 500 "HTTP Web Server: Command Not Handled Exception" I can open the view that I've used and see all the data in the view. I can even add, edit, and delete from the view.
Ideas... Thnxs in advance.
Additional Info. I've added a "View" from "Container Controls" and used the same data source and the same view and it also works in the browser.
The error being printed is:
javax.faces.el.PropertyNotFoundException: Error getting property 'CompanyName' from bean of type lotus.domino.local.View
com.sun.faces.el.PropertyResolverImpl.getValue(PropertyResolverImpl.java:119)
com.ibm.xsp.el.PropertyResolverImpl.getValue(PropertyResolverImpl.java:144)
com.sun.faces.el.impl.ArraySuffix.evaluate(ArraySuffix.java:182)
com.sun.faces.el.impl.ComplexValue.evaluate(ComplexValue.java:163)
com.sun.faces.el.impl.ExpressionEvaluatorImpl.evaluate(ExpressionEvaluatorImpl.java:257)
com.sun.faces.el.ValueBindingImpl.getValue(ValueBindingImpl.java:150) ....
This was already answered in the comments, but I want to write a better answer.
The problem in this case is that a view data source is being used for editing a document. Directly, this is not a possibility, though there are a few great ways to get around this. The first way, and my favorite, is to use an inline form. I think the Extension Library Demo database offers a few great examples of how to go about doing this. One way is to use a tooltip dialog. Another way is an inline form. A repeater is used and for every row in the view, a hidden panel can be made which contains the document data source and all field which are required to be changeable. By clicking on a button or link, the panel is made visible. This is my favorite variant because it is simple, quick, and generally looks great.
Another way to go about this is to have a view data source only, but use scripts to retrieve the document and set the values in the background and then save and release. It all depends on what you are trying to achieve.
My main recommendation is to look at the ExtLib demo and take a look at what they are doing there.
I have a problem that have me stumped.
I have been searching for a solution, but haven't found a working one yet. The solutions I seen introduces other issues.
Here is the scenario:
I have a frameset with two frames: 'Navigator' and 'Main'.
In the 'Navigator' frame I display a form called 'Navigator'. It contains an outline, to display a menu.
In the 'Main' frame I display the view selected by the user in the navigator.
So this is a very traditional Notes client application.
I now want to add a checkbox at the top of the view (in the action bar), allowing the user to filter the view by his/her own name. I use #SetViewInfo for this, and it all works perfect.
The issue is when the user switch views. The #SetViewInfo filter stays active when switching to a different view, so after some searching I found some solutions:
In http://www-01.ibm.com/support/docview.wss?uid=swg21204481 IBM suggests to put the following code in the QuerySave event:
#SetViewInfo([SetViewFilter]; temp ; 0 ;1)
When I am switching view or closing the view, I get the error message "Cannot execute the specified command".
In http://www-10.lotus.com/ldd/bpmpblog.nsf/dx/using-setviewinfo-in-a-notes-client-application-to-create-a-user-specific-view Andre Guirard suggests to put the following code in the QuerySave event:
#SetTargetFrame("frameName");
#UpdateFormulaContext;
#Command([OpenView]; #Subset(#ViewTitle; -1));
#SetViewInfo([SetViewFilter]; ""; "columnName"; 1)
I modify this to match my frame name and the programatic name of the first column in my view:
#SetTargetFrame("Main");
#UpdateFormulaContext;
#Command([OpenView]; #Subset(#ViewTitle; -1));
#SetViewInfo([SetViewFilter]; ""; "Adjuster"; 1)
This works perfectly when switching between view. But when I close the application while I am in this particular filtered view, the application is re-opened automatically. This happens no matter if the filter is enabled or not when closing the view.
However, when the view repopens, the frameset is not reloaded, it is just the view with the built-in view navigator to the left.
I finally got this to work by (in the built-in view navigator) selecting another view that the one where I filter data. This fixed the issue for a while, but then it starts again, and the filtered view is active in the navigator.
Obviously it is the OpenView command that is causing this, but if I remove just that line, I get the "Cannot execute the specified command" error again.
Any suggestions/pointers? I am using Notes 8.5.3 running on Windows 7 Professional.
This question can also be found in the IBM developerWorks forum for Notes 8.5:
http://www-10.lotus.com/ldd/nd85forum.nsf/DateAllThreadedWeb/08c73910571306c485257b2b0061ef91
First thing, I would suggest to make sure your view frame is always called "NotesView". You will have much less compatibility issues if you do this.
Secondly, I presume when you say you put it in the QuerySave event you really mean the QueryClose event? Views do not have a QuerySave event.
Thirdly, I find the #UpdateFormulaContext line is not needed. This is what I have in my view QueryClose...
#SetTargetFrame("NotesView");
#Command([OpenView]; #Subset(#ViewTitle; -1));
#SetViewInfo([SetViewFilter]; ""; "<programmaticColumnName>"; 1)
And I can close the app while in the view without any problems.
Background: Xpage with multiple data sources. Each row of tabbed table contains an edit panel bound to a different data source than the main page. Each page contains a table to enter new documents. These documents are children of the main document. There is a view control that shows the user created documents immediately. The button in the table saves the document in addition to adding some control fields. It does a partial refresh of the editPanel.
Recently I added validation to the fields in the entry table. I use a function, and prevent updating from anything but the button. I am using Tommy Valand's method from this blog post: http://dontpanic82.blogspot.com/2010/03/xpages-making-validation-behave.html. If I don't use Tommy's method, then the validators fire when switching tabs, and are useless.
All of this works sort of, but I am experiencing the following issues.
1) I have to push the button twice to get the partial refresh to fire. Not only that, but the validation messages to not fire until the button is pushed twice. The first part was still an issue prior to adding the validation.
2) The table values do not clear after the refresh does happen. This used to work prior to adding the validation. The only way to get the values to clear now, is to do a full refresh (F5).
I really just need partial refresh to behave like it should. Any help is greatly appreciated.
I am answering my own question because I think that I might have found out why the partial refresh was acting so flaky. Here is what I did that solved my issues: Each tab had an editPanel. If I make the edit panel do a partial refresh to itself then the buttons on that panel seems to behave as you would expect them to.
When I create a new core control panel, the default in No submission. I do not know whether this issue manifests itself only when using multiple data sources and/or tabbed tables. Hopefully this fix will be of use to someone down the road. It is worth a try if you are having issues with partial refresh working correctly.
I'm working with the rich:pickList and it's working fine. I just need to find a way to disable the remove button at the moment I select an item located in the target list.
I suppose it could be done with JavaScript or JQuery but I have no experience with that.
The most I've done is to get the text of the selected item of the target list, but I would like to obtain the entire object represented by that item. Besides, I have looked for the button in the DOM tree but the button has no id, so I can't figure out how to find the button in order to can give it the right style class to disable it, and how to do this!
Try setting the attribute of rich:pickList removeVisible. This will display/undisplayed the remove button in the component.
Hope this helps.
-cheers