Фокус не выходит из TextField при щелчке мышью в GXT EditorGrid в браузере Chrome

Я создал EditorGrid с использованием GXT 2.2.3. В этой сетке один столбец с TextField в качестве редактора. Мой код выглядит следующим образом:

ColumnConfig checkinTimecolumn=new ColumnConfig();
        checkinTimecolumn.setId("checkinTime");
        checkinTimecolumn.setHeader("Check In Time");
        checkinTimecolumn.setWidth(80);
        checkinTimecolumn.setMenuDisabled(true);
        checkinTimecolumn.setSortable(false);
        checkinTimecolumn.setStyle("width:100%;");
        checkinTimecolumn.setStyle("padding-right:3px;");

        final TextField<String> checkintime = new TextField<String>();
        checkintime.setAllowBlank(true);  
        checkintime.setWidth(15);
        checkintime.addListener(Events.Change, new Listener<BaseEvent>() {

            @Override
            public void handleEvent(BaseEvent be) {

                String prevcheckIntime=ACCCheckBoxModel.getSelectedItem().getCheckinTime();
                String variable = checkintime.getRawValue().trim();
            //  Window.alert("Getting the previous time-->"+prevcheckIntime);

                if(variable != null & !variable.equalsIgnoreCase(""))
                {   
                    if(!variable.matches(REG_EXP))
                    {
                        if(prevcheckIntime!=null){
                            checkintime.setValue(prevcheckIntime);
                    setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                                   checkintime.getRawValue(),
                                    ACCCheckBoxModel.getSelectedItem().getCheckoutDate(),ACCCheckBoxModel.getSelectedItem().getCheckoutTime());
                        }
                        else {
                        checkintime.clear();
                        setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                                null,
                                ACCCheckBoxModel.getSelectedItem().getCheckoutDate(), ACCCheckBoxModel.getSelectedItem().getCheckoutTime());

                        }
                        MsgBox.info("Enter time in hh:mm format");
                            checkintime.focus();
                        return;
                    }
                    String [] a=variable.split(":");
                    if(Integer.parseInt(a[0])>24) {
                        if(prevcheckIntime!=null){
                            checkintime.setValue(prevcheckIntime);
                            setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                                    checkintime.getRawValue(),
                                    ACCCheckBoxModel.getSelectedItem().getCheckoutDate(), ACCCheckBoxModel.getSelectedItem().getCheckoutTime());

                        }
                        else {
                        checkintime.clear();
                        setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                                null,
                                ACCCheckBoxModel.getSelectedItem().getCheckoutDate(), ACCCheckBoxModel.getSelectedItem().getCheckoutTime());

                        }
                        MsgBox.info(variable+" is not a valid time. 00:00 to 23:59 are valid" );
                        checkintime.focus();
                        return;


                    }
                    else{
                        setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                                checkintime.getRawValue(),
                                ACCCheckBoxModel.getSelectedItem().getCheckoutDate(), ACCCheckBoxModel.getSelectedItem().getCheckoutTime());

                    }
                }
                else {
                    setDuration(ACCCheckBoxModel.getSelectedItem().getCheckinDate(), 
                            null,
                            ACCCheckBoxModel.getSelectedItem().getCheckoutDate(), ACCCheckBoxModel.getSelectedItem().getCheckoutTime());
                 }

            }
        });
        checkinTimecolumn.setRenderer(checkinRenderer);
        checkinTimecolumn.setEditor(new CellEditor(checkintime));
        checkinTimecolumn.setAlignment(HorizontalAlignment.LEFT);
        configs.add(checkinTimecolumn);

Теперь проблема в том, что после нажатия на поле checkIntime в столбце CheckInTime фокус не появляется, если я нажимаю на другое место в Gird. Эта проблема возникает только в Chrome. Это хорошо работает в IE и Firefox.

Пожалуйста, предложите, как решить эту проблему.

ОБНОВИТЬ

После нажатия на TextField в EditorGrid

Если щелчок на чем-либо кроме строки с мышью, фокус от TextField не выходит, что является проблемой, и клавиша Tab также не работает на этой сетке.

Css, который я устанавливаю для правильного выравнивания строк и столбцов, работает нормально в IE, но не работает нормально в Chrome и Firefox

1 ответ

Попробуйте сначала с приведенным ниже примером кода, и дайте мне знать, если все еще есть проблемы с этим примером. Это работает нормально для меня во всех браузерах.

Я использую gxt-2.2.3-gwt22.jar.

Образец кода:

public class EXTJSGXT implements EntryPoint {

    private EditorGrid<ModelData> grid;
    private ListStore<ModelData> gridStore;
    private ColumnModel cm;

    @Override
    public void onModuleLoad() {
        grid();
    }

    private void grid() {

        ContentPanel cp = new ContentPanel();
        cp.setSize(450, 150);

        List<ColumnConfig> configs = new ArrayList<ColumnConfig>();

        List<String> eventList = new ArrayList<String>();
        eventList.add("Mark/Modify Attendance");
        eventList.add("Remove Attendance");
        eventList.add("Modify Roster");
        eventList.add("Mark OD");
        eventList.add("Forgot To Checkin");

        final SimpleComboBox<String> eventcombo = new SimpleComboBox<String>();
        eventcombo.setEmptyText("");
        eventcombo.setTriggerAction(TriggerAction.ALL);
        CellEditor eventComboEditor = new CellEditor(eventcombo) {
            public Object preProcessValue(Object value) {
                if (value == null) {
                    return value;
                }
                return eventcombo.findModel(value.toString());
            }

            public Object postProcessValue(Object value) {
                if (value == null) {
                    return value;
                }
                return ((ModelData) value).get("value");
            }
        };
        eventcombo.setForceSelection(true);
        eventcombo.setEmptyText("");
        eventcombo.setTriggerAction(TriggerAction.ALL);
        eventcombo.add(eventList);

        ColumnConfig column = new ColumnConfig();
        column.setId("event");
        column.setHeader("Co Manager/Distributor");
        column.setEditor(eventComboEditor);
        column.setWidth(200);
        configs.add(column);

        ColumnConfig column2 = new ColumnConfig();
        column2.setId("test");
        column2.setHeader("Test");
        column2.setEditor(new CellEditor(new TextField<String>()));
        column2.setWidth(100);
        configs.add(column2);

        ColumnConfig column3 = new ColumnConfig();
        column3.setId("desk");
        column3.setHeader("Desk");
        column3.setEditor(new CellEditor(new TextField<String>()));
        column3.setWidth(105);
        configs.add(column3);

        cm = new ColumnModel(configs);
        gridStore = new ListStore<ModelData>();
        ModelData md = new BaseModelData();
        md.set("checkinTime", "12-12-2003");
        md.set("event", "Modify Roster");
        md.set("test", "A1");
        md.set("desk", "A2");
        gridStore.add(md);

        md = new BaseModelData();
        md.set("checkinTime", "13-12-2003");
        md.set("event", "Remove Attendance");
        md.set("test", "B1");
        md.set("desk", "B2");
        gridStore.add(md);

        md = new BaseModelData();
        md.set("checkinTime", "14-12-2003");
        md.set("event", "Mark OD");
        md.set("test", "C1");
        md.set("desk", "C2");
        gridStore.add(md);

        gridStore.commitChanges();

        grid = new EditorGrid<ModelData>(gridStore, cm);
        grid.setBorders(true);
        grid.setStripeRows(true);
        grid.setTrackMouseOver(true);
        grid.disableTextSelection(false);
        grid.setHideHeaders(false);
        grid.setHeight(500);
        grid.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);

        Viewport viewport = new Viewport();
        viewport.setLayout(new FlowLayout());

        cp.add(grid);
        viewport.add(cp, new FitData(new Margins(0, 0, 56, 0)));
        RootPanel.get().add(viewport);
    }

}

--РЕДАКТИРОВАТЬ--

Нужно отключить только ячейку этой конкретной строки. Но теперь она отключает весь столбец.

Попробуй с BeforeEdit слушатель и звонок event.setCancelled(true) на основании вашего условия отключить редактирование.

    grid.addListener(Events.BeforeEdit, new Listener<GridEvent<ModelData>>() {
        public void handleEvent(GridEvent<ModelData> be) {

            ModelData data = be.getModel();
            String val = data.get("event");
            if (val.equalsIgnoreCase("Remove Attendance")) {
                if (be.getColIndex() == 2) { // disable 2nd cell only
                    be.setCancelled(true);// Disable edition
                }
            }
        }
    });

Другие вопросы по тегам