Computer Hope

Internet & Networking => Web design => Topic started by: newfunland on October 21, 2017, 01:47:28 AM

Title: need help for some really simple html
Post by: newfunland on October 21, 2017, 01:47:28 AM
so long story short i'm not the greatest at html, nor am i fluent in it, and i been googling all day getting thrown in circles landing o the same pages over and over and over, it's pretty insane how google over the years keeps getting less useful as a search engine, literally my last search got me to a page of animal picture, completely unrelated to HTML and what i was trying to do and now i'm here.

All I want To do is have and input text box, a button that's clicked, and the value that was entered into the box is temporary save, and display on screen, it does NOT need to go to a database, it douse not need to be permanently saved to my site, it just needs to sit there look pretty and and get referenced to for other program i am using.

If anyone can point me to a good tutorial ( not just some 3 lines of code that only 1/8 related to what i need to do like w3 school did to me all day) or if you just wanna make it yourself and share, i seriously doubt it would take any time at all for an experience html user. thanks in advance, it will be a late reply im tired its 3 am and im tired of searching.
Title: Re: need help for some really simple html
Post by: newfunland on October 21, 2017, 10:12:50 AM
haha guess it not so simple, figured a input box and submit button would be pretty easy guess im wrong . still cant find anything on how to do this, i mean i can do an input box, a submit button, just don't know how to set it for a temp variable in html to be referenced to, and agin it doesn't not to be saved to a database, jsut needs to be displayed look pretty andbe able to get the input that was temperately saved
Title: Re: need help for some really simple html
Post by: Geek-9pm on October 21, 2017, 06:38:34 PM
There are very simple HTML editors that let you type in something and it is saved in HTML. I like to use Sea Monkey for just plain HTML code.
Here is a reference:
http://ksuweb.kennesaw.edu/~tpowel25/FacultyEResources/SeaMonkeyInst.pdf
A video:
https://www.youtube.com/watch?v=zcaYsG2nYqU
(Ignore the Ad.)
You want to do input?
Very simple HTML input is done with a FORM.
Here is a reference for input types.
https://www.w3schools.com/html/html_form_input_types.asp
Example:
Code: [Select]
<form>
  First name:<br>
  <input type="text" name="firstname"><br>
  Last name:<br>
  <input type="text" name="lastname">
</form>
Does that help any?  :)
Title: Re: need help for some really simple html
Post by: BC_Programmer on October 21, 2017, 07:51:45 PM
What you seek is impossible in just HTML. It requires you to use Javascript as well.

Anyway this is based on this (https://stackoverflow.com/questions/33203173/change-innerhtml-on-button-click) search result from Google:

Code: [Select]
<html>
<head>
<script language="javascript">
function runclick()
{
    document.getElementById('resultshow').InnerHTML=textinput.value;
    textinput.value = "";
}
</script>
</head>
<body>
<input type="text" id="textinput"/>
<button onClick="runclick();">Click</button>
<div id="resultshow">Text</div>
</body>
</html>
Title: Re: need help for some really simple html
Post by: Geek-9pm on October 21, 2017, 10:40:10 PM
Quote
All I want To do is have and input text box, a button that's clicked, and the value that was entered into the box is temporary save, and display on screen, it does NOT need to go to a database, it douse not need to be permanently saved to my site, it just needs to sit there look pretty and and get referenced to for other program i am using.
It  would help if the OP can describe  what he wants to do rather than  limit how it is done. He can use a variety of tools, but we have to guess why his program can not get this information? Where is his program? How does his program find data?

If you needs a server side scrip, then he has t use a program that works on the server. Maybe a PHP script.
The OP may have just did a quick look at  w3schools.com and made a quick judgement. Most everything a newbie could want to learn is there in w3schools.com and he doe not like that way of doing something, he needs to just use a template somebody has already built. There are thousands of free templates for almost anything.
Here are 25 CSS  he can study.
http://www.qubesys.com/25-css-form-templates-and-input-styles/

If he can clearly define what he wants to do, there is surely a script that has already been written.
Title: Re: need help for some really simple html
Post by: newfunland on October 22, 2017, 02:03:15 PM
Thanks guys for the information and links, seems i might be able to do what i am looking for i didn't know i would have to use java script to do this, i thought maybe i could do it just in html, and sorry if i was not clear enough on what i want to do, I'm not quite sure how to fully explain it but ill try,

The user Inputs their Team Name, Clicks a submit button, That Will submit that name temporarily doesn't need to be permanently saved.
Then the API i am using can get that team name, and submit their score to that team name score. everything is already handled by the API, i just can't figure out how to Set a Team Name Temporary for the API to reference so it can submit that score under the correct team name.

This is still unfamiliar to me and thank you for the help, I am definitely gonna check out the sea monkey. I will let you all know what i can come up with, and any further suggestions are still welcome

Title: Re: need help for some really simple html
Post by: newfunland on October 22, 2017, 03:40:23 PM
I may have found what i am looking for, gonna try testing this and see what i can come up with

Code: [Select]
<body>
    <input type="text" id="userInput">give me input</input>
    <button id="submitter">Submit</button>
    <div id="output"></div>
    <script>
        var didClickIt = false;
        document.getElementById("submitter").addEventListener("click",function(){
            // same as onclick, keeps the JS and HTML separate
            didClickIt = true;
        });

        setInterval(function(){
            // this is the closest you get to an infinite loop in JavaScript
            if( didClickIt ) {
                didClickIt = false;
                // document.write causes silly problems, do this instead (or better yet, use a library like jQuery to do this stuff for you)
                var o=document.getElementById("output"),v=document.getElementById("userInput").value;
                if(o.textContent!==undefined){
                    o.textContent=v;
                }else{
                    o.innerText=v;
                }
            }
        },500);
    </script>
</body>
</html>

i did try the code below in the try it editor but it doesnt seem to change the text but i wil lgive it a go on my site and see what happens
Code: [Select]
<html>
<head>
<script language="javascript">
function runclick()
{
    document.getElementById('resultshow').InnerHTML=textinput.value;
    textinput.value = "";
}
</script>
</head>
<body>
<input type="text" id="textinput"/>
<button onClick="runclick();">Click</button>
<div id="resultshow">Text</div>
</body>
</html>
Title: Re: need help for some really simple html
Post by: newfunland on October 22, 2017, 08:10:41 PM
Not to much progress on this so far. It occurred to me I should show the line of code I'm trying to set the user name.

 <script>
Var gamescore = new score.Submit(publicsiteKey, teamName [, options])
</script>

I need to set the team name that's what I need to accomplish sorry again for my lack of experience. My experience lies it making the games a content creation.
Title: Re: need help for some really simple html
Post by: BC_Programmer on October 22, 2017, 10:09:17 PM
I gave you the wrong code before.

Code: [Select]
<!DOCTYPE html>
<html>
<body>

    <p id="demo">Hello</p>
    <button id="btn" type="button">Try it</button>

    <script>
        document.getElementById('btn').onclick = function() {
            document.getElementById('demo').innerHTML = 'Hey There';
        }
    </script>
</body>
</html>

Without knowing exactly what this "API" you are using is, What you have there is literally just the syntax example.

You would need to have a publicsiteKey, a teamName, and the options are, well, optional, which is why they are in square brackets.  No idea what the options can be nor what the SiteKey actually is, though it seems like an API Key.

Code: [Select]
SiteKey="jhsdkfhjsdhfksdf";
teamName="Some Team";
var gamescore = new score.Submit(SiteKey,teamName);
Title: Re: need help for some really simple html
Post by: newfunland on October 23, 2017, 02:28:41 AM
sorry again for lack of information, i contacted my partner about it, he doesn't feel comfortable letting me post his api code here, why idk it would probably make everything way easier, but me its written in java-script, and what im referencing is a constructor, i started google that and got way lost >.>
but what i do have so far is

Code: [Select]
<input type="text" id="userInput"=> give me input</input>
<button onclick="test()">Submit</button>

<!-- add this line for function to write into -->
<p id="demo"></p>   

<script type="text/javascript">
function test(){
    var userInput = document.getElementById("userInput").value;
    document.getElementById("demo").innerHTML = userInput;
}
</script>


<script src="someHTTPSadress"></script>
<script>
var teamName = "testteam"
        var publicsitekey = "as545as45"
    var gamescore = new score.Submit(publicsitekey, teamName ,{
    })
</script>

Now I am just trying to figure out how to set the var teamName = "what i need to set", im reading this right now and probably need to get some sleep its 4:30, https://www.w3schools.com/jsref/prop_text_value.asp



Title: Re: need help for some really simple html
Post by: BC_Programmer on October 23, 2017, 09:10:15 AM
change
Code: [Select]
var teamName = "testteam"

to

Code: [Select]
var teamName = document.getElementById("userInput").value
Title: Re: need help for some really simple html
Post by: newfunland on October 23, 2017, 11:43:28 AM
well good news is everything is running, without errors. when i just set the user name like var teamName = "SomeName", everything goes through fine and the SomeName shows up on the score sheet. but when i use var teamName = document.getElementId("userInput").value well no team name shows up or score

I'm not sure whats going but i did manage to solve this by useing  var teamName = prompt("Give me input I'm Scary Tarry B");

and everything worked fine, my conclusion on that is maybe that its looping and not setting the variable after i click on submit
Title: Re: need help for some really simple html
Post by: BC_Programmer on October 23, 2017, 01:23:10 PM
Code: [Select]
<script>
var teamName = "testteam"
        var publicsitekey = "as545as45"
    var gamescore = new score.Submit(publicsitekey, teamName ,{
    })
</script>
This part will run as soon as the document is loaded, so there would never be a value in the textbox. If you want this to happen when the button is clicked it has to be in the button click event. The <script> tag referencing your API needs to be before that as well.