在I需求网格中排成一排我需要8

问题描述 投票:1回答:1

我有一个Vaadin 8 Grid组件。

Grid<ErweitertePdbSegmentInkassoTyp> inkassoGrid = new Grid<>();
inkassoGrid.setSelectionMod(SelectionMode.SINGLE);

当我在这个网格中选择一行时,我有一个监听器

inkassoGrid.addItemClickListener(event -> {
    event.getItem();
}); 

event.getItem();我有选定的行。不幸的是,当我想取消选择行时,我仍然在event.getItem()中有所选行。谁能帮助我如何知道所选行是否已被选中?

vaadin vaadin8
1个回答
3
投票

使用Vaadin 8.5.1和this question作为启动点,您可以使用选择监听器来满足您的需求:

  • 当用户选择联系人时,显示显示详细信息的表单。
  • 更改联系人后,将更新显示的详细信息
  • 如果未选择任何联系人,则隐藏表单

魔术发生在createGrid方法中,更具体地说是在值更改侦听器中:

    contactGrid.asSingleSelect().addValueChangeListener(event -> {
        // show or hide the form depending on the selection
        contactForm.setVisible(event.getValue() != null);
        // update displayed data
        contactForm.setClient(event.getValue());
    });

完整代码:

import com.vaadin.data.Binder;
import com.vaadin.ui.*;
import com.vaadin.ui.themes.ValoTheme;

import java.util.Arrays;
import java.util.List;

public class GridWithDetailsForm extends HorizontalLayout {
    /**
     * Simulate some data
     */
    private List<Client> clients = Arrays.asList(
            new Client("Sernie", "A", "123 Test St.", "[email protected]", "555-555-5554"),
            new Client("Ernie", "B", "123 Test St.", "[email protected]", "555-555-5555"),
            new Client("Bernie", "C", "123 Test St.", "[email protected]", "555-555-5556"),
            new Client("Ayy", "Lmao", "123 Test St.", "[email protected]", "555-555-5557"),
            new Client("Dax", "E", "123 Test St.", "[email protected]", "555-555-5558"),
            new Client("Avorion", "F", "123 Test St.", "[email protected]", "555-555-5559"),
            new Client("Xanion", "G", "123 Test St.", "[email protected]", "555-555-5560"),
            new Client("Trinium", "H", "123 Test St.", "[email protected]", "555-555-5561"),
            new Client("Naonite", "I", "123 Test St.", "[email protected]", "555-555-5562"),
            new Client("Squillium", "J", "123 Test St.", "[email protected]", "555-555-5563"),
            new Client("Picard", "K", "123 Test St.", "[email protected]", "555-555-5564"),
            new Client("Richard", "L", "123 Test St.", "[email protected]", "555-555-5565"),
            new Client("Rickard", "M", "123 Test St.", "[email protected]", "555-555-5566"),
            new Client("Bobby", "N", "123 Test St.", "[email protected]", "555-555-5567"),
            new Client("Bob", "O", "123 Test St.", "[email protected]", "555-555-5568"),
            new Client("Ron", "P", "123 Test St.", "[email protected]", "555-555-5569"),
            new Client("Bill", "Q", "123 Test St.", "[email protected]", "555-555-5570"),
            new Client("Greg", "R", "123 Test St.", "[email protected]", "555-555-5571"),
            new Client("Juan", "S", "123 Test St.", "[email protected]", "555-555-5572"),
            new Client("Squidward", "T", "123 Test St.", "[email protected]", "555-555-5573"));


    public GridWithDetailsForm() {
        ContactForm contactForm = createContactForm();
        VerticalLayout actionBarAndGrid = createActionBarAndGrid(contactForm);
        addComponents(actionBarAndGrid, contactForm);
    }

    private VerticalLayout createActionBarAndGrid(ContactForm contactForm) {
        HorizontalLayout actionBar = createTopBar(contactForm);
        Grid<Client> contactGrid = createGrid(contactForm);

        VerticalLayout actionBadAndGrid = new VerticalLayout(actionBar, contactGrid);
        actionBadAndGrid.setSizeFull();
        actionBadAndGrid.setExpandRatio(contactGrid, 1);
        return actionBadAndGrid;
    }

    private ContactForm createContactForm() {
        ContactForm contactForm = new ContactForm();
        contactForm.setVisible(false);
        return contactForm;
    }

    private HorizontalLayout createTopBar(ContactForm contactForm) {
        TextField filter = new TextField();
        filter.setPlaceholder("Search clients...");

        Button addContactButton = new Button("New Client");
        addContactButton.addStyleName(ValoTheme.BUTTON_PRIMARY);
        addContactButton.addClickListener(event -> {
            contactForm.setVisible(true);
            contactForm.setClient(new Client());
        });

        HorizontalLayout actionBar = new HorizontalLayout(filter, addContactButton);
        actionBar.setWidth("100%");
        filter.setWidth("100%");
        actionBar.setExpandRatio(filter, 1);
        return actionBar;
    }

    private Grid<Client> createGrid(ContactForm contactForm) {
        Grid<Client> contactGrid = new Grid<>(Client.class);
        contactGrid.setSelectionMode(Grid.SelectionMode.SINGLE);
        contactGrid.setColumns("firstName", "lastName");
        contactGrid.setItems(clients);

        contactGrid.asSingleSelect().addValueChangeListener(event -> {
            // show or hide the form depending on the selection
            contactForm.setVisible(event.getValue() != null);
            // update displayed data
            contactForm.setClient(event.getValue());
        });
        return contactGrid;
    }

    /**
     * Contact details form
     */
    public static class ContactForm extends FormLayout {
        private Button save, delete, cancel;
        private TextField firstName, lastName, email, address, phoneNumber;
        private Binder<Client> binder = new Binder<>(Client.class);

        public ContactForm() {
            save = new Button("Save");
            delete = new Button("Delete");
            cancel = new Button("Cancel");

            firstName = new TextField();
            firstName.setPlaceholder("First Name");

            lastName = new TextField();
            lastName.setPlaceholder("Last Name");

            email = new TextField();
            email.setPlaceholder("Email Address");

            address = new TextField();
            address.setPlaceholder("Address");

            phoneNumber = new TextField();
            phoneNumber.setPlaceholder("Phone Number");

            HorizontalLayout actions = new HorizontalLayout(save, delete, cancel);
            actions.setSpacing(true);

            addComponents(actions, firstName, lastName, email, address, phoneNumber);
            setSizeUndefined();
            binder.bindInstanceFields(this);
        }

        public void setClient(Client client) {
            binder.setBean(client);
        }
    }

    public static class Client {
        private String firstName;
        private String lastName;
        private String address;
        private String email;
        private String phoneNumber;

        public Client(String firstName, String lastName, String address, String email, String phoneNumber) {
            this.firstName = firstName;
            this.lastName = lastName;
            this.address = address;
            this.email = email;
            this.phoneNumber = phoneNumber;
        }

        public Client() {

        }

        public String getFirstName() {
            return firstName;
        }

        public String getLastName() {
            return lastName;
        }

        public String getAddress() {
            return address;
        }

        public String getEmail() {
            return email;
        }

        public String getPhoneNumber() {
            return phoneNumber;
        }
    }
}

结果:Show user details on selection

© www.soinside.com 2019 - 2024. All rights reserved.