So I have started work on a new small project where I modify someone else's code (because I can't do anything on my own lol). In this project I am adding a text field where you can change the selected genre to a different one and the API that I have set in place right now will grab a list of songs and display them on screen with the number of plays, downloads and favorites in a orderly fashion from the use of css right now my problem is getting that genre text (the variable) into the JavaScript variable called "Genretxt". "Genretxt" is then pasted to the screen after "Genre: " using the:
Code:
in the js panel in Code-pen
and it interacts with the html:
Code:
In the html section
and that is how I am displaying the current selected genre
but I still have problems with getting that genre variable from the user. One way to fix this is to use a forum to post it into a java script function called "setvalue" and from my knoledge you can use the brackets to put in variables. So I got it all set up to submit the data through the function and in the function I have it set to take the variable the user entered and set "genre" to that variable.
Next I had to reload the webpage because the webpage already loaded in with content and it will not over wight it without something along the lines of this:
Code:
(that is the code I used to set the title of the current selected genre)
but instead of doing that I looked online for a way to refresh specific content. (because if I refresh everything I lose the genre the user wanted to select and see the data for)
so I found a place (links will be at the end) that said that you can do that by reloading specific div tags. But because I do not think that it is limited to div tags I instead used it with a "id" to select what I wanted to be reloaded. This lead me to create a function called "reload" that once called it would reload content by executing the following:
Code:
where the id is "ReloadAble" is what is to be reloaded. I'm not even sure that this will even work to reload but that is why I am here right now lol)
but the html is different as I added the id to some of the elements and was not sure if I can add two id's to the same element so I decided not to put it on the ones that already have one
the whole html code looks like this:
https://codepen.io/SeeGreatness/pen/YxRZbB
as well as the complete JavaScript and css (but the css does not need any attention)
but what may be more important than my code is the original. That is so you can determine what already works and doesn't need modifying... That is if you want to look at it or help me.
That link is right here: https://codepen.io/nickmoreton/pen/Eveaq?q=soundcloud&limit=all&type=type-pens
I appreciate everyone who attempts to help me and also those who have taken time to view and read this topic.
-SeeGreatness
Code:
document.getElementById("InsertGenreType").innerHTML = Genretxt+genre;in the js panel in Code-pen
and it interacts with the html:
Code:
<h2 id="InsertGenreType"> </h2>In the html section
and that is how I am displaying the current selected genre
but I still have problems with getting that genre variable from the user. One way to fix this is to use a forum to post it into a java script function called "setvalue" and from my knoledge you can use the brackets to put in variables. So I got it all set up to submit the data through the function and in the function I have it set to take the variable the user entered and set "genre" to that variable.
Next I had to reload the webpage because the webpage already loaded in with content and it will not over wight it without something along the lines of this:
Code:
document.getElementById("insert").innerHTML = Genretxt+genre;(that is the code I used to set the title of the current selected genre)
but instead of doing that I looked online for a way to refresh specific content. (because if I refresh everything I lose the genre the user wanted to select and see the data for)
so I found a place (links will be at the end) that said that you can do that by reloading specific div tags. But because I do not think that it is limited to div tags I instead used it with a "id" to select what I wanted to be reloaded. This lead me to create a function called "reload" that once called it would reload content by executing the following:
Code:
function reload(){
var container = document.getElementById("ReloadAble");
var content = container.innerHTML;
container.innerHTML= content;
}where the id is "ReloadAble" is what is to be reloaded. I'm not even sure that this will even work to reload but that is why I am here right now lol)
but the html is different as I added the id to some of the elements and was not sure if I can add two id's to the same element so I decided not to put it on the ones that already have one
the whole html code looks like this:
https://codepen.io/SeeGreatness/pen/YxRZbB
as well as the complete JavaScript and css (but the css does not need any attention)
but what may be more important than my code is the original. That is so you can determine what already works and doesn't need modifying... That is if you want to look at it or help me.
That link is right here: https://codepen.io/nickmoreton/pen/Eveaq?q=soundcloud&limit=all&type=type-pens
I appreciate everyone who attempts to help me and also those who have taken time to view and read this topic.
-SeeGreatness
