Get Item Count for a Specific View - javascript

Is there a piece of jQuery or JavaScript that I can run that will allow me to create a Content Editor Web Part that has "This is the number of list items: XYZed."
I've tried this but it is not working:
http://www.martinhatch.com/2010/09/how-to-achieve-count-on-large.html
The one I tried was the 4'th attempt. If someone could help me that would be fantastic.

try these solutions/posts in the given order.
https://sharepoint.stackexchange.com/questions/5477/getting-a-count-of-list-items-in-a-list-via-ecmascript
https://sharepoint.stackexchange.com/questions/18050/how-do-i-get-the-number-of-items-in-a-list
http://www.codeproject.com/Questions/266281/jQUERY-TO-GET-COUNT-OF-TOTAL-ITEMS-EXISTED-IN-SP-L

It worked for me. All I had to do was create the grouped view and put the url into the code. Tho I used quotes
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//////////
// you will need to change this URL
var url = "http://sppos/Lists/Statistics/Grouped.aspx";
//////////
var groupings = [];
$.get(url, function(data) {
$(data).find("tbody[id^=titl][groupString] > tr > td").each(
function(index, value){
groupings.push($(this).text());
}
);
$("#placeholder").append("<ul></ul>");
$.each(groupings, function(index, value){
$("#placeholder ul").append("<li>" + value + "</li>")
});
});
});
</script>
<div id="placeholder"></div>
After testing, no quotes doesn't work, which may be the cause of some grief

Related

JSON data key starts with number and cannot be displayed via jquery

I'm missing something here in my small js script for displaying some REST API data via jquery.
Here's what I'm doing (the issue is with the ${data.acf.7yr_full_copy}, the 7 is causing the problem. Do I need to escape it? I've searched all over and can't find an answer.
$.getJSON('https://www.algaecal.com/wp-json/acf/v3/options/options', function (data) {
var fullCopy = `${data.acf.7yr_full_copy}`;
console.log(fullCopy);
$(".seven-year-content").html(fullCopy);
});
var fullCopy = `${data.acf['7yr_full_copy']}`;
The template string is unneeded.
$.getJSON('https://www.algaecal.com/wp-json/acf/v3/options/options', function (data) {
var fullCopy = data.acf['7yr_full_copy'];
$(".seven-year-content").html(fullCopy);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="seven-year-content">

Trying to parse a json with several arrays inside

This is my Index.html
<div id="#here">
</div>
<script type="text/javascript">
$( document ).ready(function() {
$.getJSON("https://poloniex.com/public?command=returnOrderBook&currencyPair=BTC_ETH&depth=30", function(data){
var x = data.asks
$.each(x, function(index, item) {
//console.log(item);
$('#here').append("<p>"+ item +"</p>");
});
});
});
</script>
i'm just trying to parse a json an put inside a p.
in the console the script runs ok
help guys, pleas
item is an array so you need to access the array element using brackets notation like so:
item[0]
You also want to remove the # symbol from the id attribute of your div element.
The id attribute value must begin with a letter.
So this should work.
--HTML--
<div id="here"></div>
--JS--
$( document ).ready(function() {
$.getJSON("https://poloniex.com/public?command=returnOrderBook&currencyPair=BTC_ETH&depth=30", function(data) {
var x = data.asks;
$.each(x, function(index, item) {
var $paragraph = $('<p>');
$paragraph.text(item[0])
$('#here').append($paragraph);
});
});
});

Count html elements in ajax returned data

I've got a jquery $.ajax call that returns a set of html from data.html which is like;
<div class="blah"><li>test</li></div>
<div class="blah"><li>test</li></div>
<div class="blah"><li>test</li></div>
<div class="blah"><li>test</li></div>
I'd like to count the amount of elements that have a class of .blah and i'm not sure how to do this.
I've tried:
data.html.getElementsByClassName('blah').length
but that obviously doesn't work!
Any suggestions gratefully received!!
Try utilizing .hasClass()
var data = {};
data.html = '<div class="blah item item-wrapper print"></div>'
+ '<div class="blah item item-wrapper digital"></div>';
var len = $.grep($.parseHTML(data.html), function(el, i) {
return $(el).hasClass("blah")
}).length;
$("body").html(len);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
You should be able to do this using either .filter() or .find(), depending on the exact format of your returned HTML. If the format is is exactly as you have stated, then the following should work:
$.get("data.html", function(data) {
var length = $(data).filter(".blah").length;
});
If there is some sort of wrapper element around your items with class blah, then you would use .find():
$.get("data.html", function(data) {
var length = $(data).find(".blah").length;
});
$('.blah','context').length
Replace context by object in which you want to search

jQuery .html only get last value of JSON

I have a problem with jQuery("#someID").html. It only prints the last key from the JSON.
Here is the js:
<div class="row" id="fetchmember">
<script type="text/javascript">
jQuery('#group').change(function() {
var id_group = this.value;
var memberjson = "fetchmember.php?group="+id_group;
jQuery.getJSON(memberjson, function(data) {
jQuery.each(data, function(i, items) {
jQuery("#fetchmember").html("<li>"+items.name+"</li>");
});
});
});
</script>
</div>
JSON result from one of the selected option :
[{"id":"1645819602","name":"Michael English","first_name":"Michael","last_name":"English"},
{"id":"100000251643877","name":"Bill Gaither","first_name":"Bill","last_name":"Gaither"}]
I want to print all of name from the json, but it print only last name key of the json. What's wrong with my code?
Any advice and helps would be greatly appreciated. Thank you very much
You're erasing the content on each iteration. Use append instead of html
Instead of
jQuery("#fetchmember").html("<li>"+items.name+"</li>");
Use
jQuery("#fetchmember").append("<li>"+items.name+"</li>");
At iteration, you overwrite the content with last one.
Better to use .append instead of .html, but you have to make the area empty before : jQuery("#fetchmember").empty();

print array with js and add html with jQuery

i want to print an array with js and just add to every element some data with html()
the code i use is :
<script type="text/javascript">
$(document).ready(function() {
var testArray = ["test1","test2","test3","test4"];
for(var i=0;i<testArray.length;i++){
document.write(" " +testArray[i]+"<br />").html("is the best");
}
});
</script>
but it doesnt works.
HTML:
<div id="myDIV"></div>
JS:
$(document).ready(function() {
var testArray = ["test1","test2","test3","test4"];
var vPool="";
jQuery.each(testArray, function(i, val) {
vPool += val + "<br /> is the best <br />";
});
//We add vPool HTML content to #myDIV
$('#myDIV').html(vPool);
});
Update:
Added demo link: http://jsfiddle.net/aGX4r/43/
Syntax problem mate!
Let me get that for you!
// first create your array
var testArray = ["test1", "test2", "test3", "test4"];
// faster ready function
$(function(){
for( var i=0; i<testArray.length; i++ ) {
current = testArray[i] + '<br />' + 'is the best'; // this is a string with html in it.
$(current).appendTo("body"); // add the html string to the body element.
}
});
First. document.write it's not a good practice.
Then, you code have a little error: Function (as in document.write) doesn't have html method. Thats a jQuery method.
So, in order to print the array in the body, you could do:
$('p').html(["test1","test2","test3","test4"].join('<br />')).appendTo(document.body);
It's a little difficult to tell what you want to do, but if you want to append to an element in your DOM, use jQuery.append();
for(var i=0;i<testArray.length;i++) {
jQuery('#mydiv').append(testArray[i]);
}

Categories