Question

我正在尝试为datapicker添加自定义背景，但它不适用于星期六/星期日。

您看到我能够看到一周中的5天，但相同的代码不适用于S和S列。你能告诉我，我怎么能改变那些选定列的css，就像我在其他情况下做的那样？

我目前的代码是：

datePicker.addStyleToDates("customeDatePicker", date);

请点击此链接查看我到目前为止所做的工作以及需要完成的工作： http://farm7.static.flickr.com/6052/6342954519_defcf4d962_m.jpg

customDatePicker

public class CustomeDatePicker extends DatePicker {

    public CustomeDatePicker() {

        this.setStylePrimaryName("nakar");
    }

    @Override
    public void addStyleToDates(String styleName, Date date) {
        super.removeStyleFromDates("gwt-DatePicker", date);
        super.removeStyleDependentName("gwt-DatePicker");
        super.removeStyleName("gwt-DatePicker");
        super.removeStyleName("datePickerDayIsWeekend");
        super.addStyleToDates("customeDatePicker", date);
        this.getElement().setClassName("customeDatePicker");
        this.getElement().getStyle().clearBackgroundImage();
        this.getElement().getStyle().clearColor();

    }

    @Override
    public void addStyleToDates(String styleName, Date date, Date... moreDates) {
        super.addStyleToDates(styleName, date, moreDates);

    }

    @Override
    public void addStyleToDates(String styleName, Iterable<Date> dates) {
        super.addStyleToDates(styleName, dates);
    }

}

entrtypoint class



  public class Gwtproj implements EntryPoint {
        /**
         * The message displayed to the user when the server cannot be reached or
         * returns an error.
         */
        private static final String SERVER_ERROR = "An error occurred while "
                + "attempting to contact the server. Please check your network "
                + "connection and try again.";

        /**
         * Create a remote service proxy to talk to the server-side Greeting service.
         */
        private final GreetingServiceAsync greetingService = GWT
                .create(GreetingService.class);

        /**
         * This is the entry point method.
         */
        public void onModuleLoad() {

            final CustomeDatePicker datePicker = new CustomeDatePicker();
            VerticalPanel mainPanel = new VerticalPanel();


             // Set the value in the text box when the user selects a date
            datePicker.addValueChangeHandler(new ValueChangeHandler() {
              public void onValueChange(ValueChangeEvent event) {
                final Date date = (Date) event.getValue();
                // temp code
                datePicker.addStyleToDates("customeDatePicker", date);
                datePicker.getElement().getStyle().clearBackgroundColor();
                datePicker.getElement().getStyle().setBackgroundColor("red");
                datePicker.addShowRangeHandlerAndFire(new ShowRangeHandler<Date>() {

                    @Override
                    public void onShowRange(ShowRangeEvent<Date> event) {
                        // hun tak
                        datePicker.removeStyleFromDates(datePicker.getStyleName(), date);


                        datePicker.addStyleToDates("customeDatePicker", date);
                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date    );
                          datePicker.getElement().getStyle().setBackgroundColor("red");


                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date);
                          datePicker.getElement().getStyle().setBackgroundColor("red");

                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date);
                          datePicker.getElement().getStyle().setBackgroundColor("red");

                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date);
                          datePicker.getElement().getStyle().setBackgroundColor("red");

                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date);
                          datePicker.getElement().getStyle().setBackgroundColor("red");

                        date.setTime(date.getTime() + (1 * 24 * 60 * 60 * 1000));

                        datePicker.addStyleToDates("customeDatePicker", date);
                          datePicker.getElement().getStyle().setBackgroundColor("red");
                      /*Calendar cal = Calendar.getInstance();*/
                /*      cal.setTime(date);
                        cal.add(Calendar.DATE,1);

                        datePicker.addStyleToDates("customeDatePicker",cal.getTime() );*/


                    }
                });


              }

            // ithay calender rakh

            });


            mainPanel.add(datePicker);

            RootPanel.get().add(mainPanel);


        }
    }

css类，我已将其添加到默认项目css

中

   .customeDatePicker {
      color: red;
      background: cyan;
      border-color: blue;
      padding:2px;
      color: black; 
    }

Answer 1

我遇到了同样的问题。在搜索并通过我发现摆脱默认周末风格的唯一解决方案之后，请致电：

datePicker.removeStyleFromDates("datePickerDayIsWeekend",date);

在addStyleToDates（）调用/ s之后

。

好吧也许这不是他唯一的解决方案（你总是可以自己实现DatePicker），但它至少是最快的：）

编辑：如果你改变月份，可怕的'datePickerDayIsWeekend'风格会回来！

您必须实现addShowRangeHandler（）以再次读取/删除样式。

将一个css添加到DatePicker GWT Widget

1 个答案: