私の仕事は次のとおりです。列を持つデータバインドされたListGrid。この列のタイトルは、"Information for { infoDatein format DD-MM-YYYY}" + ユーザーが変更できる DateItem (アイコン ピッカーのみ) である必要がありinfoDateます。デフォルトでは現在の日付です。選択した日付に応じて、列の値が変わります。
だから、私はこの質問からアイデアを得ました SmartGWT の HeaderSpan にボタンを追加して、以下のコードに到達する方法。残念ながら、問題があります。DateItem はクリック可能に見えず、画像のように見えます。また、TextField を削除することはできません。これは、テキスト フィールドまたは 3 つの選択可能なオプション フィールドです。
Calendar、DateChooser、DatePickerで試してみたので、innerHTMLを使用してもピッカー自体の機能を使用しないことをお勧めしますが、ビューに問題がありました（DatePicker onClickを開くカレンダーアイコンのみが必要です）。
助けやアイデアをよろしくお願いします！
インポート:
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.Node;
import com.google.gwt.dom.client.NodeList;
import com.smartgwt.client.widgets.events.DrawEvent;
import com.smartgwt.client.widgets.events.DrawHandler;
import com.smartgwt.client.widgets.grid.ListGrid;
コード：
ListGrid infoTable = new ListGrid();
infoTable.setShowRecordComponents(true);
infoTable.setShowRecordComponentsByCell(true);
infoTable.setWidth100();
infoTable.setDataSource(dataSource);
infoTable.setCanEdit(false);
infoTable.setCanCollapseGroup(false);
infoTable.setCanFreezeFields(false);
infoTable.setCanGroupBy(false);
infoTable.setCanMultiSort(false);
infoTable.setCanSort(false);
infoTable.setCanResizeFields(false);
infoTable.setAutoFetchData(false);
infoTable.addDrawHandler(new DrawHandler() {
public void onDraw(final DrawEvent event) {
for (Element element : DOMUtils.getElementsByTagName("td")) {
if (element.getInnerHTML().startsWith("Information for")) {
DOMUtils.removeAllChildNodes(element);
final DynamicForm cal = new DynamicForm();
final DateItem infoDate = new DateItem();
infoDate.setDefaultValue(new Date());
infoDate.setTitle(“Information for ”);
infoDate.setTitleAlign(Alignment.LEFT);
infoDate.setWrapTitle(false);
infoDate.setDisplayFormat(DateDisplayFormat.TOEUROPEANSHORTDATE);
infoDate.setUseTextField(true);
infoDate.setAlign(Alignment.RIGHT);
infoDate.addChangedHandler(new ChangedHandler() {
public void onChanged(final ChangedEvent event) {
//fetch new data, according to the date selected);
}
});
cal.setFields(infoDate);
element.setInnerHTML(cal.getInnerHTML());
}
}
// fetch data from DataSource class
infoTable.fetchData();
}
});
クラス DOMUtils:
class DOMUtils {
public static void removeAllChildNodes(Element element) {
NodeList<Node> childList = element.getChildNodes();
for(int childIndex = 0; childIndex < childList.getLength(); childIndex++) {
element.removeChild(childList.getItem(childIndex));
}
}
public static Element[] getElementsByTagName(String tagName)
{
JavaScriptObject elements = getElementsByTagNameInternal(tagName);
int length = getArrayLength(elements);
Element[] result = new Element[length];
for (int i=0; i<length; i++)
{
result[i] = getArrayElement(elements, i);
}
return result;
}
private static native JavaScriptObject getElementsByTagNameInternal(String tagName)/*-{
return $doc.getElementsByTagName(tagName);
}-*/;
private static native int getArrayLength(JavaScriptObject array)/*-{
return array.length;
}-*/;
private static native Element getArrayElement(JavaScriptObject array, int position)/*-{
return (position>=0 && position<array.length?array[position]:null);
}-*/;
}