943,693 Members | Top Members by Rank

Web Development > Web Design > HTML and CSS > how to receive data from html form...?
Ad:
Permalink
Jun 29th, 2009
0

how to receive data from html form...?

Expand Post »
well i have been doing quite lot a research on web stuff (still naive)
i have got various templates for my site and then finally a seminar form which i have downloaded from http://www.wufoo.com
now i want to accept the data entered from the form and store it in my database. i have no idea on how to proceed on that.
i would be glad if you guys can help me out.
Similar Threads
Reputation Points: 92
Solved Threads: 20
Posting Whiz
rahul8590 is offline Offline
351 posts
since Mar 2009
Permalink
Jun 29th, 2009
0

Re: how to receive data from html form...?

Click to Expand / Collapse  Quote originally posted by rahul8590 ...
well i have been doing quite lot a research on web stuff (still naive)
i have got various templates for my site and then finally a seminar form which i have downloaded from http://www.wufoo.com
now i want to accept the data entered from the form and store it in my database. i have no idea on how to proceed on that.
i would be glad if you guys can help me out.

You are going to have to establish a connection from your MySQL database to your HTML form using a scripting language. Personally i recommend PHP but you can use ASP, ASP.Net...whatever is easiest for you.

If you choose PHP you create a connection string like this:
$dbc = mysqli_connect('IP address of location of MySQL database', 'Usernam', 'Password', 'Database Name')
				or die('Error connecting to MySQL server.');

Once you have that written you need to write a query string that inserts data into the database such as this:
$query = "INSERT INTO email_list (first_name, last_name, email)  VALUES ('$first_name', '$last_name', '$email')";

Hope this helps
Reputation Points: 12
Solved Threads: 2
Light Poster
Plyswthsqurles is offline Offline
30 posts
since Apr 2009
Permalink
Jun 30th, 2009
0

Re: how to receive data from html form...?

well i am supposed to write this in the script file of the form which i got ..? if yes then where am i supposed to write ( i guess it follows some structure or pattern of witting ) .
Reputation Points: 92
Solved Threads: 20
Posting Whiz
rahul8590 is offline Offline
351 posts
since Mar 2009
Permalink
Jun 30th, 2009
0

Re: how to receive data from html form...?

Click to Expand / Collapse  Quote originally posted by rahul8590 ...
well i am supposed to write this in the script file of the form which i got ..? if yes then where am i supposed to write ( i guess it follows some structure or pattern of witting ) .
With PHP you can write the PHP in an HTML file by using <?php ?>
tags.

so you would have in your index.html or whatever file

HTML and CSS Syntax (Toggle Plain Text)
  1. <html>
  2. <body>
  3.      <?php
  4.         ?>
  5.  
  6.        <form>
  7.          </form>
  8. </body>
  9. </html>


This would be a lot easier if you would post your code
Reputation Points: 12
Solved Threads: 2
Light Poster
Plyswthsqurles is offline Offline
30 posts
since Apr 2009
Permalink
Jul 2nd, 2009
0

Re: how to receive data from html form...?

Another thing that you can do is just do a simple form email system.
Or just host the page.
For a form though, you can POST or GET data. POSTing data sends it through the connection, and GETting data sends it through the url.
POSTs are much better for larger amounts of data.
Forms typically use the name attribute to send data to the server with the name attribute for that element.
Take note that the database accessed by PHP is on the server, not your computer, so you'll need to view it on the server somehow. (using your PHP program or a prebuilt one like phpmyadmin)
Remember to validate and filter your input so the database (or your webserver), isn't hacked.
Reputation Points: 18
Solved Threads: 21
Junior Poster
codejoust is offline Offline
180 posts
since Jul 2009
Permalink
Jul 2nd, 2009
0

Re: how to receive data from html form...?

well here is the code

HTML and CSS Syntax (Toggle Plain Text)
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6.  
  7. <title>
  8. Seminar Form
  9. </title>
  10.  
  11. <!-- Meta Tags -->
  12. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  13.  
  14. <!-- CSS -->
  15. <link rel="stylesheet" href="css/structure.css" type="text/css" />
  16. <link rel="stylesheet" href="css/form.css" type="text/css" />
  17.  
  18. <!-- JavaScript -->
  19. <script type="text/javascript" src="scripts/wufoo.js"></script>
  20. </head>
  21.  
  22. <body id="public">
  23.  
  24. <img id="top" src="images/top.png" alt="" />
  25. <div id="container">
  26.  
  27. <h1 id="logo"><a>Wufoo</a></h1>
  28.  
  29. <form id="form71" name="form71" class="wufoo topLabel" autocomplete="off"
  30. 	enctype="multipart/form-data" method="post" action="#public">
  31.  
  32. <div class="info">
  33. 	<h2>Seminar Form</h2>
  34. 	<div>Please fill in the details for registration</div>
  35. </div>
  36.  
  37. <ul>
  38.  
  39.  
  40. <li id="foli0" 		class="   ">
  41. 	<label class="desc" id="title0" for="Field0">
  42. 		Name
  43. 			</label>
  44. 	<span>
  45. 		<input id="Field0" 			name="Field0" 			type="text" 			class="field text" 			value="" 			size="8" 			tabindex="1" 			/>
  46. 		<label for="Field0">First</label>
  47. 	</span>
  48. 	<span>
  49. 		<input id="Field1" 			name="Field1" 			type="text" 			class="field text" 			value="" 			size="14" 			tabindex="2" 			/>
  50. 		<label for="Field1">Last</label>
  51. 	</span>
  52. 	</li>
  53.  
  54.  
  55. <li id="foli2" 		class="   ">
  56. 	<label class="desc" id="title2" for="Field2">
  57. 		Position
  58. 			</label>
  59. 	<div>
  60. 		<input id="Field2" 			name="Field2" 			type="text" 			class="field text medium" 			value="" 			maxlength="255" 			tabindex="3" 						/>
  61. 			</div>
  62. 	</li>
  63.  
  64.  
  65. <li id="foli3" 		class="   ">
  66. 	<label class="desc" id="title3" for="Field3">
  67. 		Home Institution
  68. 			</label>
  69. 	<div>
  70. 		<input id="Field3" 			name="Field3" 			type="text" 			class="field text medium" 			value="" 			maxlength="255" 			tabindex="4" 						/>
  71. 			</div>
  72. 	</li>
  73.  
  74.  
  75. <li id="foli4" 		class="   ">
  76. 	<label class="desc" id="title4" for="Field4">
  77. 		Email
  78. 			</label>
  79. 	<div>
  80. 		<input id="Field4" 			name="Field4" 			type="text" 			class="field text medium" 			value="" 			maxlength="255" 			tabindex="5" 			/> 
  81. 	</div>
  82. 	</li>
  83.  
  84.  
  85. <li id="foli5" 		class="   ">
  86. 	<label class="desc" id="title5" for="Field5">
  87. 		Phone
  88. 			</label>
  89. 	<span>
  90. 		<input id="Field5" 			name="Field5" 			type="text" 			class="field text" 			value="" 			size="3" 			maxlength="3" 			tabindex="6" 			/> - 
  91. 		<label for="Field5">(###)</label>
  92. 	</span>
  93. 	<span>
  94. 		<input id="Field5-1" 			name="Field5-1" 			type="text" 			class="field text" 			value="" 			size="8" 			maxlength="8" 			tabindex="7" 			/> - 
  95. 		<label for="Field5-1">###</label>
  96. 	</span>
  97.  
  98. 	</li>
  99.  
  100.  
  101. <li id="foli10" 		class="   ">
  102. 	<label class="desc" id="title10" for="Field10">
  103. 		Format of Presentation
  104. 			</label>
  105. 	<div class="column">
  106. 	<input id="radioDefault_10" name="Field10" type="hidden" value="" />
  107. 		<input id="Field10_0" 		name="Field10" 		type="radio" 		class="field radio" 		value="Lecture" 		tabindex="9" 				 checked="checked" 						/>
  108. 	<label class="choice" for="Field10_0" 		>
  109. 		Lecture</label>
  110. 		<input id="Field10_1" 		name="Field10" 		type="radio" 		class="field radio" 		value="Seminar" 		tabindex="10" 						/>
  111. 	<label class="choice" for="Field10_1" 		>
  112. 		Seminar</label>
  113. 		<input id="Field10_2" 		name="Field10" 		type="radio" 		class="field radio" 		value="Colloquium" 		tabindex="11" 						/>
  114. 	<label class="choice" for="Field10_2" 		>
  115. 		Colloquium</label>
  116. 		</div>
  117. 	</li>
  118.  
  119.  
  120. <li id="foli6" 		class="   ">
  121. 	<label class="desc" id="title6" for="Field6">
  122. 		Date of Your Seminar
  123. 			</label>
  124. 	<span>
  125. 		<input id="Field6-1" 			name="Field6-1" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="12" 			/> /
  126. 		<label for="Field6-1">DD</label>
  127. 	</span>
  128. 	<span>
  129. 		<input id="Field6-2" 			name="Field6-2" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="13" 			/> /
  130. 		<label for="Field6-2">MM</label>
  131. 	</span>
  132. 	<span>
  133. 	 	<input id="Field6" 			name="Field6" 			type="text" 			class="field text" 			value="" 			size="4" 			maxlength="4" 			tabindex="14" 			/>
  134. 		<label for="Field6">YYYY</label>
  135. 	</span>
  136. 	<span id="cal6">
  137. 		<img id="pick6" class="datepicker" src="images/calendar.png" alt="Pick a date." />
  138. 	</span>
  139. 		<script type="text/javascript">
  140. 	Calendar.setup({
  141. 	inputField	 : "Field6",
  142. 	displayArea  : "cal6",
  143. 	button		 : "pick6",
  144. 	ifFormat	 : "%B %e, %Y",
  145. 	onSelect	 : selectDate
  146. 	});
  147. 	</script>
  148. 	</li>
  149.  
  150.  
  151. <li id="foli7" 		class="   ">
  152. 	<label class="desc" id="title7" for="Field7">
  153. 		Arrival Date
  154. 			</label>
  155. 	<span>
  156. 		<input id="Field7-1" 			name="Field7-1" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="15" 			/> /
  157. 		<label for="Field7-1">DD</label>
  158. 	</span>
  159. 	<span>
  160. 		<input id="Field7-2" 			name="Field7-2" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="16" 			/> /
  161. 		<label for="Field7-2">MM</label>
  162. 	</span>
  163. 	<span>
  164. 	 	<input id="Field7" 			name="Field7" 			type="text" 			class="field text" 			value="" 			size="4" 			maxlength="4" 			tabindex="17" 			/>
  165. 		<label for="Field7">YYYY</label>
  166. 	</span>
  167. 	<span id="cal7">
  168. 		<img id="pick7" class="datepicker" src="images/calendar.png" alt="Pick a date." />
  169. 	</span>
  170. 		<script type="text/javascript">
  171. 	Calendar.setup({
  172. 	inputField	 : "Field7",
  173. 	displayArea  : "cal7",
  174. 	button		 : "pick7",
  175. 	ifFormat	 : "%B %e, %Y",
  176. 	onSelect	 : selectDate
  177. 	});
  178. 	</script>
  179. 	</li>
  180.  
  181.  
  182. <li id="foli8" 		class="   ">
  183. 	<label class="desc" id="title8" for="Field8">
  184. 		Departure Date
  185. 			</label>
  186. 	<span>
  187. 		<input id="Field8-1" 			name="Field8-1" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="18" 			/> /
  188. 		<label for="Field8-1">DD</label>
  189. 	</span>
  190. 	<span>
  191. 		<input id="Field8-2" 			name="Field8-2" 			type="text" 			class="field text" 			value="" 			size="2" 			maxlength="2" 			tabindex="19" 			/> /
  192. 		<label for="Field8-2">MM</label>
  193. 	</span>
  194. 	<span>
  195. 	 	<input id="Field8" 			name="Field8" 			type="text" 			class="field text" 			value="" 			size="4" 			maxlength="4" 			tabindex="20" 			/>
  196. 		<label for="Field8">YYYY</label>
  197. 	</span>
  198. 	<span id="cal8">
  199. 		<img id="pick8" class="datepicker" src="images/calendar.png" alt="Pick a date." />
  200. 	</span>
  201. 		<script type="text/javascript">
  202. 	Calendar.setup({
  203. 	inputField	 : "Field8",
  204. 	displayArea  : "cal8",
  205. 	button		 : "pick8",
  206. 	ifFormat	 : "%B %e, %Y",
  207. 	onSelect	 : selectDate
  208. 	});
  209. 	</script>
  210. 	</li>
  211.  
  212.  
  213. <li id="foli9" 		class="   ">
  214. 	<label class="desc" id="title9" for="Field9">
  215. 		Enter the Demand Draft (DD) No.
  216. 			</label>
  217. 	<div>
  218. 		<input id="Field9" 			name="Field9" 			type="text" 			class="field text medium" 			value="" 			maxlength="255" 			tabindex="21" 						/>
  219. 			</div>
  220. 	</li>
  221.  
  222.  
  223.  
  224. 	<li class="buttons">
  225. 				<input id="saveForm" class="btTxt" type="submit" value="Submit" />
  226. 			</li>
  227.  
  228. 	<li style="display:none">
  229. 		<label for="comment">Do Not Fill This Out</label>
  230. 		<textarea name="comment" id="comment" rows="1" cols="1"></textarea>
  231. 	</li>
  232. </ul>
  233. </form>
  234.  
  235. </div><!--container-->
  236. <img id="bottom" src="images/bottom.png" alt="" />
  237.  
  238. </body>
  239. </html>


well the code is not written by me , as i have said it before i have taken it from the website wufoo.com so it also contains css and other image stuffs.(i guess that doesnt matter )


>-codejoust :
well the website i have to develop , will have to cater both displaying the database (for members for which i have created a login page ) and
accept the data to store it in mysql .
Reputation Points: 92
Solved Threads: 20
Posting Whiz
rahul8590 is offline Offline
351 posts
since Mar 2009

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: adding mutliple images to an CSS background
Next Thread in HTML and CSS Forum Timeline: Security issues around publishing email addresses on webpages





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC