You need to use both of those depending on the streamer's online status, that's one of the challenges for this project
that is inexact :3 you can go with a single one depending on your needs (and still meet the user stories of course)
yeah i just got really confused there so i dont think i want to use it
well anyway, once you've made you choice, you can access everything with object notation
i'm back, more confused than before on what i was doing meanwhile was switching from the stream to the channel but that did not work either and then just made it a normal function outside of the calls but that did not work either-so my question is how do i retrieve information from both the stream and channel calls and from there use that info to output my results.
@ismailhozain hmm..... information gained from ajax calls can only be accessed within the function
within the call
yeah but i need the information from two different calls
$.getJSON('', function(data1){
$.getJSON('', function(data2){
//do stuff with data1 and data2
})
})
ismailhozain sends brownie points to @moigithub :sparkles: :thumbsup: :sparkles:
:star2: 3657 | @moigithub |http://www.freecodecamp.com/moigithub
or use promises https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/all
p1= $.getJSON('') //<< jquery getJSON return a promise
p2= $.getJSON('')
Promise.all( [ p1,p2 ] ).then( function( allValues ){
//allvalues is an array with [data1, data2]
})using jquery $.when
$.when( p1, p2 ).done(function ( data1, data2 ) {
console.log( data1 );
console.log( data2 );
});
question, I have an image grid:
<div class="col-md-4">
<img src="ex/src/path.png" />
</div>im sorry let me correct that -
<div class="col-md-4">
<img class="img-responsive" src="ex/src/path.png" />
</div>thats what my image grid looks like. a few of the images are slightly larger in size (height-wise) and its throwing off my grid, is there a css trick I can use to make the div's/img's uniform in size? I've tried setting height of these certain images to a % lower than 100 but it doesn't affect the image size at all.
just post it, will be easier
Hi, any recommendation for a good Javascript tutorial? I am working on my weather app already, implemented the API etc. but i think i need some deeper knowledge than just googling parts of code etc. MDN? Eloquent JS? etc. Any recommendation?
the ajax chapter
or you could try the site of a big api (like google, twitch, etc...) they'll walk you through using their API
@Gersho thanks. Sorry for the confusion, I meant JS overall. I have some knowledge about ajax, api etc. and how ho to implement it, but still i feel not very good with JS overall. I would like some deeper overall knowledge
adnosk sends brownie points to @gersho :sparkles: :thumbsup: :sparkles:
:cookie: 529 | @gersho |http://www.freecodecamp.com/gersho
hey guys, I feel dumb for this, but I need some help getting my match 3 game to render onscreen. There's no errors in console and I can't figure out what i'm missing/doing wrong. :worried:
https://codepen.io/AmitP88/pen/pWyaNY?editors=1010
https://codepen.io/AmitP88/pen/pWyaNY?editors=1010
in that case start by installing https://zealdocs.org and load the JS doc, then you keep coding more and more ambitious stuff
you learn to forge by forging or whatever the idiom is in your country
adnosk sends brownie points to @gersho :sparkles: :thumbsup: :sparkles:
api offline
you can try the advanced algo challenges or try a site like codewars too
@AmitP88 try moving the onload to the body, also onload function should be called with ()
<body onload="foo()">
Codewars - already there :-). But I am not sure... is this the right way to learn JS? I mean - mostly I encounter some challenge (FCC or Codewars etc. doesnt matter) where I dont have a clue what to do, then I google everything for the task and then I am mostly able to complete the task. But somehow I have the feeling its very chaotic to learn like this?
i see what you mean, i think that's how it is unless you have an actual teacher ? every guide online has it's own way of doing things so it's hard to say what to learn first (exept fundamontals)
also depends what you aim for (mostly frontend JS, a bit of everything, specific uses, etc...)
Currently doing just front-end stuff, but yeah, I would like to learn the whole deal and be a full-stack developer.
btw. i just downloaded Zeal and the JS docset for it. Its from the MDN website, which i am currently looking into as a possible source of info/tutorial :)
btw. i just downloaded Zeal and the JS docset for it. Its from the MDN website, which i am currently looking into as a possible source of info/tutorial :)
yes but the advantage of zeal is that for exemple you search for javascript:array. (with the dot at the end) and you'll see a list of all the Array. and Array.prototype. methods
hi i only know vanilla js and doesnt understand jquery well. can someone convert this to vanilla js so i can understand this
$.each($('.card-title'), function(i, el) {
var card = $(el).closest('.car-card-grid-item');
$(el).text() == filter ? card.show() : card.hide();
});
}
@alteducation - I don't know if I can fully convert to vanilla JS - if you need that you'll have to get it from someone else. A verbal description of this, from what I can understand without seeing the HTML code, is this:
$.eachis essentially going to be like.forEachin processing a list of elements- The list of elements to be processed is going to be the list found by the selector
.card-title, which is a class, so jQuery would use theDocument.getElementsByClassName()method to get the list of elements with that class. - the
function(i, el)is the function that will be executed for each of those elements. It first is going to take the reference to the elementseland find the.closestelement - traversing the parents of the element in the DOM tree to find one with the class.car-card-grid-item. That element will be set in the variablecard. - (This one's a little fuzzy) - the element
elhas text contents that are compared tofilter(that's what I don't know - whatfilteractually is - perhaps a variable that is set prior to this code block?) and a ternary operator selects that the card will with be displayed with.show()which the documentation states is roughly equivalent to settingdisplay: blockin CSS. Or it will be hidden with.hide(), essentiallydisplay:none(using the appropriate javascript methods to set the CSS values)
It is probably a little more involved to explain it thoroughly as far as complete vanilla JS, but you might be able to understand it from there? You can visit the documentation for jquery and read the details - for example, the .show() documentation gives the gory details and examples for that method. There is a search box at the top of the documentation page where you can look at all of the other methods that are used.
alteducation sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3349 | @khaduch |http://www.freecodecamp.com/khaduch
@khaduch i have inserted that code to this page https://www.alternativeeducation.in/alternative-learning-spaces
@ but i have a problem when i click in a dropdown filter the cards dont rearrange the cards that dont match the filter just disappers leaving a blank in bw how to fix that
@alteducation - ah, so taking a quick look there, you probably get a value into
filter that represents something like for example "Delhi" ends up showing three boxes -
@alteducation - can you give an example of a filter selection that doesn't work - if it's multiple steps, what to do first and then second as far as selection?
@khaduch does $('.card') is this similar to querySelectorAll('.card')
@khaduch only the code for the first filter is written the second filter doesnt work now. dont know how to pass both values to the function
@khaduch this is the code https://github.com/alteducation/web/blob/gh-pages/alternative-learning-spaces.html
@alteducation - I'm just trying to understand how the HTML is structured... - that link might help!
@alteducation Here's that pen I gave you earlier with the vanilla JS equivalent instead: https://s.codepen.io/anon/pen/PJQLKR?editors=0011
@alteducation - your question
does $('.card') is this similar to querySelectorAll('.card')
I think that the answer is yes - although I'm not sure if jQuery is sophisticated in the way it forms the selection code - recognizing that it is a class it might use a getElementsByClassName, for example, if that was more efficient?
.closest() is a real convenient jQuery method, though maybe you could use .find() in vanilla JS to avoid the use of .parentNode.parentNode.parentNode
@piteto could you tell me how i can use the code on two dropdowns like in this page https://www.alternativeeducation.in/alternative-learning-spaces by passing both select menus into the function
@alteducation The second select menu is another value you can query - the code would be nearly the same, just more if/else statements
@could you please explain. Do i need to write another function for it or can i use the same function
@piteto also when the filter is applied the cards leave a blank space in between them and doesnt rearrange. what could be a possible solution for this
@piteto you please explain. Do i need to write another function for it or can i use the same function
@alteducation You can use the same function - I'm guessing you get a blank space because you may need to target one more parent level up
console.log your target to make sure you're hiding the full column/grid item
the .card class is inside a <li> element i tired refering the li elements directly but it doesnt solve the issue
@alteducation You should be using the material grid for that layout - not <li> elements
Either way, I'm not sure...hiding the <li> should work too
@piteto hiding the li works!! sorry the code i wrote was incorrect
@piteto could you explain how to do two select filters?
@alteducation It's going to get more complicated with another filter - can they select them in any order?
@piteto yeah in any order. they just need to be mutually exclusive as in if select delhi and montessori it should elements of both delhi and montessori
Either way - it's going to be very similar logic to the code I showed you for filtering. You'll just be looking at a different dropdown menu and filtering based on different values and class names
@piteto in this code
var states = document.querySelector('#state');
states.addEventListener('change', filterCards);
function filterCards() {
var filter = states.value;}
how does js know which value to select
shouldn't we mention like states[index].value
??
@alteducation if that's an id (#) like the exemple you provided, there can only be one since ids are unique in an html document
@Gersho states is a node list. its an html element with multiple select options
<select>
<select id="state">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
like this
not really, been unproductive all day and was about to go play some videogames
seems fun and annoying at the same time (hope the doc isn't too long)
change to 55X for speedy speed
yeah but it's just a game don't want to spend too much time getting started
its not just a game , "hey dude ! you need the controls! just use the keypad
W = up , S = down , D=stop"
W = up , S = down , D=stop"
what are you upto @korzo
the thing that bothered me is the error @Gersho
for me it's more like i feel like i'm learning an api when i could be working something else, i'm not really a big fan of gamified stuff like that (it could be of use if i went to the higher challenges, but i probably won't spend that much time so i don't really see the point)
@Gersho hey, sorry for the late reply. I tried your suggestion (moving onload onto body and including () in the onload call), but it still didn't work
@AmitP88, I just scrolled up to your previous post... It looks like you're never actually rendering anything - just populating some stuff and console.logging it. If you want to post something to the screen, you'll need to do something like document.getElementById("root").innerHTML=<stuff here> (if plain JS) or $("#root").html(<stuff here>) if using JQuery.
@AmitP88 It also looks like your grid isn't populating how you expect either, though. It looks like you're mixing class syntax (new Tile) with syntax for calling a function (just saying 'Tile()' ). In this case, Tile is a function, not an object, so you're not making a "new Tile", you're invoking Tile again.
@CXmanager there is an extra . before your flex container class
@CXmanager also your margins are messing up the layout
@CXmanager what is the layout you are trying to achieve
@CXmanager
.flex-container {
display: -webkit-flex;
display: flex;
width: 800px;
height: 250px;
background-color: lightgrey;
}
.flex-item {
width: 250px;
height: 250px;
margin:0 7px;
}
if you were aiming for this
@CXmanager please use this instead of the previous code. this one is better
.flex-container {
display: -webkit-flex;
display: flex;
justify-content:space-around;
width: 800px;
height: 250px;
background-color: lightgrey;
}
.flex-item {
width: 250px;
height: 250px;
}
It's blurring my text
@SL0TR i think that's just kinda what happens when you want to transition text like that
anyone can give me pointers for this https://www.freecodecamp.org/challenges/build-a-wikipedia-viewer
Im essentially lost and don't know where to start :(
i would probly start by getting some data from the wikipedia api to log to the console
use .getJSON() http://api.jquery.com/jquery.getjson/
Hi! I need help to get the true browser innerWidth without counting with zoom. The size of the inner browser relative to the screen pixels i guess? Please help! :/
put in a url that's giving you some data, and make sure it comes through
Has anyone done the nodeschool React tutorial lately?
I am stuck on Isomorphic and cant make it pass
was wondering maybe something was changed that broke the tutorial
that is with zoom. I wan't it to stay the exact pixels it was att 100% zoom. window.innerWidth changes as you zoom
wheelhot sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 872 | @mot01 |http://www.freecodecamp.com/mot01
with the browsers zoom option?
or is it built in to the page
or part of a library you're using or something
eg. if my window size is 1050 x 974 and then I zoom the value changes relative to the zoom. I need it to stay the same
you can soom in a browser. ctrl+scrl?
yes
t
and I wan't the true value of the window size on the screen. not the width of what it is showing itself
you need to be more clear if you want me to try and help, im not sure what the problem is - do you have an example of what you are working on, how are you zooming
I want the absolute zoom value => var zoomVal = number I want / window.innerWidth;
when I have a window it takes a dimenion on the screen eg. 1920 x 1080 but when you zoom window.innerWidth scales with the zoom and becomes bigger or smaller
I wan't my number to always be the width and height relative to the pixels on the screen
window.innerWidth but without the zoom scaling
so you need to get the zoom level of the browser itself somehow
if you are in chrom console and rezise how much place the console takes you can see a window deminsion eg. 800px x 900px thats the number I want
but the zoom level is what i want
No I am trying to get the zoom by counting my number / window.innerWidth
i dunno, im reading this https://stackoverflow.com/questions/1713771/how-to-detect-page-zoom-level-in-all-modern-browsers
I want the relation between the browser width and the window.innerWIdth
There must be a variable somewhere since the browser itself dispalys the value when you resize the window with console open
far*
so when you zoom, the header goes off screen. is that what you're trying to fix
?
ohh since I changed around a bit it isnät like this now but I wan't the header content to only be 70% of the page width in the begiining
well. I wan't to be able to refresh the page and not have the page change. for that I need to know the zoomLevel for that I need the number
I wanna be able to zoom refresh rezise without it bugging out and getting out of vision
well, i dont want to read it, but i think there might be an answer in that first link i sent
now it crashes
i just can't finish creating this
the minimax algorithm... i understand it and I understand how it works, but for some reason it doesn't work. I'm so sick of this project...
Right now I'm thinking of deleting the whole code and just start from scratch...
@palingheorghe I think you have infinite loop there as my tab with your codepen crashed
I just discovered they crash because od the "console.log"s
When i removed those lines the algorithm didn't crash
But now for some reason everytime i click a square the whole layout is changing
Thid is by far the worst challenge because I have no idea what is going on. -.-
@palingheorghe You have infinite loop at line 91
You recursively call minmax
You recursively call minmax
Yeah but it ends when the number of cases to check ends
And yes immediately after clickin on one button its getting destroyed
But that doesn't happen it has something to do sith the js file
@palingheorghe Also codepen whined about Infinite loop
There is second and third table shown before I had to kill tab manually, but those tables are deformed.
also some gibberish is at the bottom, but I was unable to scroll
There is second and third table shown before I had to kill tab manually, but those tables are deformed.
also some gibberish is at the bottom, but I was unable to scroll
@palingheorghe I would suggest separate UI from logic. It will make code more testable.
then you can setup some test cases manually or using Mocha
then you can setup some test cases manually or using Mocha
I guess I'll be coding this locally with Sublime and try to learn Mocha as well
I feel stuck because of this "minimax" algorithm thing.
@palingheorghe You will learn mocha in 10 minutes. Its literally 2 functions(+ 4 more function for setup/terdown if needed) and it has good documentation.
You can run it also in browser.
You can run it also in browser.
@palingheorghe You can also debug it on codepen using breakpoints.
Add
Add
debugger; at the first line of minmax and open devtools before clicking field.
Then you can check current state and step line by line
@korzo I'll do it locally with Mocha. At least I'll feel like I'm progressing somehow instead of being at the same level all the time. This project is very frustrating and it makes me question my ability to write code.
@palingheorghe try to read something about TDD. It will help you progress in smaller steps and better understand the code.
Also your code will be better structured.
Also your code will be better structured.
It's good specially in complicated code as minmax
palingheorghe sends brownie points to @korzo :sparkles: :thumbsup: :sparkles:
:cookie: 602 | @korzo |http://www.freecodecamp.com/korzo
@alteducation Sorry, logged off before your question. With this code:
var states = document.querySelector('#state');
states.addEventListener('change', filterCards);
function filterCards() {
var filter = states.value;
}when the #state element changes, the value of that element changes. There can only be one value for that element at a time, so no need to loop through it.
ideally, though, replace
states.value with this.value so you aren't relying on a variable outside of the function
and,
document.getElementById is a better choice for selecting elements by ID
@alteducation The <option> elements are just values for the #state element
when you manually click on that drop down and select one of the values, the change event fires and you get the new value
@piteto I tried to incorporate the other select option by repeating the code but it has become a mess. I tried looking online for tutorials but cannot find anything similar.
var states = document.querySelector('#state');
states.addEventListener('change', filterCards);
var approach = document.querySelector('#approach');
approach.addEventListener('change', filterCards);
function filterCards() {
var filterstate = states.value;
var filterapproach = approach.value;
// show all the cards if "Show All" is selected
if(filterstate == "All States" && filterapproach == "All Learning Methods") {
$('.card-parent').show();
return;
}
// use $.each to look at the title/h4 element in each card
// if it matches the filter value selected show it else hide it
$.each($('.space-state'), function(i, el) {
var card = $(el).closest('.card-parent');
$(el).text().includes(filterstate) ? card.show() : card.hide();
});
$.each($('.space-approach'), function(i, el) {
var card = $(el).closest('.card-parent');
$(el).text().includes(filterapproach) ? card.show() : card.hide();
});
}could please take a look
@piteto no. i was asking about why getElementsbyID is better than querySelector]
@alteducation getElementById doesn't need to rely on css selector functionality to target the element - it's specifically looking for an ID. The querySelector methods will have slightly worse performance
@alteducation Another answer to that question with some jsperf results to show the difference in performance: https://stackoverflow.com/a/26848416
@piteto Thanks for mentioning that. Now I can write faster Code :fire:
alteducation sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 221 | @piteto |http://www.freecodecamp.com/piteto
From looking at your JS, it seems the only issue would be here:
if(filterstate == "All States" && filterapproach == "All Learning Methods") {
$('.card-parent').show();
return;
}
just as a guess without having live code to debug, you might want to try something more like this:
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states, approach].forEach(el => el.addEventListener('change', filterCards));
function filterCards() {
var filter = this.value;
var selector = this.id == "approach" ? '.space-approach' : '.space-state';
$.each($(selector), function(i, el) {
var card = $(el).closest('.card-parent');
$(el).text().includes(filter) ? card.show() : card.hide();
if (filter == "All Learning Methods") card.show();
if (filter == "All States") card.show();
});
}
hey guys on my calculator challenge when i click the button and push the value itll just replace the not add in my array.
heres the pen.https://codepen.io/artoo/pen/gGvvER thanks in advanced
heres the pen.https://codepen.io/artoo/pen/gGvvER thanks in advanced
@piteto only one filter works they dont work in a combined way. Please hep
@alteducation Put your code in a codepen so I can debug it live. I will try to help
@alteducation Your code is getting close - but I'm finding myself writing it all for you, which is kind of against the philosophy of this coding school.
At this point, you need to determine what the values are for each select menu and then determine what cards to show based on that
you have the correct code for determining the values and the correct code for filtering them - the part to figure out now is how to combine both filters so they work together
I'm happy to help you figure this out if you want to try writing some of your own code - I'm just not sure how to provide more help at this point without writing more code for you
@piteto I know i too feel the same but i dont know how to combine them. i have searched a lot online on how to do this. Could you guide me where to look and what to learn to do this
@piteto I agree with you the modal in this page i was able to write by my own after a lot of trying over and i really felt like i learned something
@alteducation I don't think you'll find a tutorial for this that will help you modify your code any better than you have. There are no additional methods in jQuery or javascript that will help out beyond what you have already
Sometimes the algorithm part is just a matter of walking through the steps / logic
Your function needs to look at both select values - hide cards that don't have those values and show the ones that do
@piteto woudnt i need to remember the state of the other to do this?
var stateFilter = document.getElementById("state").value;
var learningFilter = document.getElementById("approach").value;
if the text matches stateFilter and the text matches learning filter - show it, else hide it
if the state filter is "All States", only pay attention to the learning filter and vice versa
it's a mini algorithm
Start with what you are comfortable with, then optimize after that
@piteto if the state filter is "All States", only pay attention to the learning filter dont know how to do this. but i agree with your point. I will try really hard to write the code. spend few hours on it and get back to you
maybe practice with some simpler code to get the core algortihm down first
@piteto i had just learned the javascript filter method and that is when i ventured into making this. Could you tell me why the filter method cannot be used here
@piteto I am loading this data from a json file but once the html is rendered i dont know how to run array methods on it
@alteducation .filter() could be used for this as well, but it returns an array that you will then need to process. With .forEach(), you skip returning the array and simply process each item as you loop through it
.map(), .filter(), .reduce(), .forEach() are all loops, you could also use a standard for loop
@piteto can i ask you a different question. I'm just reading more about blockchain technology and the idea of decentralisation and bringing control back to people fascinates me. do you think that web/blockchain hybrid apps are the future or current http web is going to get replaces with blockchain ipfs. Maybe this is a very stupid question. Could you share your views on this.
Progressive web apps seem to be the trend - at least as far as Google is concerned
@piteto Blockchain books predict the death of Centralised Services like Google and People getting to own their own identity and data with them and as for search well i dont know. I hope more decentralisation will kick in and people to get to have power over their data and how the services they use are designed
@piteto why do google push progressive webapps over native android apps. Isnt that where they get to make money?
@alteducation I don't know, but I'm guessing they want to make money on chromebooks too
Progressive web apps will run on any OS and then they can start charging for their apps that will run on any device
@piteto woudln't services like google assistant replace a lot of apps and become a behemoth of an app that can do pretty much anything that you want. but that will give google all the power in the world
@alteducation Probably, yes, the definition of "app" and "service" is likely going to change a lot in the next decade or two
@piteto decade :sparkles: is a long time in today's standard. do you think things will stay similar that long?
@alteducation I wish it would move faster to be honest - we haven't really progressed all that much since 2007 :)
@piteto I am fascinated af with blockchain, i think its going to bring a paradigm shift in how our society works
@piteto progress is exponential and we always underestimate the curve. If we take 30 steps forward in a linear fashion we will reach maybe the next block and this is how we often predict the future but if we take 30 steps exponentially we reach beyond the moon.
@piteto it may take a long time to reach 4% but then it goes 16% and then 256% that is nuts
lol, yes @alteducation just a matter of making the right technology accessible to everyone!
I have to head out....but hopefully you get your filtering fixed! Have a good rest of your day/evening
@piteto yeah going to work hard on it and focus my brain power :fire: . Wish me luck brother :+1:
@piteto Thanks for all the awesome help
alteducation sends brownie points to @piteto :sparkles: :thumbsup: :sparkles:
:cookie: 222 | @piteto |http://www.freecodecamp.com/piteto
i feel framework are suicidal
want to have anti-framework channel
@linkin-park dont know anything about javascript frameworks but my advice is take a cold shower bro. everything will get chilled out :sparkles:
@linkin-park what's your issue with frameworks? Which ones have you tried?
Hey whats up room, I'm having an issue. I have an image grid as part of a bigger application, and some of the images are creating issues (due to being different in size) so i deleted them from my content folder, forced a non-cache refresh of the browser (ctrl + refresh), but my images are still showing up
$(document).ready(function() {
$('#exampleModal').on('show.bs.modal', function (e) {
var selectedStudentId = e.relatedTarget.getAttribute("data-id");
$('#delete-btn').on('click', function() {
//The code below keeps giving error
//studentsresource.js:7 Uncaught TypeError: $.ajax is not a function
// at HTMLButtonElement.<anonymous> (studentsresource.js:7)
// at HTMLButtonElement.dispatch (jquery-3.2.1.slim.min.js:3)
// at HTMLButtonElement.q.handle (jquery-3.2.1.slim.min.js:3)
$.ajax({
type: 'DELETE',
url: '/studentview/' + selectedStudentId,
success: function(data){
//do something with the data via front-end framework
location.reload();
}
});
//The code above
selectedStudentId = -1; //To make sure selected students doesn't hold that index deleted
});
});
});
});
@Mughees605
but i can put it on my git so you can take a look @Mughees605
@cypher12 url must be in string
url: "/api/rooms",
url: "/api/rooms",
@cypher12 use this
/studentview/${selectedStuentId},
@Mughees605 i'd try that
(
Your code)
@Mughees605 thanks
cypher12 sends brownie points to @mughees605 :sparkles: :thumbsup: :sparkles:
:cookie: 287 | @mughees605 |http://www.freecodecamp.com/mughees605
arrudamt sends brownie points to @cypher12 :sparkles: :thumbsup: :sparkles:
:cookie: 266 | @cypher12 |http://www.freecodecamp.com/cypher12
$('#exampleModal').on('show.bs.modal', function (e) {
var selectedStudentId = e.relatedTarget.getAttribute("data-id");
$('#delete-btn').on('click', function() {
console.log(selectedStudentId);
$.ajax({
type: 'DELETE',
url: `/studentview/${selectedStudentId}`,
success: function(data){
//do something with the data via front-end framework
location.reload();
}
});
selectedStudentId = -1; //To make sure selected students doesn't hold that index deleted
});
});@piteto
var states = document.getElementById('state');
var approach = document.getElementById('approach');
[states, approach].forEach(el => el.addEventListener('change', filterCards));
function filterCards() {
var filterState = states.value;
var filterApproach = approach.value;
/*var selector = this.id == "approach" ? '.space-approach' : '.space-state'; */
var card = $(el).closest('.card-parent');
var titleState = document.getElementsByClassName('space-state');
var titleApproach = document.getElementsByClassName('space-approach');
for (i = 0; i < card.length; i += 1) {
if(titleState[i].includes(filterState) && titleApproach[i].includes(titleApproach)){
card.show();
} else{
card.hide();
}
}am i getting any close. or do i need to change the logic?
@Mughees605
Okay i got it to work.....i used
Okay i got it to work.....i used
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
@alteducation Looks right, now you'll just need to account for the "All" functionality in those two menus
hey guys, I'm trying to create an 8 x 8 grid for a match 3 game and I think I almost have it rendered, except that my grid won't populate with the images. I've console.logged my variables and functions to check the outputs along the way. What am I missing?
anyone here know what the form attribute "form-control" does? Thanks?
thanks*
@AmitP88 what exactly are you trying to do? On lines 55-56 you should be accessing innter properties of the Tile otherwise you are trying to jam entire objects into the HTML
like
will display image sources
var img_src = new Tile();
row[x] = img_src["tile"];will display image sources
@Radascript ah I see. I just did that and the image urls rendered on the grid. Now I just gotta get the urls to show the actual images
(ish) haha
@Radascript lol thanks. I guess this will work for now. I'm actually trying to make a match 3 game on an 8 x 8 grid. I was using Canvas + JS before, but I had to scrap my code because I was having a hard time trying to create a function that could swap two adjacent tiles and Canvas was making it tricky, so I decided to scrap my code and try a new approach using only JS
amitp88 sends brownie points to @radascript :sparkles: :thumbsup: :sparkles:
Machine having problem initiating the click function
@blackcytographer do you have a pen of it?
@Radascript this is my old code if you're curious: https://github.com/AmitP88/Knights-of-the-Round/tree/gh-pages