function issue in appcelerator titanium - javascript

In My app i am calling function like below but toJSDate function not invoked. What is the problem can anyone tell why.
In console i get only getIssueProgress Called.
Below i am sharing code.
function toJSDate(){
Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate('anil');
}

your toJSDate() doesn't expect a parameters but your calling it with a parameter var check_Date = toJSDate('anil');. Remove 'anil':
function toJSDate(){
console.log('toJSDate');
//Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
console.log('getIssueProgress');
//Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate();//not: toJSDate('anil');
}
getIssueProgress();
If you do want to pass that parameter you need to add it to the function declaration
//add parameter here
function toJSDate(param){
console.log('toJSDate');
console.log(param);
//Ti.API.info('getIssueProgress Called');
}
function getIssueProgress() {
console.log('getIssueProgress');
//Ti.API.info('getIssueProgress Called');
var check_Date = toJSDate('anil');
}
getIssueProgress();

Related

Calling function inside function called by setTimeout

I am trying to call the function scroll_page inside a function call_scroll_page that is called by setTimeout. And I get error file.js:5 Uncaught TypeError: scroll_page is not a function.
function scroll_page() {
return false;
}
function call_scroll_page() {
var scroll_page = scroll_page();
if(!scroll_page) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);
var scroll_page
You defined a new variable called scroll_page inside the call_scroll_page function which has masked the global one.
Rename that variable.
It is because you are declaring a var with same name as your function. So inside your function call_scroll_page() scroll_page refers to the local variable. Change your variable name and it will work as intended.
function scroll_page() {
return false;
}
function call_scroll_page() {
var scroll_page_var = scroll_page();
if(!scroll_page_var) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
This line is causing the error: var scroll_page = scroll_page();
Do not redeclare something with name of the scroll_page function.
It removes the link to the function, replaced by a variable, calling a function that is no longer "callable by its name".
Try:
function scroll_page() {
return false;
}
function call_scroll_page() {
var fn = scroll_page();
if(!fn) {
$test = true;
}
}
setTimeout(call_scroll_page, 1000);

Issue with click eventListener

I found an example task to display an alert on a page when you click anywhere in a document. In the task you need to edit only the display() function, which has two parameters - myFunc and myObj, so that the name of the person object is displayed. I've come up with something like this, but the alert only comes up after the page refreshes, not after each click on the document.
function start() {
var person = {
        name : "John"
    };
    function alertName() {
        alert(""+this.name.toUpperCase() + "");
    }
    document.addEventListener('click', display(alertName, person));
}
function display(myFunc, myObj) {
name = myObj.name;
myFunc();
}
start();
here is fiddle:
function start() {
var person = {
        name : "John"
    };
    function alertName() {
        alert(""+this.name.toUpperCase() + "");
    }
    document.addEventListener('click', start(alertName, person));
}
function display(myFunc, myObj) {
name = myObj.name;
myFunc();
}
start();
body {
background-color:yellow;
}
<body>
</body>
The issue here in that addEventListener second parameter need to be the function you want to invoke when the event is trigger.
In your exemple, you passed an instruction and not a function. What you can do is add the display() call inside a function body, and pass that function as the second parameter :
function start() {
var person = {
        name : "John"
    };
    function alertName() {
        alert(""+this.name.toUpperCase() + "");
    }
    document.addEventListener('click', function() {
display(alertName, person)
});
}
function display(myFunc, myObj) {
name = myObj.name;
myFunc();
}
start();
You need to understand that display is a function and by display(alertName, person) you are calling it immediately, not as a event callback. However addEventListener needs function reference as the second parameter so it means that when called display(alertName, person) must return a new function that will call alertName (which is a reference) from inside.
Finally, this.name inside alertName implies that it needs to be invoked in context of myObj, use Function.prototype.call to do it.
function start() {
var person = {        
name: "John"    
}
function alertName() {        
alert("" + this.name.toUpperCase() + "");    
}
document.addEventListener('click', display(alertName, person));
}
function display(myFunc, myObj) {
return function () {
myFunc.call(myObj)
}
}
start();
Click somewhere.

Use of debounce on Ext 3.4 framework

I want to implement the debounce function on Ext.Button, so I extended it and override the onClick function, like this:
MyButton = Ext.extend(Ext.Button, {
onClick: function(e) {
var that = this;
var args = e;
clearTimeout(this.timeoutDebounce);
this.timeoutDebounce = setTimeout(function(){
MyButton.superclass.onClick.apply(that, [args])
}, this.debounce);
}
});
Debounce is a parameter passed on the x-type declaration.
The problem here is that the "args" parameter I'm passing to onClick has changed when it's called from "click" to "mouvemove" and it doesn't fire the events it should.
Is there a way to record the "e" parameter received in the function to pass to onClick on superclass?
The function passed to setTimeout must be wrapped in order to keep the value presented in current scope:
function createCallback(args) {
return function() {
MyButton.superclass.onClick.apply(that, [args]);
}
}
Also, e is passed by reference, so you need to create a copy of it. Using ExtJS, you can use Ext.apply method:
Ext.apply({}, e);
The full code should be:
var MyButton = Ext.extend(Ext.Button, {
onClick: function(e) {
var that = this;
function createCallback(args) {
return function() {
MyButton.superclass.onClick.apply(that, [args]);
// you can also use call since you know the arguments:
// MyButton.superclass.onClick.call(that, args);
}
}
clearTimeout(this.timeoutDebounce);
var copy = Ext.apply({}, e);
this.timeoutDebounce = setTimeout(createCallback(copy), this.debounce);
}
});
You should clone the object:
var args = Ext.apply({}, e);
this.timeoutDebounce = setTimeout((function(args){
return function(){MyButton.superclass.onClick.apply(that, [args])};
})(args), this.debounce);

I wanted to make a javascript library function is not working

I wanted to call the run function that should call the other and action will be done on the base of element_id
NGL = {}
NGL.SceneBuilder = function() {
var yamlFile = 'http://example.com/main.yaml'
var parseYaml = function() {
}
var buildScene = function() {
// other code
simulationStarted(element_id);
}
return {
run: function(element_id) {
parseYaml();
buildScene(element_id);
}
}
}
NGL.SceneBuilder.run('#someid');
You're not executing your factory so NGL.SceneBuilder is a function, not an object having the run property. Call the function :
NGL.SceneBuilder = (function() {
...
})(); // <<===
Note also that you forget to declare the element_id parameter in buildScene but maybe is it just for the question.

How do I call a nested JavaScript function properly

I'm trying to set up function a nested function that I can call throughout my script, but I keep getting "error undefined is not a function". Perhaps someone can help me with how to do this correctly.
First I set global my variables:
var trigger = document.getElementById('trigger');
var subject = document.getElementById('subject');
Then I create a show/hide function:
var toggleVis = function() {
function showSomething() {
trigger.classList.add("active");
subject.classList.add("active");
}
function hideSomething() {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
}
Then I set my event listener:
trigger.addEventListener('click', function() {
if ( subject.classList.contains("active") ) {
toggleVis.hideSomething();
}
else {
togglePicker.showPicker();
}
});
The reason I'm trying to do it this way is that there will be other triggers for subject on the page that will need access to the show/hide functions.
You can't access the functions inside the function, they are out of scope, you could attach them as properties to the wrapping function, but it looks like you just need an object
var toggleVis = {
showSomething: function() {
trigger.classList.add("active");
subject.classList.add("active");
},
hideSomething: function() {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
}
Your togleVis variable is a function and not an object so you can't do toggleVis.hideSomething(). Try updating your code to :
var toggleVis = (function() {
return {
showSomething : function () {
trigger.classList.add("active");
subject.classList.add("active");
},
hideSomething : function () {
trigger.classList.remove("active");;
subject.classList.remove("active");
}
};
}());
With this toggleVis is now an object with two properties showSomething and hideSomething functions.

Categories

Resources