Olivier Tremblay
Olivier Tremblay

Reputation: 1431

Disabling manual input in dijit.form.DateTextBox

I want to only have the calendar to specify my textbox input, and not permit keyboard-punched numbers in my calendar textbox, inside dijit.form.DateTextBox. Is there any way to do that?

Thanks.

Upvotes: 2

Views: 11540

Answers (6)

user1470014
user1470014

Reputation:

There are two options that you can use to disable the dojo date input element.

Code

1) Use the setDisabled(true) method

dijit.byId('id').setDisabled(true); 

or

2) Set disable the property directly. (You'll need to disable both elements)

dijit.byId(id).disabled = true;
dijit.byId(id).textbox.disabled = true;

Upvotes: 0

Chandra Prakash
Chandra Prakash

Reputation: 791

The code below can be used to make DateTextBox read only:

<input data-dojo-type="dijit/form/DateTextBox" 
       data-dojo-id="effectiveDate" 
       type="text" 
       name="effectiveDate" 
       id="effectiveDate" 
       data-dojo-props="'readonly': 'readonly'"/>

Upvotes: 6

cabaji99
cabaji99

Reputation: 1445

Updating the answer from MrZombie in the extended widget you can add:

 //to disable input from user at the textbox.s
                        startup:function(){
                            this.inherited(arguments);
                            dojo.connect(this, "onKeyPress", function(evt){
                                dojo.stopEvent(evt);
                            });   

                        },

At the startup of the widget.

Upvotes: 0

Olivier Tremblay
Olivier Tremblay

Reputation: 1431

I actually ended up using something else - here is my solution:

dojo.addOnLoad(function () {
            dojo.query(".dijitDateTextBox input[role='textbox']").forEach(function (node, index, arr) {
                node.setAttribute('readonly', 'readonly');
            });

        });

By setting the elements I needed to "readonly", I get the desired effect. I execute this on my page loads, I'm not sure about the overhead, but the main point is, it works.

Upvotes: 2

Philippe
Philippe

Reputation: 6828

@Sudhir : if you set the widget to disabled then you can't select a date on the calendar either.

Try this :

dojo.ready(function(){
    dojo.connect(dijit.byId("yourcalendarid"), "onKeyPress", function(evt){
        dojo.stopEvent(evt);
    });             
});

Upvotes: 3

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

You could add disabled parameter to your input:

<input type="text" name="startDate" dojoType="dijit.form.DateTextBox" 
  constraints="{datePattern:'MM/dd/yyyy'}"  
  value='' disabled
  validate='return true;'
/>

Hope it helps

Upvotes: 0

Related Questions