Extjs 3 onchange is not working? - extjs3

I have one textfield in extjs3, In which if i enter 12 digit it should automatically get fire.
we are scanning by barcode scanner, so if digit reach 12 digit it should automatically get fire.
listeners: {
'change': function(field, newValue, oldValue){
if( newValue.length ==12 || newValue.length ==13){
alert("searchByUpcFunction()");
}
}
}
in extjs 4 same thing is working, but not in extjs 3. I need same thing in extjs 3.

Listen to keyup or valid events. change is fired when you leave the field.
listeners: {
'keyup': function(field, newValue, oldValue){
// ...
}
}

Related

Fire rule when Enter Key is pressed. Adobe DTM

I have this code in my Custom code section of an event based rule in DTM. I am trying to fire the rule upon the Enter key press. The input is not within a form element. How to I get the Keycode scoped into my custom page code? Any help would be appreciated!
jQuery(this).keypress(function (e) {
if (e.keyCode == 13) {
var frmData = 'search:new:submit';
var inpData = jQuery(this).siblings('input').val().trim().toLowerCase();
_satellite.setVar('frmData', frmData);
_satellite.setVar('inpData', inpData);
return true;
}
});
I got it to fire by switching the event type to Keypress and using this simple code. -cheers
if (event.keyCode == 13){
return true;
}

bootstrap-tagsinput form submited on press enter key

in bootstrap-tagsinput on press enter key for next tag form is submitted!
what is the solution?
$("#inputID").tagsinput();
First, you'll want to map 'Enter' to your tagsinput's confirmkeys option, then you'll need to call preventDefault() on your enter key to prevent the form from being submitted. In my solution, it only prevents submission by enter key while the user is focused in the tags input field.
To add a bit of redundancy, I also re-map the enter key to a comma in the input field, just to be sure.
$('#tags-input').tagsinput({
confirmKeys: [13, 188]
});
$('#tags-input input').on('keypress', function(e){
if (e.keyCode == 13){
e.keyCode = 188;
e.preventDefault();
};
});
Just also an FYI, Enter key is mapped as 13, and comma is 188 in JS.
Try this:
$('.bootstrap-tagsinput input').keydown(function( event ) {
if ( event.which == 13 ) {
$(this).blur();
$(this).focus();
return false;
}
})
Go to tagsinput.js
Find line:
self.$container.on('keypress', 'input', $.proxy(function(event) {
Before the end of this function add following:
if (event.which == 13) {
return false; // dont submit form !!
}
Enter key is register for postback form . that's why a case has been happened that when you hit 'enter' key it trigger the 'postback' event so the form goes to submitted .
solution :
on page load reserve the enter key for tag input :
#using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new { onkeydown = "return event.keyCode!=13" }))
if using asp.net mvc framework this is a simple example .
This work for me
$('.bootstrap-tagsinput input[type=text]').on('keydown', function (e) {
if ( event.which == 13 ) {
$(this).blur();
$(this).focus();
return false;
}
});
The cancelConfirmKeysOnEmpty option is set to true by default, but when set to false calls .preventDefault on the tag delimeter keydown event. Set it to false.
This solution also fixes the issue of a "carried comma".
cancelConfirmKeysOnEmpty: false,
// If the field is empty, let the event triggered fire as usual
if (self.options.cancelConfirmKeysOnEmpty === false) {
event.preventDefault();
}

Barcode Scanning AutoTrigger on LiveChange event

I have a barcode scanning functionality for my SAPUI5 application. First the user will see a pop-up where he can do barcode scanning and if the scanned barcode is correct it will trigger the Next button and will in turn display another pop-up for the next barcode scanning. For the first barcode, the user must scan 6-7 digits while on the second barcode, it should be 5. My problem is with the autotrigger for the fist barcode. When user scans for 7 digits, it triggers the Next 2x. Is there a way to know the last length of the scanned barcode text?
Here is my liveChange event for TextInput
liveChange: function(oEvent) {
sText = oEvent.getParameter('value');
parent1 = oEvent.getSource().getParent();
if ((typeof sText != 'undefined') && (sText.length >= 6) )
{
sap.ui.getCore().byId(t.createId("costCenterInput")).setValue(sText);
setTimeout(function() {
console.log(parent1.getBeginButton());
if (parent1.getBeginButton() != null){
parent1.getBeginButton().firePress(oEvent);
}
}, 5000);
}
}
The problem with this code is that an external barcode scanner acts as a Bluetooth keyboard that inputs the data one at a time. So say we scan 1234567, upon entering 6 it will already trigger even with the timeout and will trigger again when entering 7.
new code
onScanAddressMobile: function(){
var t = this;
t.oBundle = this.oApplicationFacade.getResourceBundle();
var dialog = new sap.m.Dialog(t.createId("ccDialog"), {
title: t.oBundle.getText("COST_CENTER"),
type: 'Message',
content: [
new sap.m.Text({ text: t.oBundle.getText("SCAN_COST_CENTER")}),
new sap.m.Input(t.createId("costCenterInput"), {
type: "Number",
liveChange:
function(oEvent){
t.onLiveChange(oEvent);
}
}),
.....some more code here...
},
onLiveChange : function(event) {
//alert("onLiveChange");
var value = event.getParameter("value");
if (value && value.length === 6) {
alert("6 character");
this.timer = setTimeout(this.gotoNextPage(value), 4000);
} else if (value && value.length > 6) {
alert("6 or more");
if (this.timer) {
clearTimeout(this.timer);
}
this.gotoNextPage(value);
}
},
Usually, barcode-scanners can be configured to send a 'return' value at the end of the scanned characters (or any other character, but the Chr(13) is most common as it could instantly submit a form when schanned into an input field
See if you can configure yours, and simply check for the last character (return)
A barcode scanner that works as a bluetooth keyboard will "key" in its data quite rapidly. If you have received 6 digits and then didn't receive anything for perhaps 250ms, you can consider the barcode complete and skip to the next page.
If you have received 7 digits, you don't even need to wait anymore, but can immediately skip to the next page.
So I guess your code would have to look something like this:
onLiveChange : function(event) {
var value = event.getParameter("value");
if (value && value.length === 6) {
this.timer = setTimeout(this.gotoNextPage, 250)
} else if (value && value.length > 6) {
if (this.timer) {
clearTimeout(this.timer);
}
this.gotoNextPage();
}
}
Please find an example with slightly longer time-out in this jsbin: http://jsbin.com/kolacez/1/edit?html,output
This is what will happen:
Char 1: Nothing
Char 2: Nothing
Char 3: Nothing
Char 4: Nothing
Char 5: Nothing
Char 6: A timer is set, if character 7 isn't received within a certain timeframe, the barcode is assumed to be complete and it will launch gotoNextPage.
Char 7: The timer is cancelled and gotoNextPage is started directly.
So in case a 7 chars barcode is received, the logic for both char 6 and char 7 is executed, but because the timer-action of char 6 is cancelled, the gotoNextPage method is launched only once.

How to programmatically fire keydown event in ExtJS 4

In ExtJs 4 how can I programmatically fire 'keydown' (or 'keypress') event (on TAB key) ?
I should want to simulate a TAB key pression in response to another event.
I have tried with code (in this event handler) :
field.fireEvent('keydown', {keyCode: 9})
but it's not working...
You may have to spy your DOM a bit (to see what elements are there, like fileInputEl in the example below), but this works for me:
var uploadField = Ext.getCmp( 'uploadField' );
uploadField.fileInputEl.dom.click();
I am also looking for a solution .... I have a numberfield component and a pop-up keyboard... when I try to click on key ('.') on the keyboard-pop-up... I want to attach to numberfield (like when you press '.')... but nothing happens. I try this:
// Ext version 5.1
var field = Ext.getCmp('numberfield-test');
var event = Ext.create('Ext.event.Event', {
key: 110 // Want to emulate '.' key
});
// none of the following works
field.fireEvent('keydown', [ field, event ]);
field.fireEvent('keypress', [ field, event ]);
field.fireEvent('keyup', [ field, event ]);
// neither this ones
field.fireEvent('keydown', field, event);
field.fireEvent('keypress', field, event);
field.fireEvent('keyup', field, event);

Charcter Validation In Ext js3.4

I want to check validation for textfield in Ext js3.4...Validation condition is first 5 Character must be "ROLE_"...How would I check them...I also trying for getting value on keypress event through getKey method ..But I got only ASCII value ..how would I convert them.
Have you tried keydown keyup events in listeners, in those events you will directly get the value using the id of the text field... here you go for a sample code
xtype:'textfield'
fieldLabel: 'First Name',
name: 'first',
allowBlank:false,
id:'name',
listeners:
keyup:function(this,e){
var desiredname= Ext.getCmp('name').value;
if(desiredname.length==5)
{
//YOUR CODE :)
}
}
Hope this helps you...