Bookmarklist cross browser ajax issue

edited April 2012 in Enyo 2
Hello Friends,

I have created two pullout component in Bing map under Enyo 2.0, first one having a list of default bookmark items and another one having two tabs called active/inactive. All data(bookmark Items) are coming from the mysql database via Enyo Ajax method. I have pasted my snippet below. All these data are coming correctly from ajax but for any reason bookmark items are not displaying inside the pullout component. Only when we are trying to create inside ajax response(not even static data from mockdata file).

I have cross browser issue here, i can see data loading in firefox 11.0 web browser but when i am running the same url into another web browsers(chrome, safari, etc...) bookmark Items are not coming inside pullout.

Another problem is something goofy for me. I am only able to get bookmark Items on firefox only if i added an alert inside the inactive enyo.kind and when i remove this alert data are not coming to firefox as welll.

Please have a look at the below code, i have spent almost a week into this and have not succeeded, please help me...

Code Snippet:

For Default Pullout Tab:
enyo.kind({
	name: "BookmarkDefaultList",
	events: {
		onItemSelect: ""
	},
	create: function() {//alert('test for create');//this.$.map.addPushpins();//},
		this.inherited(arguments);
		var request = new enyo.Ajax({
			url: "api/webmap.php?flag=defaultPIN", 
			contentType: "application/x-www-form-urlencoded",
			sync: false,
			method: "GET", //You can also use POST
			handleAs: "text", //options are "json", "text", or "xml"
		});        
	request.response(enyo.bind(this, "searchResults")); //tells Ajax what the callback function is
  	request.go({}); //makes the Ajax call.
	},
searchResults:function(inSender, inResponse) {
		var r = enyo.json.parse(inResponse);//function() {
		for (var i=0, item; item=r[i]; i++) {//alert('test');
			var c = this.createComponent({kind: "BookmarkItem",
				ontap: "itemTap",
				}, item);
				//alert(item.Title);
			  	c.setTitle(item.Title);
				c.setDetails(item.Address);
				c.setBeepid(item.Beepid);
		}
	},
	itemTap: function(inSender) {
		if (this.activated) {
			this.activated.applyStyle("background", null);
		}
		this.activated = inSender;
		this.activated.applyStyle("background", "lightblue");
		this.doItemSelect(inSender);
	}
});

For ActivePullout Tab:
enyo.kind({
	name: "BookmarkActiveList",
	events: {
		onItemSelect: ""
	},
	create: function() {//alert('test for create');//this.$.map.addPushpins();//},
		this.inherited(arguments);
		var request = new enyo.Ajax({
		url: "api/webmap.php?flag=defaultPIN", 
		contentType: "application/x-www-form-urlencoded",
		sync: false,
		method: "GET", //You can also use POST
		handleAs: "text", //options are "json", "text", or "xml"
		});        
	request.response(enyo.bind(this, "searchResults")); //tells Ajax what the callback function is
  	request.go({}); //makes the Ajax call.
	},
searchResults:function(inSender, inResponse) {
		var r = enyo.json.parse(inResponse);//function() {
		for (var i=0, item; item=r[i]; i++) {
			var c = this.createComponent({kind: "BookmarkItem",
				ontap: "itemTap",
				}, item);
			 	c.setTitle(item.Title);
				c.setDetails(item.Address);
				c.setBeepid(item.Beepid);
		}
	},
	itemTap: function(inSender) {
		if (this.activated) {
			this.activated.applyStyle("background", null);
		}
		this.activated = inSender;
		this.activated.applyStyle("background", "lightblue");
		this.doItemSelect(inSender);
	}
});

For Inactive Pullout Tab:
enyo.kind({
	name: "BookmarkInactiveList",
	events: {
		onItemSelect: ""
	},
	create: function() { alert('Welcome to the world of ENYO');
		this.inherited(arguments);
		for (var i=0, b; b=mock_bookmarks_inactive[i]; i++) {
			var c = this.createComponent({kind: "BookmarkItem",
				ontap: "itemTap",
				}, b);
			c.setTitle(b.Title);
			c.setDetails(b.Address);
			//c.setBeepid(item.Beepid);
		}
	},
	itemTap: function(inSender) {
		if (this.activated) {
			this.activated.applyStyle("background", null);
		}
		this.activated = inSender;
		this.activated.applyStyle("background", "lightblue");
		this.doItemSelect(inSender);
	}
});
Sign In or Register to comment.