HTML - Submit Buttons In Table
Hi all!
I have a table created using php getting information from a MySQL database. No problems there. The problem is that I want to put a form submit button near each of the table rows. Now. the logical thing to do would be to add a column to the table and put a submit button in each row. The only problem is that I want there to be a border only around the original table and not over the submit buttons. How do I go about doing that? Thanks in advance, dirk_gently Similar TutorialsI'm looking for a way that I can allow users, that visit my website, to submit a graphic (.jpg,.gif,etc) either to my inbox or a specified folder on the server. Is this possible? I plan on using it under the "Your Screens" link. - http://www.v0dk4.com/main.shtml I have a JSP with HTML and Javascript in it. There're 2 image buttons and 1 Submit button, for some reason ALL buttons submit (when I click any of the image buttons, it works fine but submits too). I'm kinda new to HTML and JS so i need to know where did I go wrong Code: <form action="Req_Result" method="post" name="entry" onSubmit="return validate(this)"> <table border="0" cellpadding="10" cellspacing="10"> <tr> <td> <table> <tr> <td><INPUT TYPE="RADIO" NAME="searchBy" checked="checked" value="byname" onclick="sortby()"> By Name</td> </tr> <tr> <td><INPUT TYPE="RADIO" NAME="searchBy" value="byDate" onclick="sortby()"> By Date</td> </tr> <tr> <td><INPUT TYPE="RADIO" NAME="searchType" checked="checked" value="whole" onClick="chMd()"> By Department</td> </tr> <tr> <td><INPUT TYPE="RADIO" NAME="searchType" value="byid" onClick="chMd()"> By ID</td> <td><input name="ps" type="text" size="18" disabled="disabled"></td> </tr> <tr> <td>Start Date:</td> <td><input name="startdate" id="startdate" type="text" size="18" readonly> <input type="image" src="theme/panelCalendarIcon.gif" value="date1" onClick="SelectDate()" ></td> </tr> <tr> <td>End Date:</td> <td><input name="enddate" id="enddate" type="text" size="18" readonly> <input type="image" src="theme/panelCalendarIcon.gif" value="date2" onClick="SelectDate()" ></td> </tr> <tr> <td colspan="2" align="center"><input type="submit" value="Submit"></td> </tr> </table> </td> </tr> </table> </form> I am doing a online sign up page, and I am unsure on how to make a submit button send all selected boxes and inputted text to say my email address for this website. and how to get the reset button to reset anyone know how to do that? Hello, I am trying to create a form so that member can submit a file to our Yahoo! Group. However, I cannot get it to work. Perhaps that this is not even possible? I have an html file that can click on and after they have filled out the form, they would click "submit" and it would post that file into out Yahoo! Group file section. If this isn't possible, is there a way to have it bring up a page with all the information on it after they submitted it so they can just copy and paste? Thanks, DarkEdward I've got a quick question. I've got a page with about 6-8 forms on it. Several of the forms are nearly identical, as they accept an ID number, or a selection made from a pop-up option list. What I want to do is collapse the identical forms into a single data entry area and then have several different submit buttons which have different values, then use the value of the submit button to determine what action to perform for the form. My question is... is this a proper use of the type=submit input element, or am I better off keeping the forms separate. All the forms call the same PHP script (itself) to perform the action. I'll be trying it out, but I don't want to waste time redesigning the page if what I'm trying to do will not work. Thanks. basicly im building this website for a company and this is my last bump in the road, i have a form made up for people to fill out as an application but i dont know the code to put as a link on the submit button to send the information to an e-mail address, can anyone help? im supposed to have this done tomorrow, heres a pic to help explain <a href="http://photobucket.com" target="_blank"><img src="http://i10.photobucket.com/albums/a134/sirv101/help.jpg" border="0" alt="Photo Sharing and Video Hosting at Photobucket"></a> I would like to create 2 buttons for my form. The 1st button named "Submit Ads" would be a submit command and go to one page upon click. The second button named "Continue >>" would be a submit command and go to different page upon click. How can I do this? Your help would be greatly appreciated! hey so i have a template which is just a picture and I want the person to be able to click it (but they would in reality just be clicking the invisible button) while it's the background of my site. It allows the person to enter <form name="input" action="http://www.google.com" method="get"> <input type="submit" value="Enter"> </form> if I make the value nothing (or a space), it doesnt dissapear, it just shows a blank button I know this is probably a strange request but I'm trying to figure out how to use an area tag to define a form submit button (or the equivalent of that). Does anyone know if this can be done? Why is it that my button on IE looks like crap, with blurry corners and sadly rounded edges... http://unreal-deals.com/temp/ie-submitbutton.html But this guy's button in IE looks just perfect, with no blurry corners and sharp square edges? http://www.splittestaccelerator.com/1/?cnotes*18059868 I'm a relative novice to HTML and CSS trying to earn some extra cash doing freelance web designing. With the project I'm working on now, my client has pointed out that in IE 6 and 7, the Submit and Reset buttons of the Contact page are not working. The thing is, they actually are working, it's just that the rollover area for some reason has been reduced to just the bottom edge of the button. Here's the url I test off so you can see what I mean: http://www.animationpolitik.com/newDMsite/contact.html The buttons work just fine in Firefox and IE8. However if you go into either IE6 or 7 you'll notice that the interior yellow highlight of the Submit and Reset buttons only lights if you carefully roll over the bottom edges of the buttons. They'll work if you hit them at those exact locations, but if you mouse over the center of the buttons and click, nothing happens, which apparently is confusing a lot of my client's customers. It's strange because these are just the default buttons that are created when using the <form> tag; there's no styling on them whatsoever. The table I have them nested in reads like this: <form method="post" action="contact_retrieval.php" target="_top"> ... <table class="comments" border="0"> <tr> <td height="18" colspan="2">Additional comments/questions:<br /> <textarea rows="7" cols="55" wrap="physical" name="comments"> </textarea> </td> </tr> <tr> <td width="87" height="18"><input type="submit" value="Submit" name="submit"></td> <td width="393"><input type="reset" value="Reset" name="reset"></td> </tr> </table> </form> I've been searching the issue for the past several hours and have tried everything from moving the buttons outside the table to relocating them outside the <form></form> tags, but nothing woks. Any idea what could be causing this madness? Any help with this situation would be greatly appreciated! hello, i just started a redesign of my site. i was wondering if there was a way to make the buttons line up with a tables collapsed border. there always seems to be a space no matter what i do. any suggestions? youll see what i mean...... http://mightycleancarpets.net/newdesign/index.htm Hello, I have a problem with tables cells containing form buttons: Code: <tr> <td colspan="2" align="center"> <button id="button-submit_2" type="submit">Add Name</button>      </form> <form action="nrt-home-edit&delete.php" method="post"> <input type="hidden" name="class_name" value="$class_name[0]"/> <button id="button-submit_2" type="submit">Finish</button></form> </td> </tr> The above code puts the two buttons on their own lines within the table cell. My question is, does anybody know how to keep them on the same line without putting them into their own individual cells? I am not actually sure what has not been scripted correctly, I did not make these pages, my friend did & we are no longer in contact. You will have to view the source code on the page to get a better idea of things & the code is pretty short, if anyone can offer ANY advice here I would be so greatful thanks a bunch... If you goto http://stoneramerica.fatcow.com/action-add.php there is a "add url" option ( this is the page that has something wrong, but im not sure where or what ) The page is suppose to take the data from the website submitted & post that data to the tables we have created on the page below... You can view these tables here http://stoneramerica.fatcow.com/swoop.php I'm just learning html and css so this might be something basic. But on my site i'm making i have a form inside a table and when you click submit the table resizes and dosen't submit. When you click submit on the resized table it submits. When you submit nothing changes that would make the table resize. I don't know what to do the link to the page is http://web.ics.purdue.edu/~mlchandl/brittany/index.php If anyone can help I would appreciate it. Thanks Matt I am making a simple calculator program for a school science fair project, and I used a CSS Button Maker program that I got fro ma google search, and when I try to change my buttons from the normal preset ones to the one I made, it disrupts the onClick, and makes he buttons not work. any idea on how to fix this? Here is before the change to the cool buttons: Code: <HTML> <HEAD> <TITLE>Gavin's Science Fair Project</TITLE> <script LANGUAGE="JavaScript"> function CalculateSum(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A + B; } function CalculateDif(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A - B; } function CalculatePro(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A * B; } function CalculateQuo(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A % B; } function ClearForm(form) { form.input_A.value = ""; form.input_B.value = ""; form.Answer.value = ""; } // end of JavaScript functions --> </SCRIPT> <style type="text/css"> input.groovybutton { font-size:15px; width: 250px; height: 25px; font-family:Comic Sans MS,sans-serif; font-weight:bold; color:#000000; background-color:#FF0066; border-style:outset; } </style> </HEAD> <DIV ALIGN=CENTER> <table border="10" bgcolor="#0C6AA1"> <tr> <td><P><FONT SIZE="+3">Simple Calculator</FONT></P> <FORM NAME="Calculator" METHOD="post"> <P>Enter a number: <INPUT TYPE=TEXT NAME="input_A" SIZE=15></P> <P>Enter a number: <INPUT TYPE=TEXT NAME="input_B" SIZE=14></P> <DIV ALIGN=CENTER><P><INPUT TYPE="button" VALUE="Add Numbers" name="AddButton" onClick="CalculateSum(this.form.input_A.value, this.form.input_B.value, this.form)"></P> <P><INPUT TYPE="button" VALUE="Subtract Numbers" name="SubButton" onClick="CalculateDif(this.form.input_A.value, this.form.input_B.value, this.form)"></P> <P><INPUT TYPE="button" VALUE="Multiply Numbers" name="MultButton" onClick="CalculatePro(this.form.input_A.value, this.form.input_B.value, this.form)"></P> <P><INPUT TYPE="button" VALUE="Divide Numbers" name="DivButton" onClick="CalculateQuo(this.form.input_A.value, this.form.input_B.value, this.form)"></P> <P><INPUT TYPE="button" VALUE="Clear Fields" name="ClearButton" onClick="ClearForm(this.form)"></P></DIV> <P>Answer = <INPUT TYPE=TEXT NAME="Answer" SIZE=18></P> </FORM></td> </DIV> </BODY> </HTML> And here is after: Code: <HTML> <HEAD> <TITLE>Gavin's Science Fair Project</TITLE> <script LANGUAGE="JavaScript"> function CalculateSum(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A + B; } function CalculateDif(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A - B; } function CalculatePro(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A * B; } function CalculateQuo(Atext, Btext, form) { var A = parseFloat(Atext); var B = parseFloat(Btext); form.Answer.value = A % B; } function ClearForm(form) { form.input_A.value = ""; form.input_B.value = ""; form.Answer.value = ""; } // end of JavaScript functions --> </SCRIPT> <style type="text/css"> input.groovybutton { font-size:15px; width: 250px; height: 25px; font-family:Comic Sans MS,sans-serif; font-weight:bold; color:#000000; background-color:#FF0066; border-style:outset; } </style> </HEAD> <DIV ALIGN=CENTER> <table border="10" bgcolor="#0C6AA1"> <tr> <td><P><FONT SIZE="+3">Simple Calculator</FONT></P> <FORM NAME="Calculator" METHOD="post"> <P>Enter a number: <INPUT TYPE=TEXT NAME="input_A" SIZE=15></P> <P>Enter a number: <INPUT TYPE=TEXT NAME="input_B" SIZE=15></P> <form name="groovyform"> <input type="button" name="AddButon" class="groovybutton" value="Add Numbers" onClick="CalculateSum(this.form.input_A.value, this.form.input_B.value, this.form)" title=""> </form> <form name="groovyform"> <input type="button" name="SubButton" class="groovybutton" value="Subtract Numbers" onClick="CalculateDif(this.form.input_A.value, this.form.input_B.value, this.form)" title=""> </form> <form name="groovyform"> <input type="button" name="DivButton" class="groovybutton" value="Divide Numbers" onClick="CalculateQuo(this.form.input_A.value, this.form.input_B.value, this.form)" title=""> </form> <form name="groovyform"> <input type="button" name="MultButton" class="groovybutton" value="Multiply Numbers" onClick="CalculatePro(this.form.input_A.value, this.form.input_B.value, this.form)" title=""> </form> <form name="groovyform"> <input type="button" name="ClearButton" class="groovybutton" value="Clear Fields" onClick="ClearForm(this.form)" title=""> </form> <P>Answer = <INPUT TYPE=TEXT NAME="Answer" SIZE=18></P> </FORM></td> </DIV> </BODY> </HTML> If anyone can help with this, It would be greatly appreciated. Hey All, Well, I'm having some difficulty with buttons on my page. I've decided to add Google search to my website. However, I can't get the submit button to look right. Rather than the button appearing as shown in the photo directly below, it comes up looking like the button in the second photo below. I know this is a minor detail, but it's really bugging me and I can't figure out what's going on. Even if I go directly to Googles website, copy the source code, and paste it directly into my HTML editor (Frontpage 2003) the button still comes up looking like the one in the second picture. Any help would be greatly appreciated. Thanks! Tim www.corvette-restoration.com So I'm extremely new to HTML and I am trying to make a button open new tabs to two sites. Here is what I got so far: HTML Code: <a href='http://www.planetminecraft.com' title='Planet Minecraft : Supporting our Addiction!'><img src='http://www.planetminecraft.com/images/banners/planet_minecraft_mb.gif' border='0' alt='Planet Minecraft Banner'></a> Hi Guys/Ladies Im working through CSS learning it and so far its going well but i am stuck on this issue and a refuse to turn back to Html Tables etc i want to learn how to code without tables So i have a horizontal Menu bar and i would like to populate it with buttons linking to different sections on the site there is already two buttons but you can see from the image they are both touching one another i need to space them out, the buttons arent finished i want to get the layout sorted first then start adding detail. This is the CSS for the menu bar. I added the background image. HTML Code: div.hideSkiplink { background-image: url('/images/BottomMenu.gif'); width:100%; } div.menu { padding: 4px 0px 4px 8px; } div.menu ul { list-style: none; margin: 0px; padding: 0px; width: auto; } div.menu ul li a, div.menu ul li a:visited { background-color: #465c71; border: 1px #4e667d solid; color: #dde4ec; display: block; line-height: 1.35em; padding: 4px 20px; text-decoration: none; white-space: nowrap; } div.menu ul li a:hover { background-color: #bfcbd6; color: #465c71; text-decoration: none; } div.menu ul li a:active { background-color: #465c71; color: #cfdbe6; text-decoration: none; } This is the code on the site master where im calling the CSS HTML Code: <div class="clear hideSkiplink"> <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> <Items> <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/> <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/> </Items> </asp:Menu> </div> iv attached the image so you can see what its doing.... Hope some one can help me I've played around with this code but it seems as if I can't get the buttons to appear. Is this related to the script type? Anyone know how I can fix this? [the location is not set yet, my problem is just getting the buttons to show up] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <TITLE> Meats </TITLE> </HEAD> <BODY> <SCRIPT type="text/javascript"> <table> <table border="1" align="center" cellpadding="1" cellspacing="1" BGCOLOR=blue > <tr> <td> <INPUT type="button" value="Home" name="button1"onClick="window.location='http://www.htm'"> <td> <INPUT type="button" value="History" name="button2" onClick="window.location='http://steakslocation.htm'"> <td> <INPUT type="button" value="Residents" name="button3" onClick="window.location='http://porklocation.htm'"> <td> <INPUT type="button" value="Events" name="button4" onClick="window.location='http://poultrylocation.htm'"> <td> <INPUT type="button" value="Links" name="button5" onClick="window.location='http://venisonlocation.htm'"> </SCRIPT type="text/javascript"> <div id="PICTURE"> <img src="anthropormophic_bacon.jpg" height="90%" width="90%" alt="Buddy!" /> <center> Y Halo Thar </center> </div> </table> The content of the document...... </BODY> </HTML> |