I'm new to MEAN Stack and is trying to do a simple project on it. I was trying to read
a QR code and get the value of that QR code(which is an ID) and use that ID to fetch ID details from db.
I have a controller where I wrote the code for scanning the QR code and then redirect the user to a new page where the details
will be displayed.
window.location.href='http://localhost:3030/track/'+id;
On the redirecting page's controller I used the routeParams to get the id
angular.module('trController',[])
.controller('trCtrl',function($http,$routeParams){
var id = $routeParams.id;
$http.get('/api/track/'+id).then(function(data){
console.log('data displayed');
});
});
and passed it to my api.js file where i wrote the remaining code
router.get('/track/:id',function(req,res){
var ID = req.params.id;
//code for getting details from DB
});
My router code is
.when('/track/:id',{
templateUrl : 'app/views/pages/track.html',
controller: 'trCtrl',
controllerAs: 'track'
})
Sorry for the naive code as I'm new to this. What am i doing wrong? Plz help
Related
Hi I have this signtaure pad with Vuejs:
Signature pad code
I am trying to send this data into a controller to store it, but when I do this:
const { isEmpty, data } = this.$refs.signaturePad.saveSignature();
console.log(isEmpty);
console.log(data);
let formData = new FormData();
formData.append('signtaure', this.$refs.signaturePad.saveSignature());
axios.post('/api/employee/update/27141399-8?api_token='+App.apiToken, formData, config)
.then(function (response) {
currentObj.success = response.data.success;
})
If I check the console.log() it displays this:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABioAAAJxCAYAAADcoOoFAAAAAXNSR0IArs4c6QAAIABJREFUeF7s3c+LrUmaF/AYN25GqkXGndbIbEQYSxQUV+WAi9lIzT8g1S5ddbkQXAhVsxSErlq7qGpcupgqcCHCYNfGhQhjLcQfMM604CC6GAsFR8Fp+eL7jNGnT96b92bmiXif83khOXnvPXki4vNEZla93xMRPzNcBAgQIECAAAECBAgQIECAAAECBAgQIECAAIFFAj+zqF3NEiBAgAABAgQIECBAgAABAgQIECBAgAABAgSGoMIkIECAAAECBAgQIECAAAECBAgQIECAAAECBJYJCCqW0WuYAAECBAgQIECAAAECBAgQIECAAAECBAgQEFSYAwQIECBAgAABAgQIECBAgAABAgQIECBAgMAyAUHFMnoNEyBAgAABAgQIECBAgAABAgQIECBAgAABAoIKc4AAAQIECBAgQIA
I check the laravel controller to get the file like this:
$request->signature;
And it is empty.. a blank value so I wonder how can I send the base_64 image with vuejs to the controller because how I am doing it does not work
You append the signature to the formdata object like this:
formData.append('signtaure', this.$refs.signaturePad.saveSignature());
In the laravel controller you're checking for the signature property on the request object.
Notice the typo you've made within the append function? signtaure != signature.
#julianstark999 also made a comment about this, but I think you misinterpreted his comment, so I'm explaining it again :)
I have made dynamic pages for my recipes in Wix and I had an user form for feedback in the dynamic pages , I'm able to get the feedback but can't able to know for which item they are ?
I want to get the title of recipe along with the user feedback into
my database.
Please help me solve it.
You can get information from the Dynamic Dataset like this:
var myVariable;
$w("#dynamicDataset").onReady( () => {
let itemObj = $w("#dynamicDataset").getCurrentItem();
myVariable = itemObj.fieldKey; //get the relevant field key
});
After this you can submit the data using the Wix Data API. Just make sure to pass on the myVariable so that you know where the submission came from. Sample code below.
let data = {
fieldKey1: randomVariable,
fieldKey2: someVariable,
pageInfo: myVariable
}
wixData.insert('collectionName', data);
Read more about dynamic dataset's getCurrentItem() function here: https://www.wix.com/corvid/reference/wix-dataset.DynamicDataset.html#getCurrentItem
Also, the submission has to go through using the Wix Data API's insert() function. Read about it here: https://www.wix.com/corvid/reference/wix-data.html#insert
I have Post show method where i show each post by their id and this is how it's look like:
$post = Post::find($id);
$comments = Comment::where('post_id', '=', $post->id)->get();
return view('single', compact('post','comments'));
with this i can basically load my post details and foreach that post comments (so far so good).
What I want to do
Is to get my comments by ajax, so for example when user 1 is reading the post and somewhere else user 2 add new comment user 1 see it imminently. So user 1 doesn't need to refresh the page to see the new comment.
Question
How can I do that?
You can use channels of Laravel combined to redis server. Each time you store a comment you can push to the post channel your comment and display it with ajax (use laravel echo server). All subscribed users to this channel will receive the new comment.
This is how I would do this
PHP
Route::get('/posts/{post}/comments', 'PostsController#comments');
public function post(Post $post) {
return response()->json(
Post::with('comments')->get() // Create HasMany relation named "comments", see Eloquent Relationships
);
}
Javascript
(function($) {
var intervalMiliseconds = 5000;
var pool = function() {
$.ajax({
method: 'GET',
url: '/post/100/comments',
success: function(response) {
console.log(response);
}
});
};
setInterval(pool, intervalMiliseconds);
})(jQuery);
Please avoid using PHP code in your javascript code, simply move all JS code to *.js files, and most if not all the required data from PHP pass by using data-* element attributes
Best to give more context to this first.
I am creating an Single Page Application with vuejs, vue-router. When the user logs in the user object is returned from the backend. I am using Laravel 5.4 for the backend. The user object is then sorted on the vue $root instance so it can be accessed anywhere by using this.$root.user.
My only problem is that when I want to edit the user data, I have an edit form in which the user data should be automatically populated with the existing data. This would be fine if I just wanted to do something like this: v-model="this.$root.user.first_name" but I have a form object which helps with validation and making everything more modular.
So in the data return I have this on the router-view component:
data: function() {
return {
form: new Form({
first_name: this.$root.user.first_name,
last_name: this.$root.user.last_name,
country: this.$root.user.country,
preffered_currency: this.$root.user.preffered_currency,
email: this.$root.user.email,
})
}
}
The only problem is that everything is undefined. I'm not sure how to get around the problem so any help which be appreciated. Thanks.
I figured a way to do it.
What I forgot to add is that on refresh of the page obviously vue forgets about all of the current stored data so because of that I have to make a request to the backend to get the current user.
So when the ajax request is made to get the current user I created a new Vue object in which all objects can see and assigned it to Window.Event and created a new Vue instance against that. Window.Event = new Vue({});
Now once the ajax request has returned I did Window.Event.$emit('user', this.user) and on the component which needed the user data I just created an $on event with create().
created() {
Window.Event.$on('user', function(user){
this.form.first_name = user.first_name
this.form.last_name = user.last_name
this.form.country = user.country
this.form.preffered_currency = user.preffered_currency
this.form.email = user.email
}.bind(this));
}
Is there any way to get Instagram public profile data as per new API?
According to Instagram, these are the steps that I need to follow:
Create an application by providing site url and redirect url.
Redirect your user using oAuth and generate access token.
Now using the proper url and access token we can get user data.
I did each step and generate access token properly now I am using ajax to hit the url
https://api.instagram.com/v1/users/searchq='+inst.instagramId+'&access_token='+inst.accessToken
where inst.instagramId is user id and inst.accessToken is access token.
Response contain code 200 that is ok but data is empty.
Thanks for any help.
Actually with the new Instagram api it is impossible to get public data or tags. The only information you can get with instagram's new api is your data, or access token's owner data.
I wrote a proxy API for this exact purpose: https://github.com/whizzzkid/instagram-proxy-api
Let's take an example of #nyc:
Instagram's tag explorer: https://www.instagram.com/explore/tags/nyc
Getting the same results as JSON: https://igpi.ga/explore/tags/nyc/media
You can find more examples in the repo. Here is the code that does all this: https://github.com/whizzzkid/instagram-reverse-proxy/blob/master/app.js
A demo application using jquery will be:
$.ajax({
url: "https://igpi.ga/explore/tags/yyc/media",
dataType: "jsonp",
data: { count: 3 },
success: function (json){
for(var i in json.posts) {
var img = document.createElement("IMG");
img.src = json.posts[i].display_url;
document.body.appendChild(img);
}
}
});
Demo: http://plnkr.co/edit/4oCwpbMm6p9cyJb1UWld?p=preview
hope this helps.