Clare
(Clare Jone)
May 25, 2014, 3:22pm
1
Hi
I am setting a value for the userId textfield in javascript using
document.getElementById(“userIdField”).value = userId;
I want to read the value of this textfield using vaadin…how could this be done?
example userId.getValue() - doesnt return the textfield value…
Any help much appreciated?
Juho9
(Juho Nurminen)
May 26, 2014, 7:56am
2
I guess this was already answered in your other thread. I’ll paste my answer here as well, just in case someone stumbles upon this post from a Google search or something…
TextField only sends updates to the server after it receives a change event on the client side. This is to avoid unnecessary server roundtrips. Basically, you have three options here:
After setting the value like you did, manually focus and blur the field, like so:
var field = document.getElementById('userIdField');
field.value = userId;
field.focus();
field.blur();
Manually fire the change event:
var field = document.getElementById('userIdField');
field.value = userId;
if ('fireEvent' in field) { // IE8
field.fireEvent('onchange', false, true);
} else {
field.dispatchEvent(new Event('change'));
}
Export some Java methods from GWT to JavaScript and use the VTextField API directly from there. For this one, take a look at the
JSNI documentation
.
Out of these three, I guess the best choise would be #2 , especially if you don’t need to support IE8… which I guess you wouldn’t, since you’re using TouchKit anyway. #1 could have some unwanted side effects if you rely on the focus being in a certain place, and #3 is a bit involved if you aren’t familiar with GWT already.
If you are using vaadin 7.2.0:
I think there is a bug in vaadin 7.2.0 which does not accept the “change” events from javascript.
Try using vaadin 7.1.16. it should work with this version.
http://dev.vaadin.com/ticket/13782
Juho9
(Juho Nurminen)
May 26, 2014, 8:17am
4
I tested the dispatchEvent approach on Firefox 29.0 with Vaadin 7.2.0 and it seemed to work just fine, so the virtual keyboard must be doing something different.
i see. there must be an issue with the $.trigger function in jquery. using the dispatchEvent function works fine.
yet its still strange that the virtual keyboard stopped working with vaadin 7.2.0
Textfield
Compoment seems to react to to dispatchEvent. But
PopupDateField
does not.
tested with vaadin 7.2.1
Juho9
(Juho Nurminen)
June 3, 2014, 10:47am
7
Are you calling dispatchEvent on the right element? If you are using PopupDatefield.setId() on the server-side and then doing document.getElementById() on the client, you’ll end up with a div. Instead you should be sending the events to the input element.
yes, i am sure the virtualkeyboard is sending it to the right element. its sending to the field with the “.v-textfield” class.
The inputfields are identified by this jquery script:
$('.v-textfield').keyboard()
i am able to enter the text. but PopupDateField.getValue() does not recieve the entered value.
Juho9
(Juho Nurminen)
June 3, 2014, 11:07am
9
I tested this by typing some plain old JavaScript in the console, and it seems to be working correctly. Did you remember to call PopupDateField.setImmediate(true) on the server?
yes , i use PopupDateField.setImmediate(true) on the server.
Juho9
(Juho Nurminen)
June 3, 2014, 1:09pm
11
Here’s the JavaScript snippet I tested this with:
var field = document.getElementsByClassName('v-datefield-textfield')[0]
;
field.value = '5/7/11 02:20:00 PM';
field.dispatchEvent(new Event('change'));
Can you check if that works? I’m seeing server-side change events and and updated values just like I should.
Here’s the JavaScript snippet I tested this with:
var field = document.getElementsByClassName('v-datefield-textfield')[0]
;
field.value = '5/7/11 02:20:00 PM';
field.dispatchEvent(new Event('change'));
Can you check if that works? I’m seeing server-side change events and and updated values just like I should.
yes, this is working.
but jquerys (v1.11.1) .trigger() and .change() functions do not work
Juho9
(Juho Nurminen)
June 4, 2014, 9:01am
13
In that case I’m guessing its a bug in jQuery.