SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Oct 2003
    Location
    somewhere over the rainbow
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation css based form does not work with <textarea name=”…….”….>

    I΄ve read the tutorial written by Cameron Adams (posted @ http://www.sitepoint.com/article/fancy-form-design-css/) in order to attempt to adapt what I΄ve learned from it to a form on which there is the element <textarea name=”…….”….>.

    C.Adam΄s form , which does not include any textarea element , works perfectly. However as I include a textarea the form turns to a mess : the submission and clear buttons are not shown , the message field where the message is supposed to be typed exhibits a </li> ; it happens with IE7 , Firefox but not with Opera that seems normal despite the fact that the clear button is shown exactly like a text field (? …. I am missing the tables time); the text into the <legend> appears above the encircling line ;
    I΄ve pasted below the codes for anyone who would like to take a look and tell me how to mend this trouble;

    Thank you very much.

    css :
    fieldset {
    margin: 1.5em 0 0 0;
    padding: 0;
    }
    legend {
    margin-left: 1em;
    color: #000000;
    font-weight: bold;
    }
    fieldset ol {
    padding: 1em 1em 0 1em;
    list-style: none;
    }
    fieldset li {
    padding-bottom: 1em;
    }
    fieldset.submit {
    border-style: none;
    }

    html form code
    <form method="POST" action="../php/mailer.php">
    <legend>Informaηυes</legend>
    <fieldset>
    <ol>
    <li>
    <label for="empresa">Empresa /label>
    <input type="text" name="empresa" id="empresa" class="text"/>
    </li>
    <li>
    <label for="estado">Estado /label>
    <select name="estado" id="estado" class="text"/>
    <option value="value">( Selecione )</option>
    <option selected>x</option>
    <option>y</option>
    </select>
    </li>
    <li>
    <label for="segmento_de_mercado">Segmento /label>
    <select name="segmento_de_mercado" id="segmento_de_mercado" class="text">
    <option selected>(selecione)</option>
    <option>z</option>
    <option>n</option>
    <option>outro</option>
    </select>
    </li>
    <li>
    <label for="nome_do_visitante">Nome :&nbsp;&nbsp;&nbsp;</label>
    <input type="text" name="nome_do_visitante" id="nome_do_visitante" class="text" >
    </li>
    <li>
    <label for="cargo">Cargo /label>
    <input type="text" name="cargo" id"cargo" class="text">
    </li>
    <label for="sistemagestao">Sistema de Gestγo /label>
    <input type="checkbox" name="check[]" value="sistemagestao" >
    </li>
    <li>
    <label for="softwaremanutindustrial">Sistema Manutenηγo Industrial /label>
    <input type="checkbox" name="check[]" value="softwaremanutindustrial" >
    </li>
    <li>}
    <label for="mensagem">Mensagem /label>
    <textarea name="mensagem" id="mensagem" class="text" > </li></ol> </fieldset>
    <fieldset class="submit>
    <input class="submit" type="Submit" value="Enviar"/></fieldset>
    </form> <fieldset class="reset">
    <input class="reset" type="Submit2" value="Limpar"/>
    </fieldset>

  2. #2
    Follow Me On Twitter: @djg gold trophysilver trophybronze trophy Dan Grossman's Avatar
    Join Date
    Aug 2000
    Location
    Philadephia, PA
    Posts
    20,578
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    You're missing the </textarea>. All HTML tags must be closed (or self-closing />, but textarea isn't self-closing)

  3. #3
    SitePoint Enthusiast
    Join Date
    Oct 2003
    Location
    somewhere over the rainbow
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think I need some sleep ........css learning is driving me out of my head ;
    it worked fine , but the clear button is still missing ; i am not quite sure whether "clear " button is somewhat useful (?)
    Thank you very much for your help

  4. #4
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,287
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    </form> <fieldset class="reset">
    <input class="reset" type="Submit2" value="Limpar"/>
    </fieldset>
    How could the reset (clear) button appear in the form when you've got it outside the form? See, you closed the form and THEN added an extra fieldset (outside the form!) with the input.


    I can't belive Sitepoint is encouraging people to write forms as lists. Bah. Might as well write them in tables then too. What's the difference?

    i am not quite sure whether "clear " button is somewhat useful (?)
    Depends on your form, but I totally think they can be useful:

    Why a Reset button on forms?

    * To undo all those "helpful" preselects of the most popular options
    * To get another quote for a completely different vehicle
    * To sign your friends up for the same service
    * To make sure that error wasn't from something accidentally selected

    Try getting an car insurance quote at ditzo.nl and then with another car. You can't. You're stuck with the original settings. Nasty.
    Although another way around it is to have the back end, which is running that script you're calling in the action="blah.php", clear that form when it refreshes the page. That way, people can re-fill in the form with new values, and the reset button isn't needed.

    What you DON'T want is a reset that looks like or is placed where "Submit" normally sits. How many times have I filled in a really long form, then hit the first button that looks like a submit, only to find that I've lost everything I filled in? Lawlz.

  5. #5
    SitePoint Enthusiast
    Join Date
    Oct 2003
    Location
    somewhere over the rainbow
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    What you DON'T want is a reset that looks like or is placed where "Submit" normally sits. How many times have I filled in a really long form, then hit the first button that looks like a submit, only to find that I've lost everything I filled in? Lawlz.
    Much to my chagrin it has happened many times with me ;
    thank you for posting an answer


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
  •