I have created a to-do list, but after shifting a list item from ongoing to completed tab, the tick-mark button created using js is also shifted to completed tab.
I have coded in such a way that every list item created in ongoing tab is binded to tick-mark(class).To remove that button, we need to remove the class i.e. binded to list item.
I have tried:
var nextlist = document.getElementById("completed").getElementsByTagName("li");
var j;
for(j = 0; j < nextlist.length; j++){
nextlist[0].classList.remove("complete");
}
but it does not work.
And because this is in HTMLCollection, we cannot use querySelectorAll()
You should replace nextlist[0] to nextlist[j]
var nextlist = document.getElementById("completed").getElementsByTagName("li");
var j;
for(j = 0; j < nextlist.length; j++){
nextlist[j].classList.remove("complete");
}
Related
I'm trying to reset the values of all the selectBoxes on my page. The event in question is happening in an onClick so everything is loaded in the DOM.
I have obtained an HTMLCollection of selectBoxes via var selectBoxes = document.getElementsByClassName("selectBox"); I would like to now change the selectIndex of each of those selectBoxes to 0.
However, every time I try to access a property of a specific object from the HTMLCollection, I end up with an undefined value.
selectBoxes.item(0).selectedIndex = undefined
selectBoxes[0].selectedIndex = undefined
var selectBoxes = document.getElementsByClassName("filterBox");
console.log(selectBoxes); //a nice JavaScriptObject
for(i = 0; i < selectBoxes.length; i++){
selectBoxes.item(i).selectedIndex = 0;
}
This is a very interesting article on HTMLCollections: https://hackernoon.com/htmlcollection-nodelist-and-array-of-objects-da42737181f9 which seems to be explaining part of my problem.
I was accessing the selectedIndex property incorrectly. It's not a direct property of the selectBox itself but rather it seems to be inside the children of the selectBox.
var selectBoxes = document.getElementsByClassName("filterBox");
for(i = 0; i < selectBoxes.length; i++){
selectBoxes.item(i).children[0].selectedIndex = 0;
}
Essentially what I'm trying to do right now is, given some input text, I split it up by white space and display on a
div id= "animation"
Every time a button is clicked, the array should go forward one word.
This is my current attempt.
function displayText() {
var displayText = document.getElementbyID("animation");
var list = (document.getElementbyID("input").split(/[ \tn]+/);
for (var i = 0; i < list.length; i++) {
displayText.innerHTML = list.get[i];
}
}
Is my thought process somewhat correct? For whatever reason, it doesn't seem to be working.
there are multiple issues in your method
function displayText() {
var displayTextAnimation = document.getElementbyID("animation"); //keep variable name and method name different
var list = (document.getElementbyID("input").value).split(/[ \tn]+/); //use value property and observe extra bracket
for (var i = 0; i < list.length; i++) {
displayTextAnimation.innerHTML = list.charAt(i); //observe replacing get by charAt
}
}
state.on('change', function(){
city.empty();
$.getJSON("pincodes.JSON", function(pincodes){
var key = state.val();
for (var j= 0; j < pincodes['address'].length; j++) {
if (pincodes['address'][j]['circlename'] == key) {
temp.push(pincodes['address'][j]['regionname']);
}
}
cities = $.unique(temp);
for (var k = 0; k < cities.length; k++) {
city.append('<option>' + cities[k] + '</option>');
}
});
});
In the above state = $('#state') , the above works fine fills the cities on select "state" . But the issue is when a new state is selected the previously filled cities are also there . Even though I tried .empty on every change() .
You don't empty your temp array. So, every time this function is called, you keep appending items to your temp array.
You simply need to add the following line in your code:
state.on('change', function() {
city.empty();
temp = []; // <---
$.getJSON("pincodes.JSON", function(pincodes) {
What about cities = $.unique(temp);, it won't work.
According to jQuery.unique() documentation, this function
Sorts an array of DOM elements, in place, with the duplicates removed. Note that this only works on arrays of DOM elements, not strings or numbers.
So, it is not a correct usage. If you get non-unique values from your JSON, you will need to use another way to get distinct values. There is a good SO article on this topic.
I have an multi-dimension array that i'm iterating through. Is there a way to put the contents of the array into a new multi-dimension array creating a new MDA? For example, the following code puts all indices of the original array into the new candies array if there's a match. Currently i'm doing
candies.push([product[0],product[1], etc...]);
I'm just trying to see if there's a faster/cleaner way to get that in there.
I tried:
candies.push(product);
but that didn't work. Here's the code i'm currently using
var sel = 'candy';
var candies = [];
for(var i = 1; i < products.length; i++) {
var product = products[i];
for(var j = 0; j < product.length; j++) {
if(sel==product[11]){
candies.push([product[0],product[1],product[2],product[3],product[4],product[5],product[6],product[7],product[8],product[9],product[10],product[11],product[12]]);
}
break;
}
}
A cleaner way of writing below line:
candies.push([product[0],product[1],product[2],product[3],product[4],product[5],product[6],product[7],product[8],product[9],product[10],product[11],product[12]]);
is:
candies.push(product.slice(0,13)]);
Sample example JSFiddle is here.
Best of luck.
(Mark this as answer if it serves your need.)
I have a list that is dynamically populated, I want to get the indices of children of that list.
The list is an unordered sortable list, created using jQuery.
Here is the code:
$(function getIndex(){
var i=0;
for (i = 0; i < $("#questionList").length; i++)
questionOrder[i] = $("#questionList").children().index(); //not working
});
try this:
$(function getIndex(){
var i=0;
for (i = 0; i < $("#questionList").length; i++)
questionOrder[i] = $("#questionList").children().get(i).index();
});
You have to get the specific child in that children array and then get the index