Get jquery cookie using angular - javascript

I'm using jquery.cookie v1.4.1 to set a cookie like this
$.cookie('userCookie', $("#user").val());
Where $("#user").val() is returning something like 'username'
Then in an angular app, am trying to retrieve this cookie using
var userCookie = $cookies.get('userCookie');
But is not working, I'm getting:
var userCookie = undefined
I'm using AngularJS v1.4.8 with corresponding ngCookies
Any help would be nice....

Thanks to charlietfl I got it to work.
It happens that I was setting the cookie for a specific path, let say '/domain/somepath' and then I was trying to retrieve it from '/domain/someotherpath', where the cookie was not available.
I fix it specifying the path on the cookie to all my domain like this:
$.cookie('userCookie',$("#user").val(), { path: '/' });

Why don't you use angular to store your cookies?
$cookies.put('userCookie', $("#user").val());
Btw: its horrible if you use JQuery like this inside your Angular App.
$cookies.get('userCookie');
Your problem maybe: the cookie will be created BEFORE your DOM-Element is even rendered on the page. Try $.cookie('userCookie', 'test123'); , this should work pretty sure (with angular 100%).
How to fix this? First of all, DONT USE JQUERY LIKE THIS IF YOU HAVE ANGULAR!!!
<input ng-model="username"></input>
$cookies.put('userCookie', $scope.username);

Related

How to use display/view only Twproject Gantt?

I am trying to using Twproject Gantt. I don't form GitHub.
But, I just want to use display/view only. I don't need add or edit or others function.
I already try to configure"canWrite":false.It does not work. How to configure view only mode in Twproject Gantt?
Configure view only mode : (i am using this settings)
First, you need to remove all save and delete button to prevent client mistaken it. (search this one for this issue) :
class="template" type="GANTBUTTONS"
then when DB load , try to set the json there like this one :
{
"tasks":[],
"selectedRow":0,
"canWrite":false, //is a must
"canWriteOnParent":false, //is a must
"roles":[], //optional
"resources":[] //optional
}
May this answer your question.
Moreover, you can browse this one Documentation
or github jQueryGantt

ngCookies doesnt work properly after i refresh the page

Im using angularjs in my project , and when the client log in , than a service save his information in the cookies .
by using this code:
$cookies.put('username',$rootScope.username);
or
$cookies.username = $rootScope.username;
i try them both.
in the first try , i tried : console.log($cookies.get('username'); and it doesnt work at all.
but in the second try when i tried : console.log($cookies.username); it did print the information.
but after i refreshed the page , this $cookies.username; didnt work anymore..
what maybe the problem?
To access the cookie you need to do $cookies.get('username')
It seems in your first console.log there is a typo, you're missing the last parenthesis
Try this
console.log($cookies.get('username'));
Also, make sure your $rootScope.username attribute has a value in it

Angular js Remove query parameters when changing the url

I am facing issue in angular js, right now we have two urls in our application,
http://localhost/xyz?page=documents&view=grid&sortorder=desc&sortby=updatedate&limit=35&offset=0
and then we another url
http://localhost/abc
When i move from the first url to the second url it carries the query params from the first url, this is how the second url looks like
http://localhost/abc?page=documents&view=grid&sortorder=desc&sortby=updatedate&limit=35&offset=35
We don't the fetch url carrying the query params from the first page. I am new to angular js, I have came across few options like
$location.search({});
$location.url($location.path())
But those didn't work at all.
I think i know what you mean, to remove parameters use
$location.url($location.path());
Hope it helps
Check this documentation for the location with angular
1.Save the query object $location.search()in some place (local storage or cookies), then in the target controller $.map(query,funcion(k,v){ $location.search(k,v});
2.Dynamically append to the end url2 + $location.path() in href attribute
$location.url changes path, search and hash.
So, $location.url('new_path') should work!

Can i pass information through the URL when i am using jQuery Mobile?

I have a mobile application that opens an in-app browser that uses the URL to pass information to my server , like the deviceID.
For example the browser will open the web-page (jquery Mobile) : www.myserver.com/doWork.html#deviceID
On the server part using JavaScript inside the doWork.html file, I get the deviceID like this:
var userId = window.location.hash.substring(1);
Is it ok that i pass information using the hash # ? In jquery mobile the hash # is used to change between pages when someone uses the Multi-Page template structure . So i am afraid that maybe i should use something else , like a question mark (?) ?
Or its perfectly fine ?
NO. Stop using # for your data transfers. Let jQM do its thing. Don't disturb it. Use Query strings( adding ? in url). My advice is to stop using query strings (? tags) and # tags to send data to the next page. Handle it using localStorage. Its more secure compared to Query strings because the user wont see the URL change, so your sensitive data is hidden, at least to a little extent. localStorage is HTML5's API which is like a temporary storage set aside per domain. This data will persist until data is cleared in cache. Assuming you have an anchor tag which goes to dowork.html,
Go to Do work
Add an attribute for device ID in the tag itself, like this :
Go to Do work
You'd be doing this dynamically you might also use it the same way. You get the gist right?
A click event for this would look like this :
$(document).on("click", "a", function(e) //use a class or ID for this instead of just "a"
//prevent default
e.preventDefault();
//get device id from tag attribute
var deviceId = $(this).data("deviceid");
//set it in localStorage
localStorage["dId"] = deviceId;
//redirect
$.mobile.changePage(this.href);
});
Then, in the other page's pageinit (or any event), get the device id from storage and send the ajax call to the server.
//assuming #dowork is the id of a div with data-role="page"
$(document).on("pageinit", "#dowork", function() {
//get from storage
var deviceId = localStorage["dId"];
//make ajax call or server call with deviceId here
});
But, if you still want to use URL for this, look at this question. I've given a decent enough answer over there.
To pass variables to the server you should avoid using the # symbol because regardless of the framework you are using this symbol is used for other purposes, to pass info to the server in a GET request you should use the ? symbol, something like this should do it: www.myserver.com/doWork.html?deviceID=1233455

Symfony2 routing with dynamic javascript - OR - installing FOSJsRoutingBundle

I'm trying to find the best way to deal with dynamic routing generated through an AJAX call with Symfony2.
When a new call is made, I need the current path to be available , along with some dynamic variables that get passed into the path.
Essentially this .
A few answers have suggested putting the route into a variable within each templete , such as
<script type="text/javascript">
var productPath = {{ path("acme_myBundle_default_product" , {"magazine" : "bobscheese" , "product" : "chedderfornoobs"}) }};
</script>
The issue here is, the path rely s on variables, that won't exist at runtime (namely $magazine and $product).
A perfect solution would be FOSJsRoutingBundle it seems , but the installation doesn't seem to be up to date with the latest Symfony2 .
Installation runs fine with git submodule add git://github.com/FriendsOfSymfony/FOSJsRoutingBundle.git vendor/bundles/FOS/JsRoutingBundle
but then I think the rest of the ReadMe is out of date, following it gives me a blank screen, with no errors in the log.
So my question is , either , how to install FOSJsRoutingBundle in Symfony2.1.3 , or how best to handle client side generated URLS within Symfony2.
FOSJsRoutingBundle can be normally used in my environment(2.1.3).
Does routing go wrong?
Has it set up?
acme_myBundle_default_product:
pattern: // ...
defaults: // ...
options:
expose: true
I just went down the
<script type="text/javascript">
var basePath = 'http://www.mybaseurl.com';
</script>
Route. Not as fulfilling, but worked for me in this case.

Categories