How can I allow selection of a date using the calendar button but disable typing of date in Dojo Date Textbox?

问题

How can I allow selection of a date using the calandar button but disable typing of date in Dojo Date Textbox?

Is there a way to do this? If so how?

Basically I want the users to be able to select a date using the calendar button but don't allow them to manually enter a date.

回答1:

Create a client-side onfocus event:

thisEvent.target.blur();

That doesn't prevent the field's value from being programmatically populated via the date helper, but if they try to manually focus (i.e. click or tab into) the field, it will kick them back out again.

回答2:

There is a new property of showReadonlyAsDisabled which I tried on date time field. But it ended up creating a disabled field, but surprisingly it creates a readonly field in case of edit box. So I had to create a workaround by setting the readonly property via javascript while loading the page. Below is the code snippet:

<xp:inputText id="dateTimeField">
    <xp:dateTimeHelper id="dateTimeHelper1"></xp:dateTimeHelper>
    <xp:this.converter>
        <xp:convertDateTime type="date"></xp:convertDateTime>
    </xp:this.converter>
</xp:inputText>
<xp:br></xp:br>
<xp:scriptBlock>
    <xp:this.value><![CDATA[XSP.addOnLoad(
    function() {
        document.getElementById("#{id:dateTimeField}").readOnly = true;
    }
);]]></xp:this.value>
</xp:scriptBlock>

I don't know if this is optimal solution, but it works!

来源：https://stackoverflow.com/questions/11251604/how-can-i-allow-selection-of-a-date-using-the-calendar-button-but-disable-typing