Invisible Submit buttons

Discussion in 'Javascript' started by Tony R, Nov 18, 2005.

  1. Tony  R

    Tony R Guest

    I need to make a submit button turn invisible when a checkbox is not
    clicked, and visible when it is clicked....I can't figure out a
    cross-browser way of doing this.

    Can anyone help?
     
    Tony R, Nov 18, 2005
    #1
    1. Advertising

  2. Tony  R

    Evertjan. Guest

    Tony R wrote on 18 nov 2005 in comp.lang.javascript:

    > I need to make a submit button turn invisible when a checkbox is not
    > clicked, and visible when it is clicked....I can't figure out a
    > cross-browser way of doing this.
    >


    obj.style.visibility='hidden'

    --
    Evertjan.
    The Netherlands.
    (Replace all crosses with dots in my emailaddress)
     
    Evertjan., Nov 18, 2005
    #2
    1. Advertising

  3. Tony  R

    Tony Guest

    >> I need to make a submit button turn invisible when a checkbox is not
    >> clicked, and visible when it is clicked....I can't figure out a
    >> cross-browser way of doing this.

    >
    >obj.style.visibility='hidden'


    alternately, obj.style.display = 'none'

    visibility:hidden keeps the place on the page where the invisible item
    should be - you just don't see the item. display:none eliminates the
    space too.

    Which to use depends on the specific display results desired.
     
    Tony, Nov 18, 2005
    #3
  4. Tony  R

    Tony R Guest

    I'm sorry that this reply is extremely n00bish, because I really should
    know this stuff, but I haven't done JScript in so long that I've
    forgotten a lot of the basics....

    How do I define obj as my submit box?
     
    Tony R, Nov 19, 2005
    #4
  5. Tony  R

    RobG Guest

    Tony R wrote:
    > I'm sorry that this reply is extremely n00bish, because I really should
    > know this stuff, but I haven't done JScript in so long that I've
    > forgotten a lot of the basics....
    >
    > How do I define obj as my submit box?
    >


    Rather than hiding/showing the submit button, you are better to
    disable/enable it. You also need script to disable it in the first
    place and also to make sure its state reflects that of the checkbox if
    the form is reset. Below is a bit of play code to get you started.

    Note that if you check the checkbox the button is enabled, if you
    re-load the page most browsers will keep the checkbox checked but the
    submit button is disabled. Similarly, resetting the form will make the
    checkbox unchecked but not disable the button again (hiding/showing has
    exactly the same issues).


    <form action="">
    <input type="checkbox" onclick="
    this.form.theSubmit.disabled = !(this.checked);
    ">Check me to enable the submit button<br>
    <input type="submit" name="theSubmit" disabled>
    </form>


    PS. Don't give the submit button a name or ID of 'submit'.


    --
    Rob
     
    RobG, Nov 19, 2005
    #5
  6. Tony  R

    Evertjan. Guest

    RobG wrote on 19 nov 2005 in comp.lang.javascript:

    > <form action="">
    > <input type="checkbox" onclick="
    > this.form.theSubmit.disabled = !(this.checked);
    > ">Check me to enable the submit button<br>
    > <input type="submit" name="theSubmit" disabled>
    > </form>


    Try this, text input is allowed,
    but submitting by pressing <return> is prevented,
    till the box is checked:

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

    <form action="" onsubmit='return false'>

    <input type="checkbox"

    onclick="
    this.form.theSubmit.disabled = !this.checked;
    this.form.onsubmit = 'return ' + this.checked;">

    Check me to enable the submit button and &lt;return><br>

    <input name='theText'><br>
    <input type="submit" name="theSubmit"
    value="do submit" disabled>

    </form>

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

    btw, this.checked is as good as (this.checked)

    --
    Evertjan.
    The Netherlands.
    (Replace all crosses with dots in my emailaddress)
     
    Evertjan., Nov 19, 2005
    #6
  7. RobG wrote:

    > Tony R wrote:
    >> I'm sorry that this reply is extremely n00bish, because I really should
    >> know this stuff, but I haven't done JScript in so long that I've
    >> forgotten a lot of the basics....
    >>
    >> How do I define obj as my submit box?

    >
    > Rather than hiding/showing the submit button, you are better to
    > disable/enable it. You also need script to disable it in the first
    > place


    Yes, but you did not.

    > and also to make sure its state reflects that of the checkbox if
    > the form is reset. Below is a bit of play code to get you started.
    > [...]
    > <form action="">
    > <input type="checkbox" onclick="
    > this.form.theSubmit.disabled = !(this.checked);
    > ">Check me to enable the submit button<br>


    Parentheses are unnecessary and attribute values should not include
    newline. If this was merely to prevent automatic line-break, use

    <input type="checkbox"
    onclick="this.form.theSubmit.disabled = !this.checked;"
    id="cbSubmit"
    ><label for="cbSubmit"
    >Check me to enable the submit button</label><br>


    > <input type="submit" name="theSubmit" disabled>


    Don't. The form will not be usable without client-side script support.

    > </form>
    >
    >
    > PS. Don't give the submit button a name or ID of 'submit'.


    True.


    PointedEars
     
    Thomas 'PointedEars' Lahn, Nov 19, 2005
    #7
    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. Roger
    Replies:
    1
    Views:
    663
    GreggTB
    May 20, 2005
  2. =?Utf-8?B?QmVu?=

    Image Buttons/Buttons not responding

    =?Utf-8?B?QmVu?=, Jul 6, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    476
    Teemu Keiski
    Jul 6, 2005
  3. Replies:
    4
    Views:
    1,012
  4. Andy B
    Replies:
    5
    Views:
    629
    Andy B
    May 29, 2008
  5. itsastickup
    Replies:
    7
    Views:
    1,865
    Ari Heino
    Mar 22, 2009
Loading...

Share This Page