Coder Social home page Coder Social logo

pagedtable's Introduction

Published on Vaadin  Directory Stars on Vaadin Directory

Paged Table

This is the Vaadin 8 PagedTable in compatibility mode, for migrating from Vaadin 7 to Vaadin 8 projects. When you have migrated, I suggest you switch from Table to Grid. GridExtensionPack Add-on provides a Paged Container and that does similar things to Grid as this addon does to Table.

Paged Table

Maven Dependency

<dependency>
   <groupId>org.vaadin.addons</groupId>
   <artifactId>pagedtable</artifactId>
   <version>0.7.0</version>
</dependency>

Simple Example

public class PagedtableExample extends UI {

    @Override
    protected void init(final VaadinRequest request) {
        PagedTable table = new PagedTable("PagedTable Example");
        ControlsLayout controls = table.createControls();

        BeanItemContainer container = new BeanItemContainer(User.class);
        table.setContainerDataSource(container);

        layout.addComponent(table);
        layout.addComponent(controls);
        setContent(layout);
    }
}

How to localize or change navigation labels

When you create a new instance of PagedTable then you should create controls layout by using createControls() method. createControls() method returns instance of ControlLayout class. You can do the following then.

ControlsLayout controls = table.createControls();

controls.getItemsPerPageLabel().setValue("Items");
controls.getBtnFirst().setCaption("First");
controls.getBtnLast().setCaption("Last");
controls.getBtnNext().setCaption("Next");
controls.getBtnPrevious().setCaption("Previous");
controls.getPageLabel().setValue("Current:");

This is how the paged table is going to look like. Paged Table customized

pagedtable's People

Contributors

ansku avatar binbalenci avatar christoph-frick avatar ondrej-kvasnovsky avatar peppe avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

pagedtable's Issues

IE8: Table row count sometimes wrong.

Sometimes when opening the view the table's height matches something that would fit ~50 objects, while only the 25 rows (as expected) is rendered. This means that the table is way larger than what it should have to be.

The problem fixes itself after a little clicking, and is not directly reproducible after a restartApplication. Cause unknown.

PagedTable Dymanic Row Insert

I am using PagedTable control and i am facing problem in dynamically adding row in the Table. When I add row dynamically, it is not reflected in the table UI, I have to either change the Items per Row (int the UI) or click on the column header to see the inserted row in the PagedTable.

I am using PagedTable 0.6.3 and my application is deployed inside JBOSS AS 7.0.1 container.

Here is my code:

private void initUI()
{
final Action ACTION_ADD = new Action("Add");
final Action ACTION_EDIT = new Action("Edit");
final Action ACTION_CANCEL = new Action("Cancel");

final Action[] SELECT_MENU_ACTIONS = new Action[] { ACTION_ADD, ACTION_EDIT,ACTION_CANCEL};
final Action[] NULL_MENU_ACTIONS = new Action[] { ACTION_ADD, ACTION_CANCEL};

final PagedTable table = new PagedTable("");
table.setWidth("100%");
table.setSelectable(true);
table.setMultiSelect(false);
table.setImmediate(true); // react at once when something is selected

table.setContainerDataSource(getDSStructure());
table.setNullSelectionAllowed(false);
table.setColumnCollapsingAllowed(true);

// turn on column reordering and collapsing
table.setColumnReorderingAllowed(true);
table.setColumnCollapsingAllowed(true);

// set column headers
table.setColumnHeaders(new String[] {"ID","Name", "Short Name","Satus","ROD"});
table.setVisibleColumns(new Object[] {"id", "name","shortName", "status","rod"});

table.addActionHandler(new Action.Handler()
{
public Action[] getActions(Object target, Object sender)
{
Item selectedItem = table.getContainerDataSource().getItem(target);

if(selectedItem == null)
return NULL_MENU_ACTIONS;
else
{
return SELECT_MENU_ACTIONS;
}
}

public void handleAction(Action action, Object sender, Object target)
{
// TODO Auto-generated method stub
if (ACTION_ADD == action)
{
try
{
showAddForm(table); // Takes input and inset a new row in the PagedTable
}catch(Exception ex)
{
getWindow().showNotification(
"Error!", ex.getMessage(),
Notification.TYPE_ERROR_MESSAGE);
}
return;
}
else if (ACTION_EDIT == action)
{
g_selectedItem = table.getContainerDataSource().getItem(target);
if(g_selectedItem == null)
return;

// showEditForm();
return;
}

}
});

setWidth("100%");
loadTableRecords(table.getContainerDataSource());
addComponent(table);
addComponent(table.createControls());
table.setPageLength(5); // Call this method only after calling table.createControls();

}

private IndexedContainer getDSStructure()
{
IndexedContainer container = new IndexedContainer();

container.addContainerProperty("id", String.class,null);
container.addContainerProperty("name", String.class,null);
container.addContainerProperty("shortName", String.class,null);
container.addContainerProperty("status", String.class,null);
container.addContainerProperty("rod", String.class,null);

return container;
}

private void loadTableRecords(Indexed container ) throws Exception
{
Listlist = application.getNBBean().readAll();
for(int i=0;i<list.size();i++)
{
addRow(container, list.get(i));
}
}

private Item addRow(Indexed container, NBPojo data)
{
SimpleDateFormat df = new SimpleDateFormat ("dd-MM-yyyy hh:mm:ss aa");

Item item = container.addItem(data.getID());
item.getItemProperty("id").setValue(data.getID());
item.getItemProperty("name").setValue(data.getName());
item.getItemProperty("shortName").setValue(data.getShortName());
item.getItemProperty("status").setValue(data.getFriendlyStatus());
item.getItemProperty("rod").setValue( df.format(data.getRod()));

return item;
}

finally I am displaying a Window when user right clicks and chooses Add menu item and inside the form I am capturing data to be displayed in the PagedTable

showAddForm(final PagedTable table)
{
...
...
...

public void buttonClick(ClickEvent event)
{

try
{
frm.commit();
}catch(Exception ex)
{
return;
}

try
{
long id;
String name;
String shortName;
String status;

id = Long.parseLong((String)((TextField)frm.getField("id")).getValue());
name = (String)((TextField)frm.getField("name")).getValue();
shortName = (String)((TextField)frm.getField("shortName")).getValue();

if(((String)cbStatus.getValue()).compareTo("Up") == 0)
{
status = "U";
}
else if(((String)cbStatus.getValue()).compareTo("Down") == 0)
{
status = "D";
}
else if(((String)cbStatus.getValue()).compareTo("Inactive") == 0)
{
status = "I";
}
else
{
throw new Exception("Invalid Status [" + (String)cbStatus.getValue() + "]");
}

NBPojo dataObject = addUser(id, name, shortName, status); // Insert into Database

Item item = addRow(table.getContainerDataSource(), dataObject); // Insert into PagedTable - NOT DISPLAYED
//table.setCurrentPage(table.getCurrentPage()); // Refresh Table with added Item
((Window) wnd.getParent()).removeWindow(wnd);

}catch(DuplicateEntityException dee)
{
dee.printStackTrace();
getWindow().showNotification(
"Duplicate!", dee.getMessage(),
Notification.TYPE_ERROR_MESSAGE);

}catch(Exception ex)
{
ex.printStackTrace();
getWindow().showNotification(
"Error!", ex.getMessage(),
Notification.TYPE_ERROR_MESSAGE);

}
}
});
}

Am I doing anything Wrong! or is there any workaround ?

Paged Table throws Exception "A connector should not be marked as dirty while a response is being written."

Am getting this exception frequently when user clicks inside the table multiple times.

java.lang.IllegalStateException: A connector should not be marked as dirty while a response is being written.
at com.vaadin.ui.ConnectorTracker.markDirty(ConnectorTracker.java:346)
at com.vaadin.server.AbstractClientConnector.markAsDirty(AbstractClientConnector.java:139)
at com.vaadin.server.AbstractClientConnector.attach(AbstractClientConnector.java:597)
at com.vaadin.ui.AbstractComponent.attach(AbstractComponent.java:554)
at com.vaadin.server.AbstractClientConnector.setParent(AbstractClientConnector.java:586)
at com.vaadin.ui.AbstractComponent.setParent(AbstractComponent.java:457)
at com.vaadin.ui.Table.registerComponent(Table.java:2350)
at com.vaadin.ui.Table.parseItemIdToCells(Table.java:2337)
at com.vaadin.ui.Table.getVisibleCellsNoCache(Table.java:2147)
at com.vaadin.ui.Table.refreshRenderedCells(Table.java:1668)
at com.vaadin.ui.Table.refreshRowCache(Table.java:2613)
at com.vaadin.ui.Table.setPageLength(Table.java:1027)
at com.jensjansson.pagedtable.PagedTable.getPageLength(PagedTable.java:65)
at com.vaadin.ui.Table.paintTableAttributes(Table.java:3421)
at com.vaadin.ui.Table.paintContent(Table.java:3183)

Support setHeight()

Only setPagedLength can be used now, as setHeight adds half rows to the pagelength and there is also a tiny scrollable scroll bar when setHeight is used.

Changing this requires client side changes. Best strategy for that is still not decided.

Items per page drop down click shows multiple vetical bars

Hi,

When I click on the down arrow on the Items per page drop down, I can see around 29 vertical bamboo like bars displayed below the Items per page drop down control. I am using 0.6.3 version of pagedtable add on in JBoss 5.1 in a Liferay Portal enviornment.


Closed the issue as this does not seem to be related to this add on.


Validator in currentPageTextField v0.6.5

Adding new IntegerRangeValidator(
"Wrong page number", 1, getTotalAmountOfPages()) during initialization in #createControls() will not be updated when user changes itemsPerPage drop down.

Resized table has wrong pageLength

If user resizes a PagedTable, in current vaadin implementation (7.2.6) the pageLength property is being changed not over setter (setPageLength) but directly. Therefore the PagedTable doesn't know about this change.

There are two possible ways to fix it.

  1. The risky one. The property is being updated in Table.changeVariables() method. We can override this method and there call the setter. However there is no warranty there will be no new direct property sets in up coming vaadin releases. Therefore it is risky.

  2. The inconsistent one. We can manipulte the getter. We can override the getPageLengh() method in the PagedTable as following:

    @OverRide
    public int getPageLength() {
    return null == container ? super.getPageLength() :
    container.getPageLength();
    }

And use it everywhere the pageLength is needed in the PagedTable class (it is so already)
So, the pageLength of the container will be used and it will differ(!) from the pageLength of the Table class.

Please check it.

Container filter does not work

If I add a container filter , the contents of the pagedtable does not change to reflect the change in filter values unless you click on the table header where as for a normal table the change is reflected immediately.

Make "Items per page" optional

Hi,

it would be nice if we could hide the ComboBox ("Items per page").
In some Panels we do not have enough space for more entry in our PagedTable.

thanks.

Filterable PagedTable

Hi,

I am trying to apply filters to the PagedDataContainer and I get the following exception:

com.jensjansson.pagedtable.PagedTableContainer cannot be cast to com.vaadin.data.Container$Filterable

It seems the PagedDataContainer does not implement Filterable interface so that the data in container could be filtered. It would be nice if your class had such capability.

Table returns wrong pageLenght() when click next page

Hi,
I have a problen with pageLenght of Table class.
When I run the application, the value of pageLength in Table class is 25 by default.
I change pageLength to 10 and TablePaged shows << < 1 / 101 > >>
If I click next Page TablePaged shows << < 2 / 112 > >>, because the pageLength in Table is now 9.

Please, could you check this trouble or tell me how to fix it????.

Thanks in regards.

Add i18n support

Hi,

we need to translate all messages.
At the moment all labels are hard coded.

thanks.

Test out how PagedTable works on Internet Explorer.

There have been issues reported that PagedTable has some problems on Internet Explorer. Find these and try to fix it.

The issues:

  • First page does not contain the right amount of rows on IE8
  • The window does some funky scrolling when selecting a row when table height is bigger than window height.

interface PageChangeListener package-visible

interface PageChangeListener should be as visible as addListener(PageChangeListener ) and removeListener(PageChangeListener ). (or viceversa)
I would like to get notified whenever a page changed, as well as when a page changes its size, but that is another issue.
Thanks anyway for this fine control.

PageTable with scroller shows wrong rows

If the height is set a scroller within the table appears.
If user scrolls down and changes page, then wrong rows are shown. Moreover, at the begining of page some of rows are shown once again.

This happens because the initial offset is ignored. Instead of it the internal offset of the PagedTableContainer is used, which is page related. Right would be to use both offsets.

Here is a possible correction for this problem:

@Override
public List<?> getItemIds(final int startIndex, final int numberOfItems) {
    return container.getItemIds(this.startIndex, numberOfItems);
}

-->

@Override
public List<?> getItemIds(final int startIndex, final int numberOfItems) {
    return container.getItemIds(this.startIndex + startIndex, numberOfItems);
}

Please check and commit.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.