Hello everyone! I’m on the weather project,however,something’s wrong,my “App” should atleast show the temperature in celsius or w/e but ,it doesn’t even asks me if it can use my location. thoughts?https://codepen.io/GummyGod/pen/WdzgzL?editors=1111
@GummyGod Console shows this error
Uncaught Error: Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript. You need to add jquery before bootstrap js
@GummyGod your geolocation code is inside the function
function getLocation() that never get called
so..what should i do?
where should i call it i mean
@GummyGod also you are trying to compose the var api with the lat and lon before you have this values. you must restructure all your js code
gummygod sends brownie points to @sorinr :sparkles: :thumbsup: :sparkles:
:star2: 1386 | @sorinr |http://www.freecodecamp.org/sorinr
@khaduch Thank you so much! :)
The "title" for the inline-style shows up when you keep your cursor over the link, a title "Google's Homepage" would show up. It's just like the "title" attribute of our "anchor" tag.
The "title" for the inline-style shows up when you keep your cursor over the link, a title "Google's Homepage" would show up. It's just like the "title" attribute of our "anchor" tag.
hemakshis sends brownie points to @khaduch :sparkles: :thumbsup: :sparkles:
:star2: 3671 | @khaduch |http://www.freecodecamp.org/khaduch
@hemakshis - oh - I didn't realize that... let me check again, I was thinking that it would be like a regular anchor tag where the anchor text shows up (usually with underline or a different font color)... I see now, I think of that as a "tooltip" when something shows up whe you hover. That's good!
@khaduch No problem. Even I thought so when I first read it :laughing:
primuscovenant sends brownie points to @heroiczero :sparkles: :thumbsup: :sparkles:
:star2: 2133 | @heroiczero |http://www.freecodecamp.org/heroiczero
just wondering
Is that uncorrect?
i think that url must be the path in your pc to the photo
waleed39 sends brownie points to @joetinnyspace :sparkles: :thumbsup: :sparkles:
:cookie: 287 | @joetinnyspace |http://www.freecodecamp.org/joetinnyspace
@waleed39 وليد ضع الكود هكذا
<style>
body {
background: url(https://i.imgur.com/MJAkxbh.png
);
}
</style><style>
body {
background: url('https://i.imgur.com/MJAkxbh.png');
}
</style>
Why the transition property does not work with the display property, what is the reason?
hello people, how to make .html(value).fadeIn('slow') to start working only after fadeOut finishes? Now the content changes, fades out and fades in.
.html(value).fadeIn('slow')
Why when we do float for the items inside the list, then the height of the list becomes zero, why should we add the overflow property with(hidden or auto) of the list?
@sursider
<div id='foo'>
hey
</div>
<script>
$(document).ready(function(){
$('#foo').html('go').fadeOut();
});
</script>
for me this is working
@ahmed-issa-mohd if you want a fade in effect using
transition, you should work with visibility rather than display, the latter being more for element structure rather than direct visual styling
@sursider the text has to be fadeout or (display none) to fade in.
@sursider oh yes, a simple if condition should make it work
if hidden {}
else if visible {}
if hidden {}
else if visible {}
Hello, I can't seem to get passport-twitter to work on my project. Even though I have used it many times before with no problems so I don't no what the problem is.
#include <bits/stdc++.h>
using namespace std;
int simpleArraySum(int n, vector <int> ar) {
// Complete this function
for(int i = 0 ; i < n ; i++)
res += ar[i];
return res;
}
int main() {
int n;
int res = 0;
cin >> n;
vector<int> ar(n);
for(int ar_i = 0; ar_i < n; ar_i++){
cin >> ar[ar_i];
}
int result = simpleArraySum(n, ar);
cout << result << endl;
return 0;
}
in this when i giving the
res=0 globally its not working can u please tell y?
@kbaig s
@1532j0004kg not sure coz i haven't used c++ for too many years but i think declaring your res var as
external int res=0 might help
but i want to know it's not worked when i giving at start of main.
like my code i posted above
@1532j0004kg because your
simpleArraySum function doesn't have access to that var that is limited in scope to the main function
move your
int res = 0; inside simpleArraySum function
but i want to know it's not worked when i giving at start of main.
@SweetCodingInc nope. that will make it equal zero everytime you call that functiion
because when you go inside
simpleArraySum you no longer have access to scope of main function
@sorinr : Isn't that expected?
but function is inside the main right?
then y?
but function is inside the main right?
No.
Function is called from main, but it doesn't reside in main
@SweetCodingInc not sure what @1532j0004kg want to achieve. haven't took a close look at his code :)
meaning
pls :smile:
in other words,
main and simpleArraySum are two entirely different functions
they're not related to one another
simpleArraySum is defined OUTSIDE of main. Not INSIDE
so they both have different scopes
got it!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! :+1:
@SweetCodingInc thanks
@SweetCodingInc its just a small eng language understanding. it happens also to me sometime to missunderstand something as the eng its not my first lang
@sorinr From what I assume, @1532j0004kg is Indian. (like me) and I know very well the prowess (or lack thereof) of Indians when it comes to English ;)
@1532j0004kg :+1:
@SweetCodingInc i have some singaporean friends and i know how it sounds the singlish compared to "normal" english :)
@1532j0004kg
#include <bits/stdc++.h>
using namespace std;
int simpleArraySum(int n, vector <int> ar) {
// Complete this function
int res = 0;
for(int i = 0 ; i < n ; i++){
res += ar[i];
}
return res;
}
int main() {
int n;
cout << "Total Number of Elements: ";
cin >> n;
vector<int> ar(n);
cout << "Please enter " << n << " numbers" << endl;
for(int ar_i = 0; ar_i < n; ar_i++){
cout << "Please enter element at index " << ar_i << " : ";
cin >> ar[ar_i];
}
int result = simpleArraySum(n, ar);
cout << "Total : " << result << endl;
return 0;
}
consider indenting your code and add appropriate messages wherever you deem necessary
@1532j0004kg indenting your code means aligning your code inside functions to be easy readable. adding comments to the code help others understand what your part of the code is supposed to do
@sorinr
to be easy readable
Correct - to be easily readable
:P
@SweetCodingInc its against forum policy to tell u something ..... :)
@sorinr also
adding comments to the code help others
should be adding comments to the code helps others
@SweetCodingInc its against forum policy to tell u something ..... :)
hahaha
No, If I understood you correctly, you wanted to say that the whole purpose of indenting code is to mess it up :P
@SweetCodingInc you R absolutely right. so no one will want to copy paste your code coz they don't understant it :)
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var commentCount = 0;
var commentArray = [];
function Comment(cName, cComment){
var dateStamp = new Date();
console.log(dateStamp) //Console.log displays the date
commentCount++;
var cid = "comment"+ commentCount;
var upvoteCount = 0;
var downvoteCount = 0;
var replyCount = 0;
var replyArray = [];
this.cName=cName;
this.cComment=cComment;
function cReply(rName, rComment){
replyCount++;
var rid = "reply"+ replyCount;
this.rName=rName;
this.rComment=rComment;
replyArray.push(rid, rName, rComment);
}
commentArray.push(cid, cName, cComment, upvoteCount, downvoteCount, dateStamp, replyArray);
function upvote(){
upvoteCount++;
}
function downvote(){
downvoteCount++;
}
};
$('#commentForm').submit(function(event) {
event.preventDefault();
var commentAuthor = $('#newCommentAuthor').val();
var commentText = $('#newCommentText').val();
var comment = new Comment(commentAuthor, commentText);
console.log(comment.dateStamp); // Console.log displays undefined
var newCommentMarkup = '<div id="'+comment.id+'" style="background-color: #f1f1f1; padding: 5px 5px 5px 5px; margin-bottom: 5px; border-color: grey;border-style: solid;border-width: 1px; overflow: auto;"><div>'+comment.cName+' commented:</div><div>'+comment.cComment+'<br><p style="text-align:right;">'+comment.dateStamp+'<button class="upvoteBtn" style="margin-right:5px;">Upvote</button><button class="downvoteBtn">Downvote</button></p></div><hr><p class="replyArea"></p><textarea class="replyText" rows="4" cols="50" name="reply-box" placeholder="Enter your reply here"></textarea><br><button class="replyButton">Reply</button></div>';
$('#countContainer').empty().append('Total comments: '+commentCount);
$('#commentsContainer').append(newCommentMarkup);
});
});
</script>
<style type="text/css">
#newCommentContainer {
border-color: black;
border-style: solid;
border-width: 1px;
margin: 4% 24% 1% 24%;
padding: 1% 1% 1% 1%;
}
#newCommentText {
width: 100%
}
#commentsContainer {
border-color: black;border-style: solid;border-width: 1px;
margin: 0% 24% 1% 24%;
padding: 0% 1% 1% 1%;
}
#countContainer {
text-align: left;
}
#newCommentAuthor {
margin-bottom: 5px;
}
</style>
<title></title>
</head>
<body>
<div class="commentWidgetContainer">
<div id="newCommentContainer">
<form id="commentForm">
<input id="newCommentAuthor" type="text" name="name" placeholder="Name" autofocus><br>
<textarea id="newCommentText" rows="4" name="comment-box" placeholder="Enter your comment here"></textarea><br>
<input type="submit" value="Submit">
</form>
</div>
<div id="commentsContainer">
<div id="countContainer"></div>
</div>
</div>
</body>
</html>Guys so I made and object using constructor, the dateStamp property of the object is assigned value of Date(). Why is it that the property says undefined when I try to access that property outside? i have added console.log() once after it is defined and once when is it accessed.
Please help
@zlfnhmd same issue. dateStamp is limited in scope only to the function where you declare it that is the Comment function
@zlfnhmd you haven't set a
dateStamp property, only a variable within the function. You set properties using the this keyword, as you did further down the function
zlfnhmd sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 508 | @kbaig |http://www.freecodecamp.org/kbaig
@zlfnhmd you haven't set a
dateStampproperty, only a variable within the function. You set properties using thethiskeyword, as you did further down the function
So that means I will have to create a date variable and pass it as constructor argument?
@zlfnhmd no, you're not limited to using
this on constructor arguments
@zlfnhmd As a note
this function is not available outside the constructor
you need
function downvote(){this function is not available outside the constructor
you need
this.downvote = function() {
}
Why did the author of this login form use a bottom margin on the label/input instead of just putting bottom padding on the fieldset (which already has duplicate padding on top, right, left)? I'm assuming it's something semantic but I fail to see how this is better. Thanks! https://codepen.io/shayhowe/pen/dCehs
referring to this part of the CSS (lines 23-31)
.account-info {
padding: 20px 20px 0 20px;
}
.account-info label {
color: #395870;
display: block;
font-weight: bold;
margin-bottom: 20px;
}
@JBallin Well that bottom margin exists for both labels, so it's consistent
It's not that they put in the bottom margin to add spacing between the input field area and the submit button area, it's that the margin is for spacing between the labels and whatever comes after them
@JBallin in my opinion there is nothing semantic in using margins or padding that only gives space around to an element
@JBallin its just pure styling
ah right thank you @kbaig . should've noticed the lost spacing between the input fields (when removing bottom-margin).
jballin sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 509 | @kbaig |http://www.freecodecamp.org/kbaig
<p <a href="http://freecatphotoapp.com"> cat photos</a> </p>
there
<p vs <p>
In above codepen, why does author float both elements (left) in the account-action class ("login" btn + "stay signed in" checkbox)
.account-action .btn {
background: linear-gradient(#49708f, #293f50);
border: 0;
color: #fff;
cursor: pointer;
font-weight: bold;
float: left;
padding: 8px 16px;
}
.account-action label {
color: #7c7c80;
font-size: 12px;
float: left;
margin: 10px 0 0 20px;
}
there's a slight change when i remove the floats but it's so small I'm curious what's the reasoning behind it
Hello All, I'm new to Free Code Camp, also the Code Community. Looking for any sound advice. I've completed my first 100 challenges including my tribute page which I'm sure needs fine tuning. However, the profile challenge has truly thrown me into a place of unknown. I don't know where to start to make my profile work properly, although I can get my background set, also place certain words and buttons on the page, I feel like my code style is all over the place also having trouble starting second page.
@JBallin if you inspect the label, you'll see that the top margin doesn't go into effect unless both elements in that div are floated
@Arria2017 take a look at some example codes - make it pretty simple and move on - you will want to go back and change/add stuff as you do more projects
@VaseJS @krisb1220 you are both right, and my 'JS is only good for two things' rant was wrong. In retrospect I should probably not even have mentioned the CLI.
I was mainly trying to help @JuanMP429 (who I'm guessing is pretty new to all this based on his questions) understand how HTML and Javascript fit together, and particularly why it's worthwhile for him to keep learning HTML even though Javascript is where most of the really cool stuff happens in terms of web development.
arria2017 sends brownie points to @mot01 :sparkles: :thumbsup: :sparkles:
:cookie: 955 | @mot01 |http://www.freecodecamp.org/mot01
@sjames1958gm I've seen your name so many times while working on the FCC Leaderboard challenge, I feel like I know you :)
@Arria2017 concentrate on a few sections - a nav, and body (or maybe projects), and maybe a footer
Has anyone here worked with ES6 modules beyond the obligatory usage as part of React? I've been trying it out lately, and really liking it. However, I was really bummed to discover that extending builtins including
extends Array does not work in Babel, which sucks. Is there a way to get the same behavior without using ES6 modules?
You could do it the old fashioned way by tacking things onto
Array.prototype
@moT01 https://codepen.io/Arria2017/pen/LeeXeG <---- this is mine so far, however I'm gonna erase and start over. I checked yours out looks great!
@kbaig wow that's interesting. why is that? I noticed the left/right margins won't apply either.
My deduction from that is that they were floated left to allow for control on placement. Is that common/best practice?
My deduction from that is that they were floated left to allow for control on placement. Is that common/best practice?
@Arria2017 imo if you're a beginner, the beginner challenges, especially the portfolio project, are only worth giving a fair shot based on your current abilities. You can come back to them once you've improved a lot after finishing/arriving at the final projects
@kbaig, I ideally want special kinds of 'sets' that will always contain certain types of objects, and then I want to add methods to the special array that are aware of the type of the children, but I don't want this to apply to all arrays
@kbaig Wow! I feel so much better - was feeling pressured to finish the Portfolio before I moved on to other challenges.
@Arria2017 thanks, yours is on the right track - take note of how i indent my code - sort of a universal way to do it
mot01 sends brownie points to @arria2017 :sparkles: :thumbsup: :sparkles:
:cookie: 102 | @arria2017 |http://www.freecodecamp.org/arria2017
@JBallin It's probably better to ditch float in favor of flexbox in most cases. Float works kind of unintuitively imo
but I suppose you're right. What I ended up settling for is 'demoting' the array to a property of the object. But now my syntax for interacting with the array elements is not as pretty ->
specialArray.array[2] instead of specialArray[2]
jballin sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
api offline
@moT01 ok Perfect I will take note of the indent of your code
@simeydk The ES6 class syntax is really just syntactic sugar over the ES5 way of doing things
simeydk sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 510 | @kbaig |http://www.freecodecamp.org/kbaig
@moT01 Simon, Nice! haha I remember that game! Brings back memories...
@kbaig @simeydk can't you just do the following:
let specialArray = new Array();
specialArray[0] = "a";
specialArray[1] = "b";
specialArray[1] // b
thanks @kbaig (said api offline last time)
jballin sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
api offline
hmm still says that for me. is there a limit to how many thanks i can give one person in a certain time period?
@simeydk my understanding is that extending is not best practice
a more descriptive error message would be good, not sure who's in charge of that
@JBallin I suspect they've just set "api offline" as the only error message, rather than it being an inappropriate one for this specific error
@JBallin @simeydk I believe he wants to create an object which is arrays but with extra methods, so it's not a problem of changing its values
@kbaig they set it up this way, so if somebody thanks twice on the same subjects the other party don't get the brownie points. this is what i think
sorinr sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 511 | @kbaig |http://www.freecodecamp.org/kbaig
sorinr sends brownie points to @kbaig :sparkles: :thumbsup: :sparkles:
@sorinr right no I think that enforcement is fine. I'm just commenting on the error message
its just a "neutral" message
@sorinr well "api offline" isn't quite indicative of the reason for the error
https://codepen.io/zlfnhmd/pen/opdGWp
So guys I have a problem again, I cant figure out why the replies dont appear unless the comment to be replied has a comment under it. That is if there are n comments I can only reply to n-1 comments.
Please help me out.
I must say I have learnt a great deal since i started this project
@zlfnhmd NO COMMENT! :) JUST KIDDING. I'LL TAKE A LOOK AND IF I CAN HELP i HELP
``
var randomNumber = Math.floor(Math.random() * 100) + 1;
var guesses = document.querySelector('.guesses');
var lastResult = document.querySelector('.lastResult');
var lowOrHi = document.querySelector('.lowOrHi');
var guessSubmit = document.querySelector('.guessSubmit');
var guessSubmit = document.querySelector('.guessField');
var guessCount = 1;
var resetButton;
function checkGuess(){
var userGuess = Number(guessField.value);
if(guessCount = 1){
guesses.textContent = "Previous guesses";
}
guesses.textContent += userGuess + " ";
if(userGuess === randomNumber)
{
lastResult.textContent = "Congratulations! You got it right!";
lastResult.style.backgroundColor = "gray";
lastResult.style.color = "limegreen";
lowOrHi.textContent = " ";
setGameOver();
}
else if(guessCount === 10)
{
lastResult.textContent = "THE GAME IS OVER!";
setGameOver();
}
else{
lastResult.textContent = "Wrong Guess!";
lastResult.style.backgroundColor = "red";
lastResult.color = "white";
if(userGuess < randomNumber)
{
lowOrHi.textContent = "The last guess was too low!";
}
else if (userGuess > randomNumber)
{
lowOrHi.textContent = "The last guess was too high";
}
}
guessCount++;
guessField.value = "";
guessField.focus();
}
guessSubmit.addEventListener('click', checkGuess);``
``<h1>Number Guessing Game</h1>
<p>We have selected a randome number between 1 and 100.See if you can guess the number in 10 turns or less</p>
<br>
<p>We will tell you if your guess is too high or too low</p>
<div class="form">
<label for="guessField">Enter a guess:</label><br>
<input type="text" id="guessField" class="guessField">
<input type="submit" class="guessSubmit" value="Submit Guess">
</div>
<div class="resultParas">
<p class="guesses"> </p>
<p class="lastResult"></p>
<p class="lowOrHi"></p>
</div>``
``
<h1>Number Guessing Game</h1>
<p>We have selected a randome number between 1 and 100.See if you can guess the number in 10 turns or less</p>
<br>
<p>We will tell you if your guess is too high or too low</p>
<div class="form">
<label for="guessField">Enter a guess:</label><br>
<input type="text" id="guessField" class="guessField">
<input type="submit" class="guessSubmit" value="Submit Guess">
</div>
<div class="resultParas">
<p class="guesses"> </p>
<p class="lastResult"></p>
<p class="lowOrHi"></p>
</div>
``
<h1>Number Guessing Game</h1>
<p>We have selected a randome number between 1 and 100.See if you can guess the number in 10 turns or less</p>
<br>
<p>We will tell you if your guess is too high or too low</p>
<div class="form">
<label for="guessField">Enter a guess:</label><br>
<input type="text" id="guessField" class="guessField">
<input type="submit" class="guessSubmit" value="Submit Guess">
</div>
<div class="resultParas">
<p class="guesses"> </p>
<p class="lastResult"></p>
<p class="lowOrHi"></p>
</div>var randomNumber = Math.floor(Math.random() * 100) + 1;
var guesses = document.querySelector('.guesses');
var lastResult = document.querySelector('.lastResult');
var lowOrHi = document.querySelector('.lowOrHi');
var guessSubmit = document.querySelector('.guessSubmit');
var guessSubmit = document.querySelector('.guessField');
var guessCount = 1;
var resetButton;
function checkGuess(){
var userGuess = Number(guessField.value);
if(guessCount = 1){
guesses.textContent = "Previous guesses";
}
guesses.textContent += userGuess + " ";
if(userGuess === randomNumber)
{
lastResult.textContent = "Congratulations! You got it right!";
lastResult.style.backgroundColor = "gray";
lastResult.style.color = "limegreen";
lowOrHi.textContent = " ";
setGameOver();
}
else if(guessCount === 10)
{
lastResult.textContent = "THE GAME IS OVER!";
setGameOver();
}
else{
lastResult.textContent = "Wrong Guess!";
lastResult.style.backgroundColor = "red";
lastResult.color = "white";
if(userGuess < randomNumber)
{
lowOrHi.textContent = "The last guess was too low!";
}
else if (userGuess > randomNumber)
{
lowOrHi.textContent = "The last guess was too high";
}
}
guessCount++;
guessField.value = "";
guessField.focus();
}
guessSubmit.addEventListener('click', checkGuess);
can someone help me with this,the code runs before i type in the number
either way, you have invoked your code at the start, and that’s why its running.
function checkGuess(){
wait…no thats not it
what about
function SpecialArray(array) {
this.arr = array;
}
SpecialArray.prototype.printAllValuesObjs = function() {
this.arr.forEach(function(obj) {
for (key in obj) {
console.log(obj[key]);
}
})
}
var special = new SpecialArray([{a:1, b:2}, {c:3, d:4}]);
special.printAllValuesObjs()
// 1
// 2
// 3
// 4
what I want is something like this
class SetofElements extends Array {
hasValues() {
return this.filter(element => element.value)
}
}
I want the convenience of
set[i] = foo and set.push(foo) and all the other array goodness, but with the ability to add my own custom methods which describe my "business logic"
@Kingwindie Its running because of this
var guessSubmit = document.querySelector('.guessSubmit');
var guessSubmit = document.querySelector('.guessField');so the .guessField is overwriting and therefore running when clicked.
@simeydk you know what, i'm not sure why i said that. i'm not as familiar with JS classes, so disregard that.
My current scenario is this:
I am writing a sudoku solver. As part of this, I have the idea of a row/column/block, which primarily consists of 9 cells, so an array is a good fit. I then want a function that says "find all the numbers which haven't been entered in this row, and for each of them find all the cells that can possibly be that value".
I can do this in an external function, but the niftiest implementation, in my opinion is the extends Array with methods
because function is so tightly coupled with the object type
@JBallin I'm using them for the first time at the moment. What i know I learnt from https://eloquentjavascript.net/06_object.html. It's a pretty good book
and it's free
kingwindie sends brownie points to @ezioda004 :sparkles: :thumbsup: :sparkles:
:cookie: 373 | @ezioda004 |http://www.freecodecamp.org/ezioda004
@simeydk what about just compiling the code to native JS yourself using babel?
@JBallin Babel is the problem. My code works in node and in chrome directly. Babel supports
class extends, unless you extend a 'buitin' such as Array
if you run the (transpiled) babel code, it returns an object of type
Array which does doesn't have the extra methods and properties of the custom class
@Kingwindie Yeah, its crazy, atleast js is not strict about
;. I get Java PTSD.
@ezioda004 Yeah JS engines automatically put in the semicolons for you. There's a school of thought that chooses to not use them in JS at all
@JBallin here are two pens that show the issue:
Babel on: https://codepen.io/simeydk/pen/ZvovQV
Babel off: https://codepen.io/simeydk/pen/PEeEzj
Babel on: https://codepen.io/simeydk/pen/ZvovQV
Babel off: https://codepen.io/simeydk/pen/PEeEzj
@kbaig Thats interesting, but I'm too oldschool to stop using semicolons in js :D
The youtube channel funfunfunctions writes JS that way and made a whole video about it to calm people down
@simeydk If you do
const e = new Extender()
console.log(e)in the console
Extender []
length: 0__
proto__: ArrayWhich seems to imply that Extender is derived from Array
Actually I've been watching his videos, he explains quite well and just fun to watch. I'll definitely check it out
@ezioda004 @kbaig semicolons are sometimes required (obscure cases), i wrote more about it here and the inspiration was from funfunfunction (video linked at end)
@JBallin oh interesting. He was actually my source haha on the topic haha. Thanks for sharing
kbaig sends brownie points to @jballin :sparkles: :thumbsup: :sparkles:
:cookie: 25 | @jballin |http://www.freecodecamp.org/jballin
@sjames1958gm did you run all the code in the console, or run it in the codepen with babel on? If I run it in the codepen with babel on, I get Array in the console
I need to use Babel since I want to use React, but Babel breaks
extends Array, so I can't have both at the same time
Stackoverflow discussion on Babel not supporting
extends array https://stackoverflow.com/questions/33832646/extending-built-in-natives-in-es6-with-babel
I just need a little help to undestand whats is wrong here. I want to proceed the value gotten on input and pass through the function:
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
title = 'app';
numberFormat = '';
ngOnInit(): void {
console.log(formatedNumber(12121212));
formatedNumber(this.numberFormat);
}
}
function convertNumber(num){
return new Intl.NumberFormat().format(Math.round(num*10)/10);
}
function formatedNumber(num){
if(num >= 1000000)
return convertNumber(num/1000000)+'M';
if(num >= 1000)
return convertNumber(num/1000)+'k';
return convertNumber(num);
}<div class="wrapper">
<input type="number" name="name" id="name" [ngModel]="numberFormat" #number />
<label for="name" (click)="ngOnInit(number.value)">prettify</label>
</div>
@JBallin That was an interesting read, so using
; is just better. Thanks for sharing
ezioda004 sends brownie points to @jballin :sparkles: :thumbsup: :sparkles:
:cookie: 26 | @jballin |http://www.freecodecamp.org/jballin
@ezioda004 @kbaig thanks for reading! glad you found it interesting. I wouldn't say using semicolons is "better", it's a preference. I like using them but others like the minimalism of omitting them.
jballin sends brownie points to @ezioda004 and @kbaig :sparkles: :thumbsup: :sparkles:
:cookie: 515 | @kbaig |http://www.freecodecamp.org/kbaig
:cookie: 374 | @ezioda004 |http://www.freecodecamp.org/ezioda004
@JBallin For me, I like using them as a means to mark up different things happening in my code - kind of improves readability for me
@kbaig can you expand on that? do you mean separating "instructions"/statements?
@JBallin I meant better in the sense that other than the cases you mentioned it always makes the code more readable. I like them using anyway cause it reminds me of java
@JBallin Things like function declarations vs assignments and statements yeah
@ezioda004 gotcha, just clarifying. i use them everywhere besides the places i mentioned (function declarations, if/else statements, loops)
@moT01 why did your codepen link have an "s" at the front of it? maybe so gitter won't show a preview? https://s.codepen.io/moT01/pen/vgOaoJ
Hello; I have not been on for a very long time. I have been doing mine own projects. I am hoping that I can get some help though!
I have been working with functions through javascript. here is the function; $("#submit").on('click', function typeSubmit(){
var H = document.querySelector('#horseText').value;
var bHorse = ['A','C','F','G','M','P','Q','S','T'];
// var fHorses =['aHorse()', 'cHorse()', 'fHorse()', 'gHorse()', 'mHorse()', 'pHorse()', 'qHorse()', 'sHorse()', 'tHorse()'];
var tHorse = ['A','C','M','P','R'];
var breedHorse, typeHorse;
if(H =="breed" || H == "Breed" || H == "breeds" || H == "Breeds"){
var H = document.querySelector('#horseText').value;
var bHorse = ['A','C','F','G','M','P','Q','S','T'];
// var fHorses =['aHorse()', 'cHorse()', 'fHorse()', 'gHorse()', 'mHorse()', 'pHorse()', 'qHorse()', 'sHorse()', 'tHorse()'];
var tHorse = ['A','C','M','P','R'];
var breedHorse, typeHorse;
if(H =="breed" || H == "Breed" || H == "breeds" || H == "Breeds"){
breedHorse += "<button id='aHorse' class='btn-default btn-sm'>A</button>";
breedHorse += "<button class='btn-default btn-sm' id='cHorse'>C</button>";
breedHorse += "<button class='btn-default btn-sm' id='fHorse'>F</button>";
breedHorse += "<button class='btn-default btn-sm' id='gHorse'>G</button>";
breedHorse += "<button class='btn-default btn-sm' id='mHorse'>M</button>";
breedHorse += "<button class='btn-default btn-sm' id='pHorse'>P</button>";
breedHorse += "<button class='btn-default btn-sm' id='qHorse'>Q</button>";
breedHorse += "<button class='btn-default btn-sm' id='sHorse'>S</button>";
breedHorse += "<button class='btn-default btn-sm' id='tHorse'>T</button>";
/*
for(var i=0; i < fHorses.length; i++){
for(var j=0; j < bHorse.length; j++){
breedHorse += "<ul class = 'btn-toolbar oneToolbar list-unstyled'>";
breedHorse += "<li><button class = 'btn-default btn-sm' id = ''><a href='" + fHorses[j] +"'>" + bHorse[i] + "</a></button>";
}
}
breedHorse += "</ul>";
*/
document.getElementById("Horses").innerHTML = breedHorse;
}
else if(H =="type" || H == "Type" || H == "types" || H == "Types"){
for(var k=0; k < tHorse.length; k++){
typeHorse += "<ul class = 'btn-toolbar oneToolbar list-unstyled'>";
typeHorse += "<li><button class = 'btn-default btn-sm' id = ''>" + tHorse[k] + "</button>";
}
typeHorse += "</ul>";
document.getElementById("Horses").innerHTML = typeHorse;
}
});
I can get the buttons to show up on the page I want them to but to call any other function from any of the buttons will not work. I am calling the functions from each button through the id indicator but nothing is happening. Also I get an 'undefined' showing up at the beginning of the buttons. I have no idea where the 'undefined' is coming from as I do not see literately no information in the google development tools for the 'undefined'. Any thoughts?
https://codepen.io/zlfnhmd/pen/opdGWp
So guys I finally completed my project. Big thanks to @kbaig @cmccormack @sjames1958gm
zlfnhmd sends brownie points to @kbaig and @cmccormack and @sjames1958gm :sparkles: :thumbsup: :sparkles:
api offline
api offline
api offline
@simeydk I ran the code from the js portion of codepen
@simeydk Oh, well I would not recommend extending built-ins regardless
@fvdave2017 You are using += on an unitialized value so you will get "undefined<button . . ."
@fvdave2017 How are you linking these new buttons to javascript?
I'm trying to do the "Show The Local Weather" challenge on FCC. However my code does absolutely nothing. Does someone have some tips? https://codepen.io/daveb02/pen/qpYoLG I have looked at the following pages already:
http://api.jquery.com/jquery.getjson/
https://stackoverflow.com/questions/3983088/javascript-error-uncaught-syntaxerror-unexpected-end-of-input
http://api.jquery.com/jquery.getjson/
https://stackoverflow.com/questions/3983088/javascript-error-uncaught-syntaxerror-unexpected-end-of-input
By the way, I am just trying to get the code to display output from the API at all, I'm not trying to make it detect the user's location yet
@DavidBelmares Your callback function needs a parameter so it can receive the json from the API request
@DavidBelmares Also you need quotes around your id in the HTML
@DavidBelmares Assume the parameter was
json which will be an object containing the returned data $("#weather-container").text(JSON.stringify(json));
Use stringify to put it in a form that can be displayed
davidbelmares sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8847 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm