We Keep Coding

How to search through Jquery Array

I'm trying to loop through an array using contains, but even if the value isnt it there it still appears true. The array is a list of checkboxes
function CheckBoxLogic(QId, Valuearray, UnCheckedValueArray) {
var CheckedChildArray = Valuearray;
var UnCheckedChildArray = UnCheckedValueArray;
$('.AnswerFunctions').each(function () {
//Get ParentID from child control
var ParentQuestionId = $(this).attr('ParentQuestionId');
//Get ParentValue from child control
var ParentQuestionValue = $(this).attr('ParentQuestionValue');
var QuestionId = $(this).attr('QuestionId');
if (ParentQuestionId === QId) {
if ($(CheckedChildArray + ":contains('" + ParentQuestionValue + "')")) {
$('#' + QuestionId + '-Question').removeClass('d-none');
}
//if ($(UnCheckedChildArray + ":contains('" + ParentQuestionValue + "')")) {
// $('#' + QuestionId + '-Question').addClass('d-none');
// };
}
});
}
}

That's not how you loop through an array. (At its simplest, what exactly do you expect [] + ":contains('" to be? You can't meaningfully concatenate a string and an array like that.)
If you want to check if an array contains a value, you can use the includes method. For example:
if (CheckedChildArray.includes(ParentQuestionValue)) {
$('#' + QuestionId + '-Question').removeClass('d-none');
}

How to get json value from response ajax?

My json response is like this :
http://imgur.com/WRfauG9
http://www.jsoneditoronline.org/?id=c4ded7d2934f62fb68a276cfb118d52e
I want display HotelNo, RmGrade, Meal and TotalRate
I try like this :
...
success: function (response) {
console.log(response);
$.each(response, function() {
$.each(this, function(k, v) {
// console.log(k);
// console.log(v);
setTimeout(function () {
$parent.find('.loading').html(v.HotelNo + '<br>' + v.RmGrade + '<br>' + v.Meal + '<br>' + v.TotalRate);
}, 2000);
});
});
}
...
But it's not working
How to get json value from response ajax correctly?
Any solution to solve my problem
Thank you very much

It would be easy to help you if you give us a sample of your JSON, but in the meantime, I suggest to loop on response.SearchAvailResponse.Hotel instead of response:
success: function (response) {
$.each(response.SearchAvailResponse.Hotel, function() {
setTimeout(function () {
$parent.find('.loading').html(v.HotelNo + '<br>' + v.RmGrade + '<br>' + v.Meal + '<br>' + v.TotalRate);
}, 2000);
});
}
Waiting for your JSON.
As I mentionned before, you will not have access to things like HotelNo by looping only through response. Here is a working solution:
`
for(i=0; i<response.SearchAvailResponse.Hotel.length; i++){
console.log(js.SearchAvailResponse.Hotel[i].HotelNo);
}
response.SearchAvailResponse.Hotel is an array of objects.

Assumption is that you are getting an array.
You dont have to have loop inside loop.
success: function (response) {
console.log(response);
$.each(response, function(index, v) {
setTimeout(function () {
$parent.find('.loading').html(v.HotelNo + '<br>' + v.RmGrade + '<br>' + v.Meal + '<br>' + v.TotalRate);
}, 2000);
});
}

how to Group my list items for more readability

my list result display I need to create spaces or group them between my displayed list result I tried using the break tags but they don't work
function GetProductDetails(barcodeId, coords)
{
$.getJSON("api/products/?barcodeId=" + barcodeId + "&latitude=" + coords.latitude + "&longitude=" + coords.longitude)
.done(function (data)
{
$('#result').append(data.message)
console.log(data)
var list = $("#result").append('<ul></ul>').find('ul');
$.each(data.results, function (i, item)
{
if(data.results == null)
{
$('#result').append(data.message)
}
else
{
list.append('<li>ShopName :' + item.retailerName + '</li>');
list.append('<li>Name : ' + item.productName + '</li>');
list.append('<li>Rand :' + item.price + '</li>');
list.append('<li>Distance in Km :' + item.Distance + '</li>');
}
});
$("#result").append(ul);
});
}

list.append('<li><b>ShopName</b><p>' + item.retailerName + '</p></li>');
list.append('<li><b>Name</b><p>' + item.productName + '</p></li>');
list.append('<li><b>Rand</b><p>' + item.price + '</p></li>');
list.append('<li><b>Distance</b><p>' + item.Distance + '</p></li>');

Pretty sure that list is always going to be the first ul in your results box, no matter how many you actually add. Also, your final $("#result").append(ul) is an error because there is no ul variable.
Try this:
var list = document.getElementById('result').appendChild(document.createElement('ul'));
data.results.forEach(function(item) {
list.appendChild(document.createElement('li'))
.appendChild(document.createTextNode("ShopName : "+item.retailerName));
list.appendChild(document.createElement('li'))
.appendChild(document.createTextNode("Name : "+item.productName));
list.appendChild(document.createElement('li'))
.appendChild(document.createTextNode("Rand : "+item.price));
list.appendChild(document.createElement('li'))
.appendChild(document.createTextNode("Distance in Km : "+item.Distance));
});
Vanilla JS may be more verbose to write, but it is immensely easier to understand and use, once you get past that mental block ;) Of course, there's nothing to stop you creating a helper function:
function addLIwithText(ul,text) {
ul.appendChild(document.createElement('li'))
.appendChild(document.createTextNode(text));
}
Then your loop contents become:
addLIwithText(list,"ShopName : "+item.retailerName);
// and so on

How to name and reuse a javascript function

I have the following bit of jQuery code that i want to reuse by calling it from other parts of my jQuery code. How would i do that?
$(document).ready(function() {
$('#share_mention').charcount({
maxLength: 140,
preventOverage: false
});
$('.countable').bind('update', function(evt, length, remaining) {
var message = 'id=' + $(evt.target).attr('id') + ', length=' + length + ', remaining=' + remaining;
});
});

There are many ways to skin this cat but here is an approach.
var yourNameSpace = {};
yourNameSpace.YourFunction = function(){
$('#share_mention').charcount({
maxLength: 140,
preventOverage: false
});
$('.countable').bind('update', function(evt, length, remaining) {
var message = 'id=' + $(evt.target).attr('id') + ', length=' + length + ', remaining=' + remaining;
});
}
$(document).ready(function() {
yourNameSpace.YourFunction()
});

First things first there is no such thing as a jQuery function. It's a javascript function.
The event is implicitly passed to the callback function.
function countCats (event) {}
$('.cats').on('click', countCats);

Loop through jquery data() object to get keys and values

I have a data() object containing some json.
Is there a way I can loop through the object and grab each parts key and value?
This is what I have so far:
function getFigures() {
var propertyValue = getUrlVars()["propertyValue"];
$.getJSON(serviceURL + 'calculator.php?value=' + propertyValue, function(data) {
figures = data.figures;
$.each(figures, function(index, figure) {
$('#figureList').append('<li> index = ' + data.figures.figure + '</li>');
});
});
$('#figureList').listview('refresh');
}
The json looks like this:
{"figures":{"value":"150000","completion":"10.00","coal":"32.40","local":"144.00","bacs":"35.00","landRegistry":"200.00","solFee":"395.00","vatOnSolFees":79,"stampDuty":1500,"total":2395.4}}
Apologies if its simple, I'm new to jQuery and couldn't find anything on SO that helped.

You can get the key and value like this
$.each(data.figures, function(key, val) {
console.log('Key: ' + key + ' Val: ' + val)
});​
So change your code to
$('#figureList').append('<li>'+ index + ' = ' + figure + '</li>');
Demo: http://jsfiddle.net/joycse06/ERAgu/

The parameters index and figure contains the parameter name and value. I think that you want to concatenate the parameters into the string:
$('#figureList').append('<li>' + index + ' = ' + figure + '</li>');
An alternative is to create the list item element and set the text of it, that would also work if the text contains any characters that need encoding:
$('#figureList').append($('<li/>').text(index + ' = ' + figure));

function getFigures() {
var propertyValue = getUrlVars()["propertyValue"];
$.getJSON(serviceURL + 'calculator.php?value=' + propertyValue, function(data) {
$.each(data['figures'], function(index, val) {
here grab "val" is key
$.each(data['figures'][index], function(col, valc) {
here grab "col" is value
}
}
}
bye