SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru glenngould's Avatar
    Join Date
    Nov 2005
    Posts
    661
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need No Button But Still to Submit?

    Hi, I made a simple chat app. with ajax and I used a <form> element to submit a message. I have an alternative link (<a>) in the layout to send a message and I want to remove the button (<input type="submit">), but the return/enter key must still be available to submit a message. So:

    -If I just omit the button, the form is not submitted, when I hit return/enter.

    -If I hide the button with:
    HTML Code:
    <input type="submit" style="display:none">
    IE7 do not submit, when I hit return/enter.

    -If I virtually hide the button with:
    HTML Code:
    <input type="submit" style="width:0px;height:0px;">
    Firefox shows a very small button icon.

    -If I paint the button in white with:
    HTML Code:
    <input type="submit" style="border:0px;background-color:#fff;color:#fff;">
    it works ok but I'm not happy with this solution.

    What is the proper method to remove (or hide if you have to place a <input type="submit"> in the form) a submit button but still have the ability to submit a form by hitting return/enter?

  2. #2
    SitePoint Mentor bronze trophy
    John_Betong's Avatar
    Join Date
    Aug 2005
    Location
    City of Angels
    Posts
    1,833
    Mentioned
    73 Post(s)
    Tagged
    6 Thread(s)
    I have just tested your input statement in IE7 and it works fine without a submit button.

    I also tried using two separate input fields but was not able to submit the form.

    Is it possible to only have a single input in your code?

    I have already done this and if you do not believe me you can Ask Eliza
    Learn how to be ready for The New Move to Discourse

    How to make Make Money Now with a *NEW* look

    Be sure to congratulate Patche on earning Member of the Month for July 2014

  3. #3
    SitePoint Guru glenngould's Avatar
    Join Date
    Nov 2005
    Posts
    661
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes it submits with a single <input type="text"> but not with multiple ones.

    I do not want to limit myself with a single input element, so I'll keep using my 3rd method above.

    Any other thoughts?

  4. #4
    SitePoint Member
    Join Date
    Jul 2008
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry to drag up an old thread, but I just had this issue myself and found that the best solution was to just position the 'trigger' button off-screen:

    Code CSS:
    input.hidden{
    	position: absolute;
    	left: -10000px;
    	top: -1000px;
    }

    HTML Code:
    <input class="hidden" type="submit" />


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •