Combining two OnClick Events

Discussion in 'Javascript' started by EviL KerneL, Feb 13, 2004.

  1. EviL KerneL

    EviL KerneL Guest

    Hi -

    I am working on a survey project which has a next button that takes
    you to the next set of questions and so on. It does this by means of
    an OnClick event which takes the answers from the questions and adds
    them to a database while taking you to the next page. I have a second
    onclick event I would like to combine with the above which changes the
    value of the button to "please wait" (to prevent the user from click
    on the buton more than once). When I try these events individualy they
    work just fine, but for the life of me I cannot figure out how to
    combine them.

    *Here is the 1st click event:
    --------------------------------------------------------------------
    <input class="submit-button" type="submit" name="next" value="Next"

    onclick="document.PdcSurvey.PdcButtonPressed.value='next';" />
    --------------------------------------------------------------------

    *Here is the 2nd onclick event:
    --------------------------------------------------------------------
    onClick='PdcSurvey.next.value="Please Wait...";return true'>
    --------------------------------------------------------------------

    I have tried adding a semicolon to divide them both but that does not
    seem to work. Here is what I did:

    <input class="submit-button" type="submit" name="next" value="Next"

    onclick="document.PdcSurvey.PdcButtonPressed.value='next';" /;
    'PdcSurvey.next.value="Please Wait...";return true'>

    I have tried several ways to do this but I cannot seem to get them to
    work together. Can anyone shed some light?

    Thanks!
     
    EviL KerneL, Feb 13, 2004
    #1
    1. Advertising

  2. On 13 Feb 2004 06:23:37 -0800, EviL KerneL <> wrote:

    [snip]

    > I have tried adding a semicolon to divide them both but that does not
    > seem to work. Here is what I did:
    >
    > <input class="submit-button" type="submit" name="next" value="Next"
    >
    > onclick="document.PdcSurvey.PdcButtonPressed.value='next';" /;
    > 'PdcSurvey.next.value="Please Wait...";return true'>


    1) The whole event string needs to be in a single set of double quotes.
    You have split them.
    2) The string must be on one line, just like any other HTML attribute
    value. New lines can only appear between attribute/value pairs.

    > I have tried several ways to do this but I cannot seem to get them to
    > work together. Can anyone shed some light?


    <input class="submit-button" type="submit" name="next" value="Next"
    onclick="this.form.PdcButtonPressed.value='next';
    this.value='Please wait...';">

    The last line should not be wrapped, but line length limits forced me to
    do it.

    You should notice that I shortened the string slightly using the "this"
    operator. In an intrinsic event, "this" refers to the current element; in
    this case, the submit button "next". This allows you to change the value
    of the button simply using "this.value='...'". Furthermore, all form
    controls have the property, "form", which refers to the containing form
    element. Instead of "document.PdcSurvey", you can use "this.form".
    Finally, I removed the return statement: unless you are returning false,
    it is not required.

    Hope that helps,
    Mike

    --
    Michael Winter
    d (replace ".invalid" with ".uk" to reply)
     
    Michael Winter, Feb 13, 2004
    #2
    1. Advertising

  3. EviL KerneL

    EviL KerneL Guest

    Michael Winter <> wrote in message news:<>...
    > On 13 Feb 2004 06:23:37 -0800, EviL KerneL <> wrote:
    >
    > [snip]
    >
    > > I have tried adding a semicolon to divide them both but that does not
    > > seem to work. Here is what I did:
    > >
    > > <input class="submit-button" type="submit" name="next" value="Next"
    > >
    > > onclick="document.PdcSurvey.PdcButtonPressed.value='next';" /;
    > > 'PdcSurvey.next.value="Please Wait...";return true'>

    >
    > 1) The whole event string needs to be in a single set of double quotes.
    > You have split them.
    > 2) The string must be on one line, just like any other HTML attribute
    > value. New lines can only appear between attribute/value pairs.
    >
    > > I have tried several ways to do this but I cannot seem to get them to
    > > work together. Can anyone shed some light?

    >
    > <input class="submit-button" type="submit" name="next" value="Next"
    > onclick="this.form.PdcButtonPressed.value='next';
    > this.value='Please wait...';">
    >
    > The last line should not be wrapped, but line length limits forced me to
    > do it.
    >
    > You should notice that I shortened the string slightly using the "this"
    > operator. In an intrinsic event, "this" refers to the current element; in
    > this case, the submit button "next". This allows you to change the value
    > of the button simply using "this.value='...'". Furthermore, all form
    > controls have the property, "form", which refers to the containing form
    > element. Instead of "document.PdcSurvey", you can use "this.form".
    > Finally, I removed the return statement: unless you are returning false,
    > it is not required.
    >
    > Hope that helps,
    > Mike



    It sure did! A million thanks man. One question though, what did the
    "/" do for the previous line? It seems to be working fine without it
    so I am wondering.

    In any case, thanks again for your help!
     
    EviL KerneL, Feb 19, 2004
    #3
  4. On 19 Feb 2004 05:39:23 -0800, EviL KerneL <> wrote:

    [snip]

    > It sure did! A million thanks man.


    You're welcome.

    > One question though, what did the "/" do for the previous line? It
    > seems to be working fine without it so I am wondering.


    I assume you mean the slash at the end of the first line below?

    onclick="document.PdcSurvey.PdcButtonPressed.value='next';" /;
    'PdcSurvey.next.value="Please Wait...";return true'>

    It does nothing. The onclick attribute value ends at the second double
    quote (next';"). The browser will then attempt to find another
    attribute/value pair. The rest of the tag, from "/;" onwards, is invalid
    HTML so the browser should just ignore it.

    Mike

    --
    Michael Winter
    d (replace ".invalid" with ".uk" to reply)
     
    Michael Winter, Feb 19, 2004
    #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. williams
    Replies:
    1
    Views:
    915
  2. Winterminute

    Combining Two Data Sources for one Data List

    Winterminute, Dec 3, 2003, in forum: ASP .Net
    Replies:
    0
    Views:
    852
    Winterminute
    Dec 3, 2003
  3. chris

    combining two documents

    chris, Jul 31, 2003, in forum: XML
    Replies:
    2
    Views:
    460
    Dimitre Novatchev
    Jul 31, 2003
  4. Chuck
    Replies:
    0
    Views:
    387
    Chuck
    Aug 28, 2003
  5. Chris

    Events Events Events Please Help

    Chris, Aug 30, 2005, in forum: ASP .Net Web Controls
    Replies:
    0
    Views:
    388
    Chris
    Aug 30, 2005
Loading...

Share This Page