Creating a form with valid html code the quickest way

toolmania1 · 12-18-2010, 05:06 PM

Right now, I am creating a form from text that was given to me. I have to go in and enter the size, maxlength etc. My friend used Dreamweaver. A lot of extra code like labels and such were inserted which I removed. But, this is tedious. I also am running Ubuntu Linux. I no longer have Dreamweaver. But, I have Bluefish editor which is close to the same thing.

I am wondering what my quickest route to finishing this form is. I need to add tabindex, size, and maxlength to almost every entry. The form is 4 printed pages long. It won't take a long time. But, I am more concerned about the future. If we get another form to create, I don't want to take forever on that one.

What are the quickest ways to create forms that have valid html, tabindexes automatically filled in, size and length also automatically filled in?

Thanks in advance!

bcee · 12-18-2010, 07:36 PM

If you are using a table-based layout I would suggest switching to CSS. Labels can come in handy not sure why you removed them.

Here is a very simple example:

Code:

<form method="post" action="#" id="your-id" enctype="multipart/form-data">
	<label>Some Label</label>
	<input type="text" name="your-name" maxlength="100" tabindex="1" />
</form>

To edit the size use CSS:

Code:

input[type=text],
input[type=password],
select,
textarea {
your-rules: here;
}

This is also a decent read on valid, accessible forms:
http://www.webstandards.org/learn/tu.../intermediate/

SplitElement · 12-20-2010, 04:03 PM

You have to consider Wufoo for this one.

smoovo · 12-20-2010, 09:29 PM

Each time you build a from you are using different size, maxlength, etc... You should fill it manually. If it's the same form that you want to use, just do copy/paste to the code after first time modifying.

PixelPusher · 12-21-2010, 02:33 PM

Quote:

Originally Posted by bcee

If you are using a table-based layout I would suggest switching to CSS. Labels can come in handy not sure why you removed them.

Here is a very simple example:

Code:

<form method="post" action="#" id="your-id" enctype="multipart/form-data">
	<label>Some Label</label>
	<input type="text" name="your-name" maxlength="100" tabindex="1" />
</form>

To edit the size use CSS:

Code:

input[type=text],
input[type=password],
select,
textarea {
your-rules: here;
}

...

I agree with Brad, use CSS to style the form. Just a thought, you can add a class to your form and then just target each tag type (if you wanted to less specific...like so:

Code:

form.login input, form.login select, form.login textarea {
--css properties--
}

12-18-2010, 05:06 PM	#1
toolmania1 Bronze Member Join Date: Oct 2009 Posts: 45	Creating a form with valid html code the quickest way Right now, I am creating a form from text that was given to me. I have to go in and enter the size, maxlength etc. My friend used Dreamweaver. A lot of extra code like labels and such were inserted which I removed. But, this is tedious. I also am running Ubuntu Linux. I no longer have Dreamweaver. But, I have Bluefish editor which is close to the same thing. I am wondering what my quickest route to finishing this form is. I need to add tabindex, size, and maxlength to almost every entry. The form is 4 printed pages long. It won't take a long time. But, I am more concerned about the future. If we get another form to create, I don't want to take forever on that one. What are the quickest ways to create forms that have valid html, tabindexes automatically filled in, size and length also automatically filled in? Thanks in advance!

12-18-2010, 07:36 PM	#2
bcee Gold Member Join Date: Nov 2009 Location: New York Posts: 370	If you are using a table-based layout I would suggest switching to CSS. Labels can come in handy not sure why you removed them. Here is a very simple example: Code: <form method="post" action="#" id="your-id" enctype="multipart/form-data"> <label>Some Label</label> <input type="text" name="your-name" maxlength="100" tabindex="1" /> </form> To edit the size use CSS: Code: input[type=text], input[type=password], select, textarea { your-rules: here; } This is also a decent read on valid, accessible forms: http://www.webstandards.org/learn/tu.../intermediate/ __________________ Submit to my Website Gallery \| NY Web Design

12-20-2010, 04:03 PM	#3
SplitElement Bronze Member Join Date: Dec 2010 Posts: 44	You have to consider Wufoo for this one. __________________ Split Element Design Studio \| Expand your image.

12-20-2010, 09:29 PM	#4
smoovo Gold Member Join Date: Oct 2010 Posts: 388	Each time you build a from you are using different size, maxlength, etc... You should fill it manually. If it's the same form that you want to use, just do copy/paste to the code after first time modifying. __________________ SMooVo - Web Design & Development contact@smoovo.com www.SMooVo.com

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode