onClick element not working

Question

I want to save the input of some fields in variables after a click on a button (I am using Bootstrap btw). This is my function:

<script>
  function test () {
    var test1 = document.getElementById("nameown").value;
    javascript.alert( 'test1' )
  }
</script>

and this is my button:

<div id="button">
        <onclick="test()" class="btn btn-success btn-large">
            Example...
          </a>
        </button>
      </div>

When I click on the button nothing happens...

As a annotation: I am a HTML and JavaScript beginner.

Haha ;). As mentioned I am a beginner. Thank you for your answers. I will try them now — user1675002
– user1675002, Commented Sep 13, 2013 at 21:16

Jason P · Accepted Answer · 2013-09-13 21:09:21Z

1

Let's see..

There's no element with an id of nameown.
If anything, it would be window.alert(), but just alert() is fine.
You're alerting the literal string "test1" instead of the variable.
onclick is not an element.
You don't have an opening a tag.
You don't have an opening button tag.

I think this is what you were going for:

<script>
  function test() {
    var test1 = document.getElementById("button").value;
    alert(test1);
  }
</script>

<div id="button" onclick="test()" class="btn btn-success btn-large">
    Example...
</div>

There are more elegant ways of doing this, as well as shortcuts, but you'll get there if you stick with it.

answered Sep 13, 2013 at 21:09

Jason P

27k3 gold badges34 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user1675002 Over a year ago

Thank you very much for answering my questions, I think the answers are all correct. And btw sry for the mess I've created ;). @Jason P: nameown was the name of the input field.

Jason P Over a year ago

Don't apologize, we all had to start somewhere.

DutGRIFF · Accepted Answer · 2013-09-13 21:24:35Z

1

Your HTML is incorrect. It should look like this:

<div id="button" onclick="test()" class="btn btn-success btn-large">
  Example...
</div>

or

<button onclick="test()" class="btn btn-success btn-large">
  Example...
</button>

I was really caught up in that mess of HTML and didn't pay attention to the script. It is pretty bad. Let me give you a few pointers. Start with HTML and learn the basics. wcshcools is a start. Then move on to javascript like that you were attempting above. You probably wanted something like this:

<script>
  function test() {  //Create the function test 
    var test1 = document.getElementById("nameown").value;  //Get the element with id="name own" and assign it to a variable named "test1"
    console.log(test1); //log the value of the variable "test1"
  }
</script>

I went with console.log because it is a way better way to test code. For instance if you looped that function you would have a problem in some browsers. To view the console check out firebug for firefox or use the dev console in Chrome or Safari. Learn the dev console. It will come in handy.

edited Sep 13, 2013 at 21:24

answered Sep 13, 2013 at 21:05

DutGRIFF

5,2331 gold badge36 silver badges43 bronze badges

3 Comments

Raphaël Althaus Over a year ago

you forgot also var test1 = document.getElementById("nameown").value; javascript.alert( 'test1' ) Variable named test1, then use a string in alert (probably instead of variable)...

tckmn Over a year ago

@RaphaëlAlthaus Also javascript.alert isn't a thing

DutGRIFF Over a year ago

That is true. I am guessing he wants to alert the value of name own. I will add this to my answer. I was too caught up in that mess of HTML.

Erik Christianson · Accepted Answer · 2013-09-13 21:03:31Z

0

you shouldn't have a < before onclick. Is that a typo? Is there a lot of other extra stuff there too?

<div id="button" onclick="test()" class="btn btn-success btn-large">
Example...
</div>

answered Sep 13, 2013 at 21:03

Erik Christianson

5073 silver badges12 bronze badges

Comments

Vlad · Accepted Answer · 2013-09-13 21:04:39Z

0

You're missing the tag "a"

<div id="button">
  <a onclick="test();" class="btn btn-success btn-large">
    Example...
  </a>   
</div>

and the JS:

function test () {
  var test1 = document.getElementById("nameown").value;
  alert( 'test1' );
}

answered Sep 13, 2013 at 21:04

Vlad

9786 silver badges13 bronze badges

Comments

Marcus Jonsson · Accepted Answer · 2013-09-13 21:11:18Z

0

You should also change your javascript to the following to alert the value of the element with id nameown:

    <script>
      function test() {
        var test1 = document.getElementById("nameown").value;
        alert( test1 );
      }
    </script>

that is, change javascript.alert( 'test1' ) to alert( test1)

answered Sep 13, 2013 at 21:11

Marcus Jonsson

513 bronze badges

Comments

Vipin Malik · Accepted Answer · 2013-09-13 21:15:38Z

0

1 ) Your html is incorrect :

instead of

<onclick="test()" class="btn btn-success btn-large">

use

<button onclick="test()" class="btn btn-success btn-large">

2) Use alert() instead of javascript.alert().

3) Add an element with id as "nameown".

In addition Use browser developer tool to know more about javascript errors in console or use Firebug For firefox http://getfirebug.com/

edited Sep 13, 2013 at 21:15

answered Sep 13, 2013 at 21:10

Vipin Malik

1595 bronze badges

Collectives™ on Stack Overflow

onClick element not working

6 Answers 6

2 Comments

3 Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

2 Comments

3 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related