I'm using seatwaves api and have run into an error, The issue is that when i load hte table that the json is on i run into this error in the console No 'Access-Control-Allow-Origin' header is present on the requested resource.
i'm still quite new to this so any help or all the help would be so greateful!
Thanks
Sam
Heres the ajax code
$.ajax({
type: 'GET',
crossDomain: true,
dataType: 'json',
url: 'api link for seatwave',
success: function(json) {
//var json = $.parseJSON(data);
for (var i = 0; i < json.results.TicketGroups.length; i++) {
var section = json.results.TicketGroups[i].TicketTypeName;
var no = json.results.TicketGroups[i].Qty;
var price = json.results.TicketGroups[i].
Price;
var button =
"<button class='btn btn-info' data-url='LINK'>Click Here</button>";
$("#tableid").append("<tr><td>seatwave</td><td>" + section +
"</td><td>N/A</td><td>N/A</td><td>" + no +
"</td><td>£"+price +
"</td><td>" + button + "</td></tr>");
$("#tableid").find(".btn.btn-info").click(function() {
location.href = $(this).attr("data-url");
});
}
sortTable();
},
error: function(error) {
console.log(error);
}
});
Related
Trying to get the user of a html page that resides in a SP document library. I tried doing something similar what is in this SO post but getting undefined. How can I get the user currently on the page? Thank you.
The function where I am trying to get the current user is $scope.updateTicket()
Below is the all of the JS code.
var app = angular.module('myApp', []);
var reports = [];
var areports = [];
var breports = [];
app.controller('myController',
function($scope, $http) {
$http({
method: 'GET',
url: ".../_api/web/lists/GetByTitle('tickets')/items?$top=1000&$select=ID,comments,ticket_number,status,date",
headers: {"Accept": "application/json;odata=verbose"}
}).success(function (data, status, headers, config) {
$scope.reports = data.d.results;
$scope.openModal = function() {
$getFormDigest = function() {
console.log("Inside getFormDigest...");
var formdigest;
jQuery.ajax({
url: "..._api/contextinfo",
type: "POST",
async: false,
headers: {
"accept": "application/json; odata=verbose",
type: "POST"
},
success: function(data)
{
formdigest = data.d.GetContextWebInformation.FormDigestValue
}
});
return formdigest;
}
$scope.updateFunc = function(itemID, new_comment) {
console.log('In update function...', itemID);
var formdigest = $scope.getFormDigest();
jQuery.ajax({
url: ".../_api/web/lists/GetByTitle('tickets')/items(" + itemID + ")",
type: "POST",
data: JSON.stringify({
'__metadata': { 'type': 'SP.Data.ticketsListItem' },
'comments': new_comment
}),
headers: {
"accept" : "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
"X-RequestDigest": formdigest,
"IF-MATCH": "*",
"X-HTTP-Method": "MERGE"
},
success: function(data)
{
console.log("comments updated successfully...");
},
error: function(data)
{
console.log($("#__REQUESTDIGEST").val());
console.log("Error message: " + JSON.stringify(dta.responseJSON.error));
}
});
}
$scope.updateTicket = function() {
jQuery.ajax({
url: ".../_api/web/currentuser?select=Title",
type: "GET",
success: function(data)
{
var title = data.d.Title;
console.log(title);
},
error: function(data) {
console.log("Error occurred trying to get user Title");
}
});
var submitter = document.getElementById("submitter");
var context = SP.ClientContext.get_current();
var web = context.get_web();
var user = context.get_web().get_currentUser();
context.load(user);
console.log("User: " + web.get_currentUser().$5_0.$H_0.Title);
//var submitter = web.get_currentUser().$5_0.$H_0.Title;
var now = new Date();
var timestamp = (now.getUTCMonth() + 1 + "/" + now.getUTCDate() + "/" + now.getFullYear() + " " + ("0" + now.getUTCHours()).slice(-2) + ":" ("0" + now.getUTCMinutes()).slice(-2));
var temp = document.getElementById('comments').innerHTML;
temp += '<br>' + timestamp + ' -- ' + submitter + '<br>' + document.getElementById('comment-field').value + '<br>';
document.getElementById('comments').innerHTML = '<br>' + temp + '<br>';
$scope.updateFunc(document.getElementById('id').innerHTML, temp);
document.getElementById('comment-field').value = '';
document.getElementById('myModal').style.display = 'none';
location.reload();
};
modal.display = "block";
};
}).error(function(data, status, headers, config) {
console.log("an error occurred...");
});
var modal = document.getElementById('myModal');
var span = document.getElementByClassName("close")[0];
span.onclick = function() {
modal.style.display = "none";
}
window.onclick = function(event) {
if(event.target == modal) {
modal.style.display = "none";
}
}
});
In the head of my HTML file I'm pulling in the following SP libraries
init.js
MicrosoftAjax.js
sp.core.js
sp.runtime.js
sp.js
if we are talking about SharePoint OnPrem then You may always use _spPageContextInfo object which have many information about current context. In this object You also have the current user id and login in userId prop and userLoginName prop
Yep _spPageContextInfo.userDisplayName is all you need:
_spPageContextInfo.userDisplayName
_spPageContextInfo.userEmail
_spPageContextInfo.userId
_spPageContextInfo.isSiteAdmin
Hello I am new to APIs and I am struggling a lot with the Flickr API. I tried looking up videos and articles and it was overwhelming. What I am trying to do for my project is have a user search up restaurants using the Yelp API. Once they get a list of restaurants, each list item will have a select button. When the user clicks the select button, images of that location should pop up in a div on the HTML page. I manage to get the Yelp API to work however I am struggling with how to make the images load when the user clicks the select button. I am completely lost and any help would be appreciated. Below is my code.
HTML:
<div class="col-xs-6">
<h2 id="title">Manhattan</h2>
<div>
<h2>Photos</h2>
<div id="photos"></div>
</div>
</div>
JavaScript:
$(document).ready(function () {
$('#getposts_form').submit(function(event) {
event.preventDefault();
$('#output').empty();
var search = $('#search').val();
var title = $('#title').text();
var categories = $('#categories').val();
var price = $("#price").val();
console.log(search);
console.log(categories);
console.log(price);
$("#ajaxIndicator").modal('show');
// make the ajax request
$.ajax({
url: 'yelp.php',
type: 'GET',
dataType: 'JSON',
data: {
location: title,
categories: categories,
price: price
},
success: function(serverResponse) {
console.log(serverResponse);
var businesses = serverResponse.businesses;
console.log(businesses);
var myHTML = '';
for(var i = 0; i < serverResponse.businesses.length; i++){
myHTML += '<li class="tweet list-group-item">';
myHTML += '<ul class="list">'
myHTML += '<li><span class="user"><b>' + serverResponse.businesses[i].name + '</b></span></li>';
myHTML += '<li><span class="user">' + serverResponse.businesses[i].price + '</span></li>';
myHTML += '<li><span class="user">' + serverResponse.businesses[i].latitude + '</span></li>';
myHTML += '<li><span class="user">' + JSON.stringify(serverResponse.businesses[i].categories) + '</span></li>';
myHTML += '<li><span class="user"><button class="btn btn-default" type="submit" id="select">Select</button></span><li>';
myHTML += '</ul>'
myHTML += '</li>';
}
$('#output').append(myHTML);
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('error');
console.log(errorThrown);
console.log(jqXHR);
},
complete: function() {
$("#ajaxIndicator").modal('hide');
}
});
});
//ajax call for flickr api
$('.select').submit(function(event) {
event.preventDefault();
$('#photos').empty();
var lat = $('#lat').val();
var long = $('#long').val();
$("#ajaxIndicator").modal('show');
make the ajax request
$.ajax({
url: 'http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key="here i added my own key"&format=json&nojsoncallback=1',
type: 'GET',
dataType: 'JSON',
data: {
//lat: lat,
//long:long,
},
success: function(serverResponse) {
console.log("flickr");
console.log(data);
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('error');
console.log(errorThrown);
console.log(jqXHR);
},
complete: function() {
$("#ajaxIndicator").modal('hide');
}
});
});
What you need to do is
Extract the urls and store them in an array
Loop through array, creating a new child image with the src set correctly
var photos = $("#photos")
for (var i = 0; i < arr.length; i++) {
var image = "<img src=" + encodeURL(arr[i]) + "></img>"
photos.append(image)
}
I think that you should focus on simpler apis for the time being
How do I use this library localstorage-adapter.js to be able to store data from my server query processing??
I get a library when i see the app from Christophe Coenraets then I want to try it into my application.
My code to access data from server :
$(document).ready(function() {
$('#loading_panel').show();
get_news();
function get_news(){
var serviceURL = "http://www.mydomain.com/api/";
var SistemPakar;
$.ajax({
type : 'GET',
url : serviceURL + 'news.php',
async: true,
beforeSend: function(x) {
if(x && x.overrideMimeType) {
x.overrideMimeType("application/j-son;charset=UTF-8");
}
},
dataType : 'json',
success : function(data){
AllData = data.items;
if(AllData==''){
$('#loading_panel').hide();
$('#empty').show();
}else{
$('#loading_panel').hide();
$('#tampilData').show();
$.each(AllData, function(index, loaddata) {
var data = loaddata.id;
var image = loaddata.img;
var tanggal = loaddata.tanggal;
var strExplode = tanggal.split("-");
var strJoinExplode = strExplode[2]+ '-' +strExplode[1]+ '-' +strExplode[0];
$('#sispakList').append(
'<img src="logo/'+image+'.png"/>'+
'<h4>' + loaddata.judul + '</h4>' +
'<p>' + loaddata.isi +'</p>' +
'<p>' + strJoinExplode + '</p>');
});
$('#sispakList').listview('refresh');
}
},
error: function(jqXHR, exception) {
$('#loading_panel').hide();
$('#conn_failed').show();
}
});
}
});
How do when the data is first captured by the results of the application and use localstorage-adapter.js to save the data as a mechanism that made Christophe Coenraets on the application??
Hi I am getting an error while implementing the following.
When I click on the "save" button in following code:
<td width="20%"> <input id="save" onClick="updateMouseInfo();" type="button" value="Save" /></td>
I want to call the mouse_id parameter from getMouseInfo() function to updateMouseInfo() and I am getting the error that mouse_id is undefined, so please help me with the solution.
function getMouseInfo(mouse_id)
{
var dataString = {auth_token: sessionStorage.auth_token, id: mouse_id};
var mh_url = MH_HOST + '/mice/get_mouse_info.json';
alert("Inside Mouse Get Info");
$.ajax(
{
type: "POST",
url: mh_url,
data: dataString,
dataType: "json",
success: function (data)
{
//for (var info_count = 0, info_len = data.length; info_count < info_len; info_count++ );
//{
alert("Inside for loop");
//var mouse_info = data.cage.mice[info_count];
var ear_tag = document.getElementById("ear_tag");
var age = document.getElementById("age");
var genotype = document.getElementById("genotype");
var owner = document.getElementById("owner");
//var born = document.getElementById("born");
//var euthanize = document.getElementById("euthanize");
//var note = document.getElementById("note");
ear_tag.innerHTML = data[0].ear_tag;
age.innerHTML = data[0].age;
genotype.innerHTML = data[0].genotype_id;
owner.innerHTML = data[0].owner_id;
//born.innerHTML = data[0].dob;
//euthanize.innerHTML = data[0].dob;
//note.innerHTML = data[0].dob;
//}
},
error: function (data)
{
alert("fail");
}
});
}
//update mouse info
function updateMouseInfo(mouseid)
{
var ear_tag = $('#input_ear_tag').val();
var age = $('#input_age').val();
var genotype = $('#input_genotype').val();
var owner = $('#input_owner').val();
var dataString = {auth_token: sessionStorage.auth_token, id: mouseid, mouse:
{ear_tag: ear_tag, age: age,}};
var mh_url = MH_HOST + '/mice/update.json';
alert("Inside Mouse update Info");
console.log('Data String='+ dataString.auth_token + 'Mouse id=' + dataString.id);
$.ajax(
{
type: "POST",
url: mh_url,
data: dataString,
dataType: "json",
success: function (data)
{
document.getElementById('ear_tag').innerHTML = "<div" + ear_tag + "'>" + ear_tag + "</div>";
document.getElementById('age').innerHTML = "<div" + age + "'>" + age + "</div>";
document.getElementById('genotype').innerHTML = "<div" + genotype + "'>" + genotype + "</div>";
document.getElementById('owner').innerHTML = "<div" + owner + "'>" + owner + "</div>";
},
error: function (data)
{
alert("fail");
}
});
}
I am getting the following error in the browser console.
m_id=99
Data String=pvHxzkr3cys1gEVJRpCDMouse id=undefined
Whereas the id should be 99 in the above case it is showing undefined.
You are calling the updateMouseInfo function in the following manner:
onClick="updateMouseInfo();"
if you want to have same mouseid value which is taken by getMouseInfo() function when you call updateMouseInfo(),you will have to globalize getMouseInfo()
Hope it works.
I am new to javascript. I have worked on twitter API. In twitter API i used jQuery.ajax function to get json data from twitter servers. But when i use the same option with google maps server, my app isn't giving any response the moment it enters the jQuery.ajax. I tried to debug it using jslint, but it came out clean. I used debugging using alert, and it stops when it enters jQuery.ajax function. Is meathod to retrieve data varies with the source ?
If not why isn't my code responding ?
Twitter running function ::
var twitterapi = "http://search.twitter.com/search.json?";
jQuery.ajax(
{
type: "GET",
url: twitterapi,
data:
{
"q": hashtag,
"rpp": 1000
},
dataType: 'jsonp'
}).done(function (response)
{
var results = response.results;
for (var i = 0; i < results.length; i++)
{
$("#tweet").prepend("<li class='tweet'>" +
"<img src='" +
results[i].profile_image_url +
"'/>" +
"<span class='username'>" +
results[i].from_user +
"</span> <span class='tweet_content'> " +
results[i].text +
"</span></li>");
}
});
My google maps API(not working)
var j = 2;
var friends = [];
var distance =[];
$(document).ready(function () {
alert("function started");
$('#button').click(function () {
if (j < 11) {
$('#friends').append('Friend' + j + ':<input type="text" id="friend' + j + '"/><br/><br/>');
j++;
}
else {
alert("Limit reached");
}
});
$('button').click(function(){
var a =[];
alert("button clickede");
for(i=1;i<=j;i++)
{
a[i] = $("#friend" + i).val();
}
var gurl = "http://maps.googleapis.com/maps/api/distancematrix/json?"+
"origins=" +
a.join('|').replace(/ /g,'+') +
"&destinations=" +
a.join('|').replace(/ /g,'+') +
"&sensor=false";
alert("making request to" +gurl);
jQuery.ajax(
{
type: "GET",
url: gurl,
dataType: 'jsonp'
}).done(function (response)
{
alert("request made to"+gurl);
var rows = response.rows;
alert(row[0].elements[0].value);
for(var i=0;i<rows.length;i++)
{
for(var j=0;j<elements.length;j++)
{
distance[i][j] = row[i].elements[j].distance.value;
}
}
alert(distance[0][0]);
});
});
});
I don't know what error are you getting so i can't be of much help.
But the code you posted has three issues:
1- Since a is undefined, i couldn't get past the first two lines.
2- Removing the a calls in the code, then it threw a Syntax Error. I fixed this by removing the last }); line.
3- It made the request, but it threw another error (probably because the URL was malformed).