Develop Reference

Access name column elements from a Sharepoint list using REST

I am using the following code to pull back items from a SharePoint List
function getItems(url) {
return $.ajax({
url: _spPageContextInfo.webAbsoluteUrl + url,
type: "GET",
headers: {
"accept": "application/json;odata=verbose",
}
});
}
getItems( "/_api/Web/Lists/GetByTitle('Reporting%
20Listing')/Items" ).done(function(data){
data.d.results.forEach(function(item){
console.log( item.ID, item.Title, item.ApprovalName,
item.ApprovalDate );
});
});
This is working fine except item.ApprovalName is not returning any value.
Do I need to somehow reference which element of the ApprovalName array that I want? I've looked through several reference but don't see an example.

Sample demo to expand multiuser field.
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript">
SP.SOD.executeOrDelayUntilScriptLoaded(GetListItems, "sp.js");
function GetListItems() {
var apiPath = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('MyList3')/items?$select=Title,MultiUsers/Name,MultiUsers/EMail&$expand=MultiUsers";
$.ajax({
url: apiPath,
headers: {
Accept: "application/json;odata=verbose"
},
async: false,
success: function (data) {
if (data != null) {
for (var i = 0; i < data.d.results.length; i++) {
console.log(data.d.results[i].Title);
for (var j = 0; j < data.d.results[i].MultiUsers.results.length; j++) {
console.log(data.d.results[i].MultiUsers.results[j].Name);
}
}
}
},
eror: function (data) {
console.log("An error occurred. Please try again.");
}
});
}
</script>

using javascript/jquery/api to display something about concerts

I have this http://apis.is/concerts
which displays concerts that are upcoming in an API and I see that there are Images in it that I'm not able to display, I have made for loops that iterate through the objects and gets one by one and I see that every sixth one has an image link associated with it, How can I make that link for every sixth element in each object turn into an image?
I'm really sorry if this isn't written really well because i'm very bad at writing long stuff and explaining.
$.ajax({
url: 'http://apis.is/concerts',
type: 'GET',
dataType: 'json',
success: function(response) {
var results = response["results"]
for(var i in results) {
for(var x in results[i]) {
var the_text = results[i][x]
$("#objects").append("<p>"+ the_text +"</p>")
}
$("#objects").append("<br>")
}
}
});

If the_text contains the letters "jpg," append an image. Otherwise, append the text:
if(/jpg/.test(the_text)) {
$("#objects").append("<img src='"+ the_text +"'>");
} else {
$("#objects").append("<p>"+ the_text +"</p>");
}
Snippet:
$.ajax({
url: 'http://apis.is/concerts',
type: 'GET',
dataType: 'json',
success: function(response) {
var results = response["results"]
for(var i in results) {
for(var x in results[i]) {
var the_text = results[i][x]
if(/jpg/.test(the_text)) {
$("#objects").append("<img src='"+ the_text +"'>");
} else {
$("#objects").append("<p>"+ the_text +"</p>");
}
}
$("#objects").append("<br>")
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="objects"></div>

$.ajax({
url: 'http://apis.is/concerts',
type: 'GET',
dataType: 'json',
success: function(response) {
var results = response["results"]
for(var i in results) {
for(var x in results[i]) {
var the_text = results[i][x]
if(/jpg/.test(the_text)) {
$("#objects").append("<img src='"+ the_text +"'>");
} else {
$("#objects").append("<p>"+ the_text +"</p>");
}
}
$("#objects").append("<br>")
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="objects"></div>

Here is the shortest way to code it.
Since you know the key (imageSource) you want...
I recommand you use the JSON keys to format your page correctly depending on the value...
$.ajax({
url: 'http://apis.is/concerts',
type: 'GET',
dataType: 'json',
success: function(response) {
var results = response["results"]
for(i=0;i<results.length;i++) {
$("#objects").append("<h1>"+ results[i].userGroupName +"</h1>");
$("#objects").append("<img src='"+ results[i].imageSource +"'><br>");
$("#objects").append("<p>Date of show: "+ results[i].dateOfShow +"</p><hr>");
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="objects"></div>

Jquery Mobile - onclick not working

The function occurs before anything is clicked...
such as
When i click the name ^ fdsa, for exampmle, i need the id to pop up, but it automatically happens when the page is loaded for some reason
HTML
<ul data-role="listview" id="ccontent" data-inset="true">
</ul>
JS
function getClubs() {
$.ajax({
url: 'some url',
crossDomain: true,
type: 'post',
data: '',
success: function (data) {
$('#ccontent').empty();
var json = jQuery.parseJSON(data);
for (var i = 0; i < json.length; i++)
$('#ccontent').append('<li>' + json[i].name + '</li>');
$('#ccontent').listview('refresh');
},
});
}
function getData(id) {
$('#clubcontent').append ('<li>'+id+'</li>');
$('#clubcontent').listview('refresh');
};

I think this is what you're looking for:
$(document).on('click', '#ccontent li a', function () {
getData($(this).data('club-id'));
});
function getClubs() {
$.ajax({
url: 'some url',
crossDomain: true,
type: 'post',
data: '',
success: function (data) {
$('#ccontent').empty();
var json = jQuery.parseJSON(data);
for (var i = 0; i < json.length; i++)
$('#ccontent').append('<li>' + json[i].name + '</li>');
$('#ccontent').listview('refresh');
}
});
}
.on() is used instead of an inline onclick event. club-id is used to store the id which is used in the getData() function.

Json data from Guardian API

I have a guardian json data feed that I want to pull into my page online.
http://content.guardianapis.com/world/cuba?format=json&show-fields=trail-text%2Cheadline&order-by=newest&api-key=c3rr449rqqebmuxua9k5mdcz
I have used this javascript but nothing seems to be working to grab the right content from the json;
$(document).ready(function() {
$.ajax({
type: "GET",
dataType: "jsonp",
cache: false,
url: "http://content.guardianapis.com/world/cuba?format=json&show-fields=trail-text%2Cheadline&order-by=newest&api-key=c3rr449rqqebmuxua9k5mdcz",
success: function(data) {
for (var i = 0; i < 12; i++) {
$("#cuban-news").append("<div class='guardian'><a target='_blank' href='" + webTitle + "'>Link</a></div>");
}
console.log(data);
}
});
});
This is not throwing anything in terms of errors.
Am I better using a js service like backbone or underscore?
Any help would be amazing on this.

Use
data.response.results[i].webTitle
instead of
webTitle
error was
Uncaught ReferenceError: webTitle is not defined
$(document).ready(function() {
$.ajax({
type: "GET",
dataType: "jsonp",
cache: false,
url: "http://content.guardianapis.com/world/cuba?format=json&show-fields=trail-text%2Cheadline&order-by=newest&api-key=c3rr449rqqebmuxua9k5mdcz",
success: function(data) {
for (var i = 0; i < data.response.results.length; i++) {
$("#cuban-news").append("<div class='guardian'><a target='_blank' href='"
+ data.response.results[i].webTitle + "'>Link</a></div>");
}
console.log(data);
}
});
});​
JSFiddle

How Can I Do to my textbox autocomplete, works

I'm trying to do an autocomplete to my textbox, but it doesn't work. Follow my code.
$(function () {
var credenciada = '<%= credenciadaId %>';
xml_NomeCompleto = "";
var Nomes = "";
var retorno = '';
var count = 0;
var t = '';
$.ajax({
url: "../Xml/AcessoExterno.aspx?Credenciada=" + credenciada,
type: "get",
dataType: 'xml',
async: false,
success: function (data) {
$(data).find("REGISTRO").each(function () {
t = $(this).find("NOMECOMPLETOUSUARIO").text();
Nomes += ["\"" + t + "\","];
});
}
});
$("#ctl00_contentConteudo_txtNome").autocomplete({ source: Nomes });
});
The variable 't' receives all the names of my users, normally, but the autocomplete don't work.

Wait for ajax response to complete and then initialize the autocomplete because before you initialize the plugin data is not available. Also the way you are creating Nomes(source) is wrong. Declare it as an array and use push method to populate it.
Try this
var Nomes = [];
$.ajax({
url: "../Xml/AcessoExterno.aspx?Credenciada=" + credenciada,
type: "get",
dataType: 'xml',
async: false,
success: function (data) {
$(data).find("REGISTRO").each(function () {
Nomes.push($(this).find("NOMECOMPLETOUSUARIO").text());
});
$("#ctl00_contentConteudo_txtNome").autocomplete({ source: Nomes });
}
});