Need Extjs Simple Login code - extjs

need extjs code for login. if username="admin" & password="admin" open new panel else show error alert. Please Help me. thanks in advance
buttons: [{
text: 'Login',
handler:function(){
simple.getForm().reset();
}
//handler:loginclk
/** var usnme=Ext.getCmp('usr').getValue();
var pswd=Ext.getCmp('ped').getValue():
if(usnme=='admin' && pswd=='admin'){
Ext.MessageBox.show({Fine});
}
else { Ext.MessageBox.show({wrong });
}
handler : function() {
if(uname=="admin" && pwd=="admin"){
window.redirect();
}
I Tried these two codes but it doesn.t works

Ext.MessageBox.show() takes a config object, you are passing in undefined variables Fine and wrong.
Instead:
Ext.MessageBox.show({text: 'Fine'});
You must be seeing errors in your console too?
This handler code should work for you:
handler : function() {
var usnme=Ext.getCmp('usr').getValue();
var pwd=Ext.getCmp('ped').getValue():
if(uname=="admin" && pwd=="admin"){
window.redirect();
} else {
Ext.MessageBox.show({text:'Wrong'});
}
}
Provided the id's you have assigned to your inputs are correct 'usr' and 'ped'

Related

Integrate highcharts-custom-events with React

I've installed a highcharts-custom-events package to handle custom events(dblclick).
like the code below
var Highcharts = require('highcharts'),
HighchartsCustomEvents = require('highcharts-custom-events')(Highcharts);
But after adding this code, even the existing click is also not working.
Please help me to implement custom events to react.
Here is an example with implemented custom events in Highcharts with using react wrapper.
import CustomEvents from "highcharts-custom-events";
CustomEvents(Highcharts);
//require('highcharts-custom-events')(Highcharts);
Both above ways work - import and require.
Demo: https://codesandbox.io/s/highcharts-react-demo-1rtxl
If this wouldn't help - could you reproduce your case in the online editor which I could work on?
I was having the same problem using this lib, it was breaking the standard single click, I believe this is a duplicate post from this one.
On that post there is a function implementation of double click, that solution also breakes the single click, the thing is that you can add the single click as a condition inside double click function:
Fisrt define the settings:
var doubleClicker = {
clickedOnce : false,
timer : null,
timeBetweenClicks : 400
};
Then define a 'double click reset' function in case the double click is not fast enough and a double click callback:
// call to reset double click timer
var resetDoubleClick = function() {
clearTimeout(doubleClicker.timer);
doubleClicker.timer = null;
doubleClicker.clickedOnce = false;
};
// the actual callback for a double-click event
var ondbclick = function(e, point) {
if (point && point.x) {
// Do something with point data
}
};
Highcharts settings example
series: [{
point: {
events: {
click: function(e) {
if (doubleClicker.clickedOnce === true && doubleClicker.timer) {
resetDoubleClick();
ondbclick(e, this);
} else {
doubleClicker.clickedOnce = true;
doubleClicker.timer = setTimeout(function(){
resetDoubleClick();
}, doubleClicker.timeBetweenClicks);
}
}
}
}
}]

How can I make my custom JavaScript code work properly in AngularJS MVC?

As a simple example from my custom JavaScript file:
if(document.URL.indexOf("http://localhost/Angular/Angular_Project_01/index.html#!/myinfo") >= 0)
{
alert("you are viewing myinfo page");
}
This will only execute if page is refreshed while in the myinfo view. The problem is this page contains forms that need to be disabled after user has entered his/her information.
This code worked well for me in this project. Not sure if it's best practice though.
window.addEventListener('hashchange', function() {
if(window.location.hash == '#!/myinfo' //&& something)
{
console.log("Hash is #!/myinfo");
setTimeout(function() //Avoid TypeError: Cannot set property 'value' of null
{
//Do something
}, 1000);
}
});

Regarding $location.$$absUrl multiple condition

Can we check condition like below if not then what is other way??? I need to show console.log only below URl.
$location.$$absUrl.includes('localhost' || 'qa1' || 'cat1')
Below are my URL:
https://localhost:9005/
https://qa1.abc.com/
https://cat1.abc.com/
to achieve what you expect, you should use regex pattern.
// If my domain contain localhost OR qua1 or cat1.
if (!$location.absUrl().match(/(localhost|qa1|cat1)/)) {
// then override console.log to empty function.
console.log = function(){ };
//Is equal to do : window['console']['log'] = function(){ };
}
UPDATE
if you want to disable all kind of console output check this other topic
Try:
var absUrl = $location.absUrl();
if(absUrl.match(/(localhost|qa1|cat1)/)){
console.log(absUrl)
}

fireEvent('click') not working in IE11 - Extjs

I am planning to trigger a click event programatically when user presses a spacebar key. I have been used fireEvent('click') it is working for chrome, but It is not working for IE-11. I also tried, dispatchEvent for IE but it is throwing an error: "element does not support method or property dispatchEvent". Please follow below code.
onCustomRender: function(thisEl, args){
var fetchTrigger = thisEl.getTrigger('fetchID
fetchTrigger.el.on('keydown',function(e,thisEl){
if (e.keyCode === 32) {
//fetchTrigger.el.fireEvent('click'); //this is working in chrome //not working in IE and did not throwing error.
var evObj = document.createEvent('MouseEvents');
evObj.initEvent('click', true, false);
fetchTrigger.el.dispatchEvent(evObj);
}
});
}
Please Help
Thanks in Advance
First of all you have syntax error in the code you provided...
Calling the function directly is easiest (as Evan said) but if you want to keep the logic in the controller you can fire events. Else you need some ugly code to get the controller first, then call the method...
I don't like fireing events and attaching listeners on the 'Ext.dom.Element' if you don't have to. Just use your ext elements..
Here is what I would do:
onCustomRender: function(thisEl, args){
var fetchTrigger = thisEl.getTrigger('fetchID');
fetchTrigger.on('keydown',function(trigger, e){
if (e.keyCode === 32) {
trigger.fireEvent('click', trigger);
}
});
}
Or even better, use the controller:
implement listeners
init: function () {
this.control({
'#fetchID': { //you can optimize the componentQuery
keydown: this.onTriggerKeyDown,
click: this.onTriggerClick
}
});
},
and methods like this:
onTriggerKeyDown: function(trigger, e){
if (e.keyCode === 32) {
this.onTriggerClick(trigger);
}
},
onTriggerClick: function(trigger) {
//do you thing!
}

How to uncheck all tree nodes in Ext.tree.TreePanel?

I would like a 'reset' method to uncheck all the checked nodes in Ext.tree.TreePanel.
tree.getRootNode().cascade(function(n) {
var ui = n.getUI();
ui.toggleCheck(false);
});
As found here:
http://www.sencha.com/forum/showthread.php?12888-solved-programatically-unchecking-checked-tree-nodes&p=62845#post62845
I found a method as below, but seems the 'casecade' method do not worked well, I need call 'reset' several times to unchecked all the checked children:
reset: function (){
startNode = this.root;
var f = function () {
if (this.attributes.checked) {
this.attributes.checked = false;
this.getUI().toggleCheck(false);
}
};
startNode.cascade(f);
}
I was unable to get either of the other answers to work with Extjs 4.0.7. Also, the use of the "cascade" method issued a warning that it's deprecated. It recommended using "cascadeBy" instead. Other than the method name, I was unable to find a difference in the method signature (same arguments, this, behaviour).
However, I was able to find this code that worked:
{
xtype: 'button',
text: 'Deselect All',
listeners:{
click: function(){
var tree = Ext.ComponentQuery.query( 'treepanel[itemId=user_flags_tree]')[0];
tree.getRootNode().cascadeBy(function(){
this.set( 'checked', false );
});
}
}
}
Thanks to this post:
http://www.sencha.com/forum/showthread.php?149627-Programmaticaly-check-uncheck-checkboxes-in-the-Tree-panel
var nodes = treePanel.getView().getNodes();
var records = treePanel.getView().getRecords(nodes);
for (var i = 0; i < records.length; i++) {
records[i].set('checked',true);
}

Resources