I'm attempting to use an ObservableArray similar to the grocery list tutorial, but whenever I add the ObservableArray to my code-behind file's Observable, my app will not load the respective xml page. My app stalls at the previous page. Here's the respective code:
home.js:
var Group_List_View_Model = require("../../shared/view-models/list_groups_view_model");
var Observable = require("data/observable").Observable;
var group_list = new Group_List_View_Model([]);
var page_data = new Observable({
group_list: group_list,
load_groups: false
});
exports.onNavigatingTo = function(args) {
var page = args.object;
page.bindingContext = page_data;
}
list_groups_view_model.js:
var ObservableArray = require("data/observable-array").ObservableArray;
function Group_List_View_Model(items) {
var view_model = new ObservableArray(items);
return view_model;
}
module.exports = Group_List_View_Model;
When I comment out only return view_model;, my app no longer stalls. The same applies when I comment out only group_list: group_list,. My app does not like something about the ObservableArray. Any insight on what my be causing the problem?
Update: My app also doesn't like it when I put the ObservableArray directly in my code-behind file:
home.js
var Observable = require("data/observable").Observable;
var ObservableArray = require("data/observable-array").ObservableArray;
var group_list = new ObservableArray([]);
var page_data = new Observable({
group_list: group_list,
load_groups: false
});
Update2: I'm using firebase in my app, and my console is giving this error:
JS: Error in firebase.init: Error: java.lang.IllegalStateException: FirebaseApp with name [DEFAULT] doesn't exist.
Although, there is no firebase code related to this observable array at this point, and the array is also empty.
Update3: Related issue Unhanded Exception thrown following Nativescript 2.2.0 update
This issue is currently being assessed: https://github.com/NativeScript/NativeScript/issues/2457#issuecomment-236075561/
Related
I have a Goggle Map displaying markers based on a list being pulled from a database via php. It all works OK but will display a blank grey map page if one of the lng/lats are incorrect.
eg: "510.51356, -0.7015494" rather than "53.8741174, -0.7015494"
I've tried:
var myLatlng = new google.maps.LatLng(510.51356, -0.7015494);
console.log(myLatlng);
Thinking it would return an error but doesn't - it returns an object but no data - but this is the same whether the lng/lat is correct or not.
Is there a way I can stop GoogleMaps from trying to add markers with incorrect lng/lats?
Below is the full code I'm using:
var myLatlng = new google.maps.LatLng(510.51356,-0.7015494);
var markerOptions = {
map: map,
position: myLatlng,
title: “MY LOCATION TITLE”
};
marker_3744 = createMarker_map(markerOptions);
marker_3744.set("content", "<strong>MY LOCATION TITLE</strong><br /><strong>Full address in here”);
google.maps.event.addListener(marker_3744, "click", function(event) {
iw_map.setContent(this.get("content"));
iw_map.open(map, this);
});```
I want to spy on a function used as a click handler. The function is defined within the constructor of a closure.
var viewModel = function(){
var viewModel = function(){
var _this = this;
_this.internalClickHandler = function(){
console.log('I handled a click');
}
}
return viewModel;
}();
var testViewModel = new viewModel();
var theSpy = spyOn(testViewModel, 'internalClickHandler');
Even though Jasmine is happy that 'internalClickHandler' exists and creates the spy, it never gets called. In fact the original function (internalClickHandler) gets call instead.
I've created examples in codepen.io that show the problem. The failing test is the one trying to spy on a function in the constructor.
My event handler needs to be in the constructor as it needs access to instance of the object and I do want to test that the correct handler has been fired not just that the click event was triggered.
Any help would be greatly received. Thanks
You will not be able to execute that test because of the following reasons:
Your clickHandler actually gets reassigned to a different variable
on the DOM Element onClick, see this line
document.getElementById('testLink').addEventListener('click',
_this.internalClickHandler);
When a click trigger gets invoked, it actually executes the function
onClick and NOT internalClickHandler, though they are in actuality(code wise)
the same but they are being referenced by two different variables
i.e onClick & internalClickHandler.
You are better off trying something like this.
it('should spy on a event binding defined in constructor', function() {
var testViewModel = new viewModel();
var tl = document.getElementById('testLink');
var theSpy = spyOn(t1, 'onclick');
//$('#testLink').trigger('click');
var event = new MouseEvent('click', {
'view': window,
'bubbles': true,
'cancelable': true
});
tl.dispatchEvent(event);
expect(theSpy).toHaveBeenCalled();
tearDown();
});
Hope this helps.
I resolved this by using as the handler an anonymous function wrapping a reference to internalClickHandler. This way the original function still gets called and I'm able to spy on it.
var viewModel = function(){
var viewModel = function(){
var _this = this;
_this.internalClickHandler = function(){
console.log('I handled a click');
}
}
return viewModel;
}();
var theViewModel = new viewModel();
var theSpy = spyOn(testViewModel, 'internalClickHandler');
$('#testLink').on('click',
function(){
theViewModel.internalClickHandler(); //<-- The anonymous function calls internalClickHandler
});
I noticed that when logging out of my app, it takes me back to the login screen as intended. However, the input fields are still populated with previous login info (i.e. email/password). I thought they would be empty again upon navigating back to the login screen, but this isn't the case.
Here is my login.js file with respect to loading actions:
var frameModule = require("ui/frame");
var Observable = require("data/observable").Observable;
var home_navigation = {
moduleName: "views/home/home",
clearHistory: true
};
var page_data = new Observable({
email: "",
password: ""
})
exports.onNavigatingTo = function(args) {
var page = args.object;
page.bindingContext = page_data;
}
There are other functions below this, but they just the email/pass and perform login logic as well as navigate to the appropriate screen, without storing the email/password anywhere locally. Also, there are no checks for previous session or anything like that.
When u leave its saved only in memory and its not available to other parts of app until saved somewhere like application-settings or db
There is a dialog, and I define a function OnAccept() and call it like this: ondialogaccept:ondialogaccept="OnAccept()".
OnAccept():
function OnAccept() {
var windowManager = Components.classes["#mozilla.org/appshell/window-mediator;1"].getService();
var windowManagerInterface = windowManager.QueryInterface( Components.interfaces.nsIWindowMediator );
var topWindow = windowManagerInterface.getMostRecentWindow( "navigator:browser" );
if(topWindow)
{
var web = topWindow.document.getElementById("content");
web.selectedTab = web.addTab("http://www.google.com");
var newBrowserHandle = web.getBrowserForTab(web.selectedTab);
newBrowserHandle.addEventListener("load", function() { alert("111"); }, true);
}
}
But the addEventListener doesn't work. I don't know why.
There are some issues in your code that are probably just bad copy&paste: ondialogaccept:ondialogaccept="OnAccept()" should be ondialogaccept="OnAccept()" and OnAccept(): should be OnAccept: (without parentheses).
The main issue: the load event listener doesn't get propagated from content to chrome, you would need progress listeners to get that event. You can listen to the DOMContentLoaded event however, that one can be caught on the browser element. This event will fire when only the document content is loaded, not images and such - but maybe that's ok for you.
thanks so much in advance...here is the problem...
I am trying to add dynamic HTML element (EX. [delete]),everytime on a event call using FBJS.I am able to append the element using following code.
var oldFriendHtml = document.getElementById('friend_container');
var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").getValue()-1)+2;
numi.value = num;
var newElementId = "new"+num;
var newFriendHTML = document.createElement('div');
newFriendHTML.setId(newElementId);
newFriendHTML.setInnerXTML("HTML TO BE ADDED");
oldFriendHtml.appendChild(newFriendHTML);
The problem I am facing is that FBJS parses out the onClick part (event call ) out from the original HTML added .This stops me in the further activity on the added element .It also removes the styling added in the HTML ..
Regarding onclick being parsed out of setInnerXHTML, you can add the event later by using addEventListener.
Here is some sample:
var my_obj = document.getElementById('test');
// add a new event listener for each type of event you needed to capture
my_obj.addEventListener('click',my_click_func); // in your case is onclick
function my_click_func(evnt){
// some action
}
more details see http://developers.facebook.com/docs/fbjs#events