如何通过 DatePicker 在 TextField 上设置数据

How can set data on TextField from DatePicker

我正在 appcelerator studio 中构建自定义模式。

所以这是代码:

<Alloy>
    <Window id="modal_add_edit" onClose="cleanup" modal="true">
        <View class="container">
            <Label id="title" class="title"/>
            <View class="separator"></View>

            <TableView id="table" height="Titanium.UI.SIZE" layout="vertical">                          
                    <TableViewRow class="menu_item" top="25">
                        <Label id="description" class="label" left="12" />
                        <Picker id="comboDecription" left="20" selectionIndicator="true">
                            <PickerColumn id="column1">
                                <PickerRow title="Esposizione Tossica"/>
                                <PickerRow title="Stato civile"/>
                                <PickerRow title="Diet"/>
                            </PickerColumn>
                        </Picker>
                    </TableViewRow>

                    <!-- flags -->
                    <TableViewRow id="data" class="menu_item" top="25">
                        <!--DATA START-->
                        <Label id="start_date" class="label" left="12" />
                        <TextField id="textStartDate" class="field"
                             width="200px"></TextField>
                    </TableViewRow>



            </TableView>

            <View class="separator"></View>
            <TableView id="tableButton" width="Titanium.UI.FILL" layout="horizontal">                           
                    <TableViewRow class="menu_item" top="25">
                        <Button id="buttonClose" class="buttonClose" onClick="onClose" ></Button>
                        <Button id="buttonSave" class="buttonSave"></Button>
                    </TableViewRow> 
            </TableView>
        </View>
    </Window>
</Alloy>

所以我希望如果用户单击 textStartdate,就会显示 DatePicker。这是我的控制器的代码:

var picker = Ti.UI.createPicker({});
$.textStartDate.addEventListener('click', function(e) { 
    picker.showDatePickerDialog({
        value : new Date(), // some date
        callback : function(e) {
            if (e.cancel) {
                Ti.API.info('user canceled dialog');
            } else {
                selectedDate = e.value;
                $.textStartDate.setValue(String.formatDate(selectedDate, 'medium'));
            }
        }
    });
});

然后,如果我尝试单击 textStartDate,我可以看到 DatePicker,然后我设置数据,单击确定按钮,但我无法在 textStartDate 上显示数据。

如果我可以调试,代码:

String.formatDate(selectedDate, 'medium')

return 正确的数据,但我在编辑文本中看不到它

编辑 我添加屏幕截图

这是 app.tss

中字段的 class
".field": {
    left: "5%",
    width: Titanium.UI.FILL,
    borderRadius: 5,
    hintTextColor: "#aaa",
    color: "#333",
    backgroundColor: "white"
}

正如您所说 String.formatDate(selectedDate, 'medium') 正在返回正确的数据,但您看不到日期,所以我猜这可能是您的文本字段颜色属性的问题。

确保您已将颜色 属性 设置为与文本字段背景颜色不同的颜色,或者如果您尚未设置任何此类 属性,那么我仍然建议您设置 colorbackgroundColor 属性和一些默认值以确保您的文本值在文本字段中正确可见。

有时根据主题或 OS 类型,默认文本颜色和背景颜色组合可能相同,这使得文本值不可见。