I'm trying to implement some notification on y cordova based project using AngularJS as FO.
What i did :
0/ register an id on GCM
1/ installed the plugin https://github.com/phonegap-build/PushPlugin.git
2/ included last version of cordova.js in my index.html
code :
<html ng-app="baclyApp">
<head>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/angular-growl.min.css">
<title>Bacly Mobile</title>
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top" role="navigation" id='nav1' ng-controller="navCtrl">
<div class="container-fluid">
<div class="">
<ul class="nav navbar-nav navbar-left">
<li>
<a class="navbar-brand" ui-sref="home">
Bacly Mobile
</a>
</li>
</ul>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a ng-click="init1()"><span class="glyphicon glyphicon-refresh"></span></a></li>
<li><a ui-sref="login"><span class="glyphicon glyphicon-user"></span></a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div>
</div>
<div class="navbar navbar-default navbar-static-top">
<div class='container'>
<ul class="nav nav-justified">
<li><a ui-sref="home"><span class="glyphicon glyphicon-home"></span></a></li>
<li><a ui-sref="tournois"><span class="glyphicon glyphicon-calendar"></span></a></li>
<li><a ui-sref="defi"><span class="glyphicon glyphicon-sort"></span></a></li>
<li><a ui-sref="pointage"><span class="glyphicon glyphicon-pencil"></span></a></li>
</ul>
</div>
</div>
<div class='container-fluid' id="maincontainer">
<div class"col-xs-12 col-sd-12 col-md-12 col-ld-12 container" ui-view="main">
</div>
</div>
<div growl></div>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
<script src="js/angular.js"></script>
<script src="js/underscore.js"></script>
<script src="js/angular-ui-bootstrap-test.js"></script>
<script src="js/angular-ui-router.js"></script>
<script src="js/angular-cookies.js"></script>
<script src="js/angular-growl.min.js"></script>
<script src="js/filters.js"></script>
<script src="js/xml2json.js"></script>
<script src="js/utf8_encode.js"></script>
<script src="js/moment.js"></script>
<script src="js/cordova.js"></script>
<script src="js/baclym.js"></script>
</body>
</html>
3/ in my main script at the top, i implement an event listener for device ready.
Code (beginning of baclym.js):
document.addEventListener("deviceready", function() {
var pushNotification = window.plugins.pushNotification;
console.log(pushNotification);
pushNotification.register(successHandler, errorHandler,{"senderID":"59581338115","ecb":"app.onNotificationGCM"});
function successHandler (result) {
alert('Callback Success! Result = '+result)}
function errorHandler (error) {
alert(error);
}
function onNotificationGCM (e) {
switch( e.event )
{
case 'registered':
if ( e.regid.length > 0 )
{
console.log("Regid " + e.regid);
alert('registration id = '+e.regid);
}
break;
case 'message':
// this is the actual push notification. its format depends on the data model from the push server
alert('message = '+e.message+' msgcnt = '+e.msgcnt);
break;
case 'error':
alert('GCM error = '+e.msg);
break;
default:
alert('An unknown GCM event has occurred');
break;
}
}
}, false);
4/ I run it on my device (s4 mini, android 4.4.2)
use chrome inspect devices to debug it :
i dont get any alert message nor console messages
I eventually got an error message in cordova.js but i guess this is not linked
Uncaught ReferenceError: require is not defined cordova.js:29
I should get at least a console.log about getting into document.addEventListener, but nothing.
Thx for your advice.
As long as you have specified app.onNotificationGCM callback, you should have a global variable app with the function onNotificationGCM to be called.
You can use pushbot plugin. we use this plugin and it work perfectly.
This plugin work only on android and ios device.
Related
This is my first time asking or doing this type of question
So I created this page http://lamp.cse.fau.edu/~mcuervo5/p4/
and it does your basic to do app list thing for adding and deleting stuff.
Apparently the only thing missing is to save the data on the current page. I heard that there a code that can save the current page to a local storage that has everything already in it, so when I re-open the link, instead of having nothing in the "complete and incomplete" list, it should look like this
thanks, it the only part I have left to do & I dont know if it implemented in HTMl or Jquery. I do not know how to do it.
and if you want to see the code here instead of "inspect" from the page with the link above, here it is. for html and Jquery
$(document).ready(function() {
// $('#list').innerhtml = localStorage.getItem("List");
//$('#incomplete-tasks').html("<P>I just replaced your stuff.</P>");
$("#Sumbit_Button").click(function() {
var textbox_Value = $("#textbox").val();
$('#incomplete-tasks').append('<li><span class="text" contenteditable="false">' + textbox_Value + "</span>" +
'<input/ style="display: none" class="new-value">' +
"<button type='button' class='delete'>Delete</button>" +
"<button type='button' class='edit'>Edit</button></li>");
});
$('#incomplete-tasks').on('click', '.delete', function() {
console.log('i am clicked.delete');
$(this).parent().remove();
});
$('#incomplete-tasks').on('click', '.edit', function() {
console.log("complete task click.edit");
$(this).siblings('input').show();
$(this).siblings('.delete').hide();
$(this).hide();
});
$('#incomplete-tasks').on('click', '.edit', function() {
console.log("INcomplete task click.edit");
$(this).siblings('input').show();
$(this).siblings('span').hide();
$(this).siblings('.delete').hide();
$(this).hide();
});
$('#incomplete-tasks').on('keyup', '.new-value', function(e) {
if (e.keyCode == 13) {
console.log("Complete Task _Version 2.new_value");
$(this).siblings('span').text($(this).val()).show();
$(this).siblings('input').hide();
$(this).siblings('.delete').show();
$(this).siblings('.edit').show();
$(this).hide();
}
});
$('#incomplete-tasks').on('click', '.text', function() {
var li = $(this).parent().remove().toggleClass("strikethrough");
$('#complete-tasks').append(li);
});
$('#complete-tasks').on('click', '.delete', function() {
console.log('i am clicked.delete');
$(this).parent().remove();
});
$('#complete-tasks').on('click', '.edit', function() {
console.log("complete task click.edit");
$(this).siblings('input').show();
$(this).siblings('.delete').hide();
$(this).hide();
});
$('#complete-tasks').on('click', '.edit', function() {
console.log("INcomplete task click.edit");
$(this).siblings('input').show();
$(this).siblings('span').hide();
$(this).siblings('.delete').hide();
$(this).hide();
});
$('#complete-tasks').on('keyup', '.new-value', function(e) {
if (e.keyCode == 13) {
console.log("Complete Task _Version 2.new_value");
$(this).siblings('span').text($(this).val()).show();
$(this).siblings('input').hide();
$(this).siblings('.delete').show();
$(this).siblings('.edit').show();
$(this).hide();
}
});
$('#complete-tasks').on('click', '.text', function() {
var li = $(this).parent().remove().toggleClass("strikethrough");
$('#incomplete-tasks').append(li);
});
// var save()
//{
// localStorage.setItem("List", $("#list").innerhtml());
// }
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>The Reminder list</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<script src="http://cdn.jsdelivr.net/jquery.validation/1.14.0/jquery.validate.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" />
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<!-- Custom CSS -->
<link href="css/heroic-features.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">To Do List</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
About
</li>
<li>
Services
</li>
<li>
Contact
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Page Content -->
<div class="container">
<!-- Jumbotron Header -->
<header class="jumbotron hero-spacer">
<h1> The Reminder Friend App </h1>
<p>this is my to do list app. type in the list you want to add & store in the list
</p>
<form>
<!-- textbox -->
<input type="text" id="textbox">
<!--add button -->
<input type="button" id="Sumbit_Button" value="Add">
</form>
</header>
<hr>
<div id='lists'>
<!-- Page Features -->
<div class="row text-center">
<div class="col-md-6 col-sm-6 hero-feature">
<div class="thumbnail">
<div class="caption">
<h3>Incomplete</h3>
<ul id="incomplete-tasks">
</ul>
</div>
</div>
</div>
<div class="col-md-6 col-sm-6 hero-feature">
<div class="thumbnail">
<div class="caption">
<h3>Complete</h3>
<ul id="complete-tasks">
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Footer -->
<footer>
<div class="row">
<div class="col-lg-12">
<p>Copyright © Mauricio Cuervo 2017</p>
</div>
</div>
</footer>
</div>
<!-- /.container -->
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
</body>
<script src="p4.js"></script>
</html>
Hello you can do something like this:
$("#Sumbit_Button").click(function() {
var textbox_Value = $("#textbox").val();
var list = [];
list.push(textbox_Value);
localStorage.setItem("listdata", list);
// do not manage using `append` whole html. Manage through list and display as you want
});
on page load call:
var stored = localStorage.getItem("listdata");
Now here you can manage array of items and iterate on complete & incomplete list.
So whenever any action of edit, delete, add occurs you have to just manage the localstorage instance on each call. and based on that just iterate list whereever you want.
I'm creating vertical menu for my asp.net mvc 4 web application.
so I referred this Link to integrate to my matter .
so I edited my _HECLayout.cshtml (that contains in “~/Views/Shared/”) file Like this
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src='~/Scripts/jquery-2.0.0.min.js'/></script>
<link href="~/Content/font-awesome.min.css" rel="stylesheet" />
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<link href="~/Content/css.css" rel="stylesheet" />
<script>
$(document).ready(function () {
$('ul.formxd li a').click(
function (e) {
e.preventDefault(); // prevent the default action
e.stopPropagation; // stop the click from bubbling
e.stopPropagation; // stop the click from bubbling
$(this).closest('ul').find('.selected').removeClass('selected');
$(this).parent().addClass('selected');
});
});
</script>
<meta charset="utf-8" />
<title>#ViewBag.Title - Higher Education Council</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
<div id="header">
<div id="top-area">
<div id="logo-area">
<img src="~/Images/hec-logo.png" />
</div>
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-right">
<section id="text-view" style="display: inline; width: 100%; text-align: right;" >
<p><i>Higher Education Institutes </i></p>
</section>
</div>
</div>
</header>
#RenderSection("featured", required: false)
<div id="menu_area">
<div class="hec_admin_menu" >
<ul class="formxd">
<li class="welcome"><a class="welcome"><i class="icon-fa-university"></i>Welcome HEC</a></li>
<li ><a class="dashboard" href="#"><i class="icon-dashboard"></i>Dashboard</a></li>
<li ><a class="reports" href="#"><i class="icon-file"></i>Reports</a></li>
<li><a class="administrator" href="#"><i class="icon-user"></i>Administrator</a></li>
<li><a class="search" href="#"><i class="icon-search"></i>Search</a></li>
<li><a class="logout" href="#Url.Action("Login", "HECAccount")"><i class="icon-signout"></i>Logout</a></li>
</ul>
</div>
<div class="hec_admin_body">
<section class="content-wrapper main-content clear-fix">
#RenderBody()
</section>
</div>
</div>
<footer>
</footer>
#Scripts.Render("~/bundles/jquery")
#RenderSection("scripts", required: false)
</body>
</html>
It's giving smooth view like the demo which I mentioned HERE , but logout url action not working properly.And all the urls not working properly ,
Any suggestion to overcome with his probblem
<li><a class="logout" href="#Url.Action("Login", "HECAccount")"><i class="icon-signout"></i>Logout</a></li>
I got same error when I trying to insert jquery reference like above , links doesn't working
So I referred This Link
That's an approach to give jquery reference to HTML Page , but in CSHTML when you insert #Scripts.Render("~/bundles/jquery") you don't need add one by one references like you done here ,
So remove <script type="text/javascript" src='~/Scripts/jquery-2.0.0.min.js'/></script>
keep #Scripts.Render("~/bundles/jquery") under the code
If your project doesn't have the "jquery-2.0.0.min.js" file , manually insert into "~/Script" Folder
I'm learning AJAX for the first time and I'm trying to create a simple application that calculates the grade a person needs to get on their final exam based on their previous assessment results.
The user inputs their grades into the form and then using ajax I calculate the response in response.php which should then be output in the callback function in the div with ajax as its id.
For some reason the xhr.readystate property is never reaching 4 so the response is never generated. Can anybody see what I'm doing wrong?
Please bear in mind I'm only learning...
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Grade Calculator</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
function sendAjax() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
document.getElementById('ajax').innerHTML = xhr.responseText;
} else {
document.getElementById('ajax').innerHTML = document.write('There was a problem');
}
};
xhr.open("GET","response.php");
xhr.send();
document.getElementById('gradeForm').style.display = "none";
document.write(xhr.readyState);
}
</script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active">Home</li>
<li>About</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="starter-template">
<h1>Bootstrap starter template</h1><br>
<form action="index.php" method="get" id="gradeForm">
<div class="form-group">
<label for="currentGrade">What is your current Grade</label>
<input type="text" name="currentGrade"><br>
</div>
<div class="form-group">
<label for="targetGrade">What is your target Grade</label>
<input type="text" name="targetGrade"><br>
</div>
<div class="form-group">
<label for="finalWorth">What is your final worth?</label>
<input type="text" name="finalWorth"><br>
</div>
<button type="submit" class="btn btn-default" onclick="sendAjax()">Submit</button>
</form>
<div id="ajax">
</div>
</div>
</div><!-- /.container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
Here is response.php
<?php
$currentGrade = $_GET['currentGrade'];
$targetGrade = $_GET['targetGrade'];
$finalWorth = $_GET['finalWorth'];
$neededMark = $currentGrade - $targetGrade;
$neededMark = $neededMark / $finalWorth;
$neededMark = $neededMark * 100;
$neededMark = round($neededMark);
if(isset($currentGrade, $targetGrade,$finalWorth)) {
echo $neededMark;
}
?>
The correct order of operations is:
construct
open
set handler
send
You are doing them in the order 1324, which is incorrect and therefore likely to not behave as expected.
Put things in the right order, see if that works :)
EDIT: Additionally, remove all document.write calls. They will not work with any asynchronous operation and will almost certainly break things.
EDIT EDIT: Also, <button type="submit" class="btn btn-default" onclick="sendAjax()"> - this should be type="button", otherwise your form will be submitted and it will look like it did nothing.
doesn't look like you are sending any parameters in your ajax request so response.php is not GETting any data...
if it were xhr.open("GET","response.php?param1=value1¶m2=value2"); etc you should get something
Only one small change is required
In form division make instead of submit. Because on submit the forms behaviour is different as compared to just a button click
I cannot figure out why the compare function I have and the insert function I have are not working. I believe one part of it might be because the function is never being called by the button? How exactly can I tell that? It does not seem like alerts are working in angular code.
this is my loginHandler.js
(function() {
var app = angular.module('loginHandler', []);
app.controller('LoginController', ['$http' ,function($http){
var database = this;
this.validated = false;
database.dbData = [];
$http.get('/resources/DatabaseObject.json').success(function(data){
database.dbData = data;
});
this.login = function(credentials){
loggedInUser = credentals.username;
validated = true;
$http.get('/resources/DatabaseObject.json').success(function(data){
$scope.dbData.push({"123":{"username":"meph","ip":"123","timeLastLogin":"123"}}, "session");
});
};
this.checkSession = function(){
var ip = "123456";
if(session.ip.equals(123456)){
return true;
}
};
}]);
})();
Neither of the functions are working.... Not the login or the checkSession.
DatabaseObject.json
[{
"users": {
"cra": {
"firstName": "Jn",
"lastName": "it",
"username": "dmph",
"email": "ran61#yahoo.com",
"ip": "192.168.1.1",
"password": "1234",
"computerName": "os",
"prviateKey": "1D3RW12390ASLEWRQ1235"
},
"mus": {
"firstName": "James",
"lastName": "mh",
"username": "ch",
"email": "j61#gmail.com",
"ip": "192.168.1.1",
"password": "11212",
"computerName": "ops",
"prviateKey": "1D3RW12390ASLEWRQ1235"
}
},
"session": {
"123456": {
"username": "crh",
"ip": "123456",
"timeLastLogin": "123456787654"
}
}
}]
and here is my html
<html lang="en" ng-app="gemStore">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Basic Company Template for Bootstrap 3</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- Custom CSS for the 'One Page Wonder' Template -->
<link href="css/one-page-wonder.css" rel="stylesheet">
<script type="text/javascript" src="angular/angular.min.js"></script>
<script type="text/javascript" src="script/headerPanel.js"></script>
<script type="text/javascript" src="script/errorHandler.js"></script>
<script type="text/javascript" src="script/loginHandler.js"></script>
<script type="text/javascript" src="script/sessionHandler.js"></script>
</head>
<body ng-controller="NameController as name">
<div ng-controller="ErrorController as errorController">
<div ng-controller="LoginController as loginCtrl">
<nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
<div class="container" ng-controller="CredentialsController as credentials">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">Home</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
<li><a class="act" href="#about">About</a>
</li>
<li>Services
</li>
<li>Tutorial
</li>
<li>Features
</li>
<li>Download
</li>
</ul>
<form>
<ul class="nas navbar-na">
<li ng-hide="loginCtrl.checkSession(loginCtrl.dbData.session)"><a>User ID: <input ng-model="credentials.username" type="text"></a></li>
<li ng-hide="loginCtrl.checkSession(loginCtrl.dbData.session)"><a>Password: <input ng-model="credentials.password" type="password" onkeyup="if (event.keyCode == 13) document.getElementById('loginBtn').click()"></a></li>
<li style="color: red;" ng-show="loginCtrl.checkSession(loginCtrl.dbData.session)"><h2>LOGGED IN AS {{credentials.username}}</h2></li>
</ul>
<ul class="nav navbar-nav">
<li><a ng-click="loginCtrl.login(credentials)" method="post" novalidate type="submit" href="index.html" id="loginBtn">Login</a></li>
</ul>
</form>
</div>
<!-- /.navbar-collapse -->
</div>
<div style="color: red;" ng-repeat="login in loginCtrl.dbData">
<h1>{{login.session}}</h1>
</div>
</nav>
</div>
<div style="color: red;" ng-repeat="errorArray in errorController.errors">
<h1>{{errorArray.error}}</h1>
</div>
</div>
<div class="header-image">
<div class="headline">
<div class="container">
<h1>{{name.name}}</h1>
<h2>The Impossible!</h2>
</div>
</div>
</div>
</body>
</html>
I am not sure if that submit button is ok or not.... Bah! Sorry.... Im really bad at this stuff! I hope someone can help me better understand it, I have been trying different things without anything working.
http://plnkr.co/edit/zYSFmQSU83FMC9UcXhM4?p=preview
The push doesn't work, because you have database.dbData, but trying to push into $scope.dbData (which doesn't exist).
The comparing doesn't work, because you compare against session.ip (which isn't defined anywhere).
I believe it's because you are using this. instead of $scope.
Also, you aren't passing $scope to your parameters...
app.controller('LoginController', ['$http' ,function($http){
It should be:
app.controller('LoginController', ['$http, $scope' ,function($http, $scope){
And down below you should be using: (not this)
$scope.login = function () { /* ... */ };
$scope.checkSession = function () { /* ... */ };
Within a jQuery Mobile page, I have a div which needs to be refreshed after a php mysql JSON call is made. This call updates the number of entries in a database. This update needs to be displayed within the div. I searched stackoverflow and found .listview("refresh"), .trigger("create") and other potential solutions but could not get to work. I think .listview("refresh") is not applicable since I am not using a list.
The main page has two mobile pages within it #outerwrap0 and #outerwrap1:
<html lang="en">
<head>
<title></title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile.structure-1.3.2.min.css" />
<link rel="stylesheet" type="text/css" href="models/site-templates/themes/whiteBackNavy.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<script type="text/javascript" src="scripts/shuffleMainJplayerJQM1.1.js"></script>
</head>
<body>
<!--*** PAGE 0 ***-->
<div data-role="page" id='outerwrap0' class="outerwrap" data-url="/account_m.php">
<div class="mineBox">
... php ...
</div
</div
<!--*** PAGE 1 ***-->
<div data-role="page" id='outerwrap1' class="outerwrap" data-url="/account_m.php">
<div class="mineBox">
... php ...
</div
</div
the applicable portion of the shuffleMainJplayerJQM1.1.js javascript, wherein the php is updated and code should be called to refresh the div is:
$(".adder").click(function() {
$.ajax({
url: 'AddToMine1.2.php?id=' + currentId,
type: 'POST',
dataType:'json',
success : function (result) {
var errorCode = (result['errorCode']);
switch (errorCode) {
case 0: alert(result['errorMess']);
break;
case 1: alert(result['errorMess']);
break;
case 2: break;
}
},
error : function () {
alert("error");
}
});
// not working - would like to refresh mineBox div here
$(".mineBox").trigger("create");
});
Here is the contents of .mineBox after rendering:
<div class="mineBox">
<p align=center>
<img src="../images/mine_block_full.jpg" width="14%" align="absmiddle" />
</p>
<p align=center><img src="../images/mine_block_full.jpg" width="14%" align="absmiddle" />
</p>
<div data-role="popup" id="popupMenuPM1" data-theme="a" data-overlay-theme="a">
<ul data-role="listview" data-inset="true" >
<li data-role="divider" data-theme="a">Be</li>
<li>Play</li>
</ul>
</div>
<div data-role="popup" id="popupMenuPM2" data-theme="a" data-overlay-theme="a">
<ul data-role="listview" data-inset="true" >
<li data-role="divider" data-theme="a">Want Girl</li>
<li>Play</li>
</ul>
</div>
</div>
Your assistance is greatly appreciated. Thank You!