When I check Firebug or Chrome's development tool, I can't seem to detect a POST ajax request being made. The strange thing is that while I can't see the output of console.log(data) inside the success in Firebug, it does show up in Chrome.
Let's take a look at my controller comments:
var gameApp = angular.module("gameApp", ['ngRoute','ngSanitize']);
gameApp.service('link', function() {
this.user = false;
});
gameApp.directive('mapActivity', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
scope.$watch('tabledata', function() {
angular.element('.click#1').addClass('dotted').html($("<img src='images/dot.png'>"));
var j = null;
for(var i = 1; i <= 4; i++)
{
$.ajax({
type: 'GET',
url: 'lib/terrain.php',
dataType: 'html',
data: {i: i},
success: function(data) {
var randomRuta = Math.floor((Math.random() * 100) + 1);
angular.element('.click#'+randomRuta).addClass('monster').html($("<img src='images/blackdot.png' title='"+data+"'>"));
},
error: function(xhr, ajaxOptions, thrownError) { alert(thrownError); }
});
j=i;
}
angular.element('.click').click(function() {
if(angular.element(this).hasClass('monster'))
{
if(confirm('Vill du anfalla monster?'))
{
alert("Du vann");
angular.element('.click.monster'+j).empty();
angular.element('.click.monster').removeClass('monster'+j);
angular.element('.click.dotted').empty();
angular.element('.click.dotted').removeClass('dotted');
angular.element(this).addClass('dotted');
angular.element('.click.dotted').html($('<img src="images/d...);}
...
In my HTML:
<div ng-controller="gameCtrl">
<table ng-bind-html="safeHtml()" map-Activity>
</table>
</div>
I am puzzled as to why console.log seems to malfunction in Firebug and why the AJAX post request isn't easily visible. Any suggestions?