Newbie question and problem

Discussion in 'Javascript' started by Bruce W.1, Jan 21, 2005.

  1. Bruce W.1

    Bruce W.1 Guest

    This is my first javascript effort and it's not going well so far.
    Guess it's not so easy after all.

    I want a text box to be populated with some text when I push a button.
    Simple yes? It just isn't working for me though. I'm testing in
    Dreamweaver's preview IE browser window.

    The code is below. Can anyone tell me what's wrong? Thanks for your help.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    </head>
    <script type="text/javascript">
    function fill(form) {
    form.SubmitButton.value = "hello world";
    }
    </script>
    <body>
    <form name="form1" method="post" action="">
    <p>
    <input type="text" name="textfield">
    </p>
    <p>
    <input type="submit" name="SubmitButton" value="Submit"
    onClick="fill(this.form1)">
    </p>
    <p>&nbsp;</p>
    </form>
    </body>
    </html>
     
    Bruce W.1, Jan 21, 2005
    #1
    1. Advertising

  2. Bruce W.1

    McKirahan Guest

    "Bruce W.1" <> wrote in message
    news:Md8Id.17672$...
    > This is my first javascript effort and it's not going well so far.
    > Guess it's not so easy after all.
    >
    > I want a text box to be populated with some text when I push a button.
    > Simple yes? It just isn't working for me though. I'm testing in
    > Dreamweaver's preview IE browser window.
    >
    > The code is below. Can anyone tell me what's wrong? Thanks for your

    help.
    >
    > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    > "http://www.w3.org/TR/html4/loose.dtd">
    > <html>
    > <head>
    > <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    > <title>Untitled Document</title>
    > </head>
    > <script type="text/javascript">
    > function fill(form) {
    > form.SubmitButton.value = "hello world";
    > }
    > </script>
    > <body>
    > <form name="form1" method="post" action="">
    > <p>
    > <input type="text" name="textfield">
    > </p>
    > <p>
    > <input type="submit" name="SubmitButton" value="Submit"
    > onClick="fill(this.form1)">
    > </p>
    > <p>&nbsp;</p>
    > </form>
    > </body>
    > </html>


    You assigned the value to the button not to "textfield".

    I stripped it down some; try this:

    <html>
    <head>
    <title>noobie.htm</title>
    </head>
    <script type="text/javascript">
    function fill() {
    document.form1.textfield.value = "hello world";
    }
    </script>
    <body>
    <form action="" method="post" name="form1">
    <input type="text" name="textfield">
    <input type="button" value="Submit" onClick="fill()">
    </form>
    </body>
    </html>
     
    McKirahan, Jan 21, 2005
    #2
    1. Advertising

  3. Bruce W.1 wrote:

    > function fill(form) {
    > form.SubmitButton.value = "hello world";
    > }
    > [...]
    > <input type="submit" name="SubmitButton" value="Submit"
    > onClick="fill(this.form1)">


    "this" in your event handler code references the button
    input element, which has a property "form" to reference
    the associated form element, but no property "form1",
    which is just the form's name attribute's value.

    Use ...

    function fill(form) {
    form.elements["SubmitButton"].value = "hello world";
    }
    [...]
    <input type="submit" name="SubmitButton" value="Submit"
    onClick="fill(this.form)">

    .... or ...

    function fill(button) {
    button.value = "hello world";
    }
    [...]
    <input type="submit" name="SubmitButton" value="Submit"
    onClick="fill(this)">

    .... or ...

    <input type="submit" name="SubmitButton" value="Submit"
    onClick="this.value='hello world'">

    ciao, dhgm
     
    Dietmar Meier, Jan 21, 2005
    #3
  4. Bruce W.1

    Bruce W.1 Guest

    Dietmar Meier wrote:

    > "this" in your event handler code references the button
    > input element, which has a property "form" to reference
    > the associated form element, but no property "form1",
    > which is just the form's name attribute's value.
    >
    > Use ...
    >
    > function fill(form) {
    > form.elements["SubmitButton"].value = "hello world";
    > }
    > [...]
    > <input type="submit" name="SubmitButton" value="Submit"
    > onClick="fill(this.form)">
    >
    > ... or ...
    >
    > function fill(button) {
    > button.value = "hello world";
    > }
    > [...]
    > <input type="submit" name="SubmitButton" value="Submit"
    > onClick="fill(this)">
    >
    > ... or ...
    >
    > <input type="submit" name="SubmitButton" value="Submit"
    > onClick="this.value='hello world'">
    >
    > ciao, dhgm

    =================================================

    Aha! It was my incorrect usage of 'this' that messed me up. I thought
    'this' referred to the form and not the button. Thanks.
     
    Bruce W.1, Jan 21, 2005
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Jerry C.
    Replies:
    8
    Views:
    244
    Uri Guttman
    Nov 23, 2003
  2. Kruno Saho
    Replies:
    0
    Views:
    143
    Kruno Saho
    Apr 7, 2013
  3. Dave Angel
    Replies:
    0
    Views:
    125
    Dave Angel
    Apr 7, 2013
  4. rusi
    Replies:
    0
    Views:
    112
  5. Miki Tebeka
    Replies:
    0
    Views:
    84
    Miki Tebeka
    Apr 7, 2013
Loading...

Share This Page