HTML - Frames, Forms, And Updating Tables
I apologize if this is in the wrong forum. Please move it to the proper location if needed.
Here's the situation: I need a page with 2 fixed frames, small top, rest bottom. In the top frame, I need a few form text fields and a submit button. In the bottom frame, I need the information that was typed into the text fields above to populate the bottom frame. Everytime I enter new info and hit submit, I want the information to be added to the bottom frame and to the information that was already added. I'm new to this, but am a quick learner and willing to spend enough time to do this myself with guidance. Thanks Similar TutorialsMy code looks like this: (if someone can let me know how to input the "code" script in the forums Id appreciate it) <table width="740" height="255" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"> <tr> <td width="30" bgcolor="#000033"><div align="left"> <pre> </pre> </div></td> <td><div align="center"> <iframe src="http://fl.living.net/idxrealtor/1188209 "width="100%" height="100%">>></iframe> </div></td> <td width="30" bgcolor="#000033"> </td> </tr> </table> It doesnt work at all in IE and in Firefox it works but the table is not wide enough to contain the whole iframe. I need to put a real estate search page (http://fl.living.net/idxrealtor/1188209 ) into my website. I have a table that has 3 columns and want the frame in the middle column so the page looks good. the link to the page giving my difficulties is: http://correia-realty.com/mls/ Hi everyone, I'm trying to make a split-screen website, split down the center of your screen with a little bit of space in between them. Both of the sides will be scroll-able. In essence, it's like two seperate websites in one. I know how to accomplish this easily in frames. But I don't want to use frames. I've hit a bit of a "coder's block" when trying to piece how I should do this regularly. Please help because the first couple tests that I've done are running into each other and look pretty hilarious. Thanks in advance for your time!! can the anchor tag be used in HTML tables, such that if an <a> tag is used in one cell of the table, then its target is another cell of the same table. very much like frames, but can it be done using tables. if so, how? With the attached png images (in zip file) and code below, can anyone help me fix the first broken image? These frames will display thumbnails either in landscape or portrait. Also, I plan on having more than just these two frames on this page. I would like to have maybe 4 rows of 5 thumbnails per row and whether the thumbnail is portrait or landscape is totally random. I would rather do all this with css and divs but do not understand divs, so I am using tables. Thank you. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Language" content="en-us" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled 1</title> </head> <body style="background-color: #000000"> <table style="width: 242px; height: 177px" cellspacing="0" cellpadding="0"> <tr> <td style="width: 24px; height: 24px"> <img src="upleft.png" width="24" height="24" /></td> <td><img src="up.png" width="194" height="24" /></td> <td style="width: 24px; height: 24px"> <img src="upright.png" width="24" height="24" /></td> <td style="width: 24px; height: 24px"> </td> <td style="width: 129px; height: 24px"> <img src="upleft.png" width="24" height="24" /></td> <td style="width: 24px; height: 24px"> <img src="v_up.png" width="129" height="24" /></td> <td style="width: 24px; height: 24px"> <img src="upright.png" width="24" height="24" /></td> </tr> <tr> <td><img src="left.png" width="24" height="129" /></td> <td style="width: 194px; height: 129px"> </td> <td><img src="right.png" width="24" height="129" /></td> <td rowspan="2" style="width: 24px; height: 194px"> </td> <td rowspan="2" style="width: 129px; height: 194px"> <img src="v_left.png" width="24" height="194" /></td> <td rowspan="2" style="width: 24px; height: 194px"> </td> <td rowspan="2" style="width: 24px; height: 194px"> <img src="v_right.png" width="24" height="194" /></td> </tr> <tr> <td style="width: 24px; height: 24px"> <img src="downleft.png" width="24" height="24" /></td> <td><img src="down.png" width="194" height="23" /></td> <td style="width: 24px; height: 24px"> <img src="downright.png" width="24" height="24" /></td> </tr> <tr> <td style="width: 24px; height: 24px"> </td> <td> </td> <td style="width: 24px; height: 24px"> </td> <td style="width: 24px; height: 24px"> </td> <td style="width: 129px; height: 24px"> <img src="downleft.png" width="24" height="24" /></td> <td style="width: 24px; height: 24px"> <img src="v_down.png" width="129" height="23" /></td> <td style="width: 24px; height: 24px"> <img src="downright.png" width="24" height="24" /></td> </tr> </table> </body> </html> Trying to get this code to look like the attached photo; what am I missing? Specifically wondering about the alignment of the labels next to the buttons and text boxes, but any other suggestions would be greatly appreciated. Thanks! Code: <?xml version="1.0" encoding="UTF-8"?> <!-- DOCTYPE tag to declare XHTML 1.0 Transitional --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <!-- Head section containing title, and meta tags for author and editing program --> <head> <title>Lab 7</title> <meta name="Marc" content="CSE HTML Validator Professional (http://www.htmlvalidator.com/)" /> </head> <!-- Body tag with bgcolor, background image, and text, link, vlink, and alink color --> <body bgcolor="white" background="\images\background.jpg" text="black" link="#0000FF" vlink="#FF00FF" alink="#00FF00"> <h1 align="center">Registration Form</h1> <form action="..."> <table width=80% bgcolor="00b2e2"> <tr align="left"> <td width="20%" colspan="4"><u><b>Student Information</b></u></td> </tr> <tr align="center"> <td width="20%" colspan="4" align="left">Student ID: <input type="text" name="studentid" id="studentid" /></td> </tr> <tr align="left"> <td width="20%"> Title:<input type="radio" name="Mr." align="right" />Mr.<br /> <input type="radio" name="Mrs." align="right" />Mrs.<br /> <input type="radio" name="Miss" align="right" />Miss<br /> <input type="radio" name="Ms." align="right" />Ms. </td> <td align="left">First Name: <input type="text" name="firstname" id="firstname" /></td> <td align="left">Last Name: <input type="text" name="lastname" id="lastname" /></td> <td></td> </tr> <tr align="left"> <td>Address:<br /><input type="text" name="address" id="address" /></td> </tr> <tr align="left"> <td>City: <input type="text" name="city" id="city" /></td> <td>State: <input type="text" name="state" id="state" /></td> <td>ZIP: <input type="text" name="zip" id="zip" /></td> <td width="20%"></td> </tr> </table> </form> </body> </html> Hi. I know this is fairly simple but havn't found a fix elsewhere. I created this form but can't close it. I'm guessing its to do with the table? Everytime i but a </form> tag in it either wont submit the form or screws up formatting. Any ideas. Thanks. Code: <table width="681" border="0" class="style26"> <tr> <td colspan="5" valign="middle"><p>My name is:<br> </p> </td> </tr> <tr> <td width="8" valign="middle"> </td> <td width="90" valign="middle"><span class="style30">given name(s)<br> </span></td> <td width="170" valign="middle"> <form action="lostform.php" method="post" name="form1"> <span id="sprytextfield1"> <label> <input type="text" name="gname" id="fname"> </label> </span> </form> </td> <td width="67" valign="middle" class="style30">surname</td> <td width="324" valign="middle"><span class="style30" id="sprytextfield2"> <label> <input type="text" name="sname" id="sname"> </label> </span><br></td> </tr> <tr> <td valign="middle"> </td> <td valign="middle">My email is:</td> <td colspan="3" valign="middle"><span id="sprytextfield3"> <label> <input type="text" name="email" id="email"> </label> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br> <br></td> </tr> <tr> <td colspan="3" valign="middle">My date of purchase was:</td> <td colspan="2" valign="middle"><span id="spryselect1"> <label> <select name="day" size="1" id="day"> <option selected>01</option> <option>02</option> <option>03</option> <option>04</option> <option>05</option> <option>06</option> <option>07</option> <option>08</option> <option>09</option> <option>10</option> <option>11</option> <option>12</option> <option>13</option> <option>14</option> <option>15</option> <option>16</option> <option>17</option> <option>18</option> <option>19</option> <option>20</option> <option>21</option> <option>22</option> <option>23</option> <option>24</option> <option>25</option> <option>26</option> <option>27</option> <option>28</option> <option>29</option> <option>30</option> <option>31</option> </select> </label> <span class="selectRequiredMsg">*</span></span> <span id="spryselect2"> <label> <select name="month2" size="1" id="month"> <option>JAN</option> <option>FEB</option> <option>MAR</option> <option>APR</option> <option>MAY</option> <option>JUN</option> <option>JUL</option> <option>AUG</option> <option>SEP</option> <option>OCT</option> <option>NOV</option> <option>DEC</option> </select> </label> <span class="selectRequiredMsg">*</span></span> <span id="spryselect3"> <label> <select name="year" size="1" id="year"> <option>1998</option> <option selected>1999</option> <option>2000</option> <option>2001</option> <option>2002</option> <option>2003</option> <option>2004</option> <option>2005</option> <option>2006</option> <option>2007</option> <option>2008</option> </select> *</label><span class="selectInvalidMsg"></span> </span><br></td> </tr> <tr> <td colspan="3" valign="middle">My Receipt Number was:</td> <td colspan="2" valign="middle"><span id="sprytextfield4"> <label> <input name="rcpt" type="text" id="rcpt" size="10" maxlength="8"> </label> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldMinCharsMsg style32 style32">Invalid: Please check your receipt number</span><span class="textfieldMaxCharsMsg style32 style32">Invalid: Please check your receipt number.</span></span><br></td> </tr> <tr> <td colspan="3" valign="middle"><br> Other Comments:</td> <td colspan="2" valign="middle"> </td> </tr> <tr> <td valign="middle"> </td> <td colspan="4" valign="middle"><span id="sprytextarea1"> <label></label> <span class="textareaRequiredMsg">A value is required.</span></span> <div align="center"> <textarea name="message" id="message" cols="45" rows="5"></textarea> </div></td> </tr> <tr> <td> </td> <td colspan="4"><label> <input type="submit" name="submit" id="submit" value="Submit"> </form> <div align="center"></div> </label></td> </tr> </table> I was looking to compare business cards, when I came across this website (I don't own the site, and I'm not trying to market it): http://www.goodmarketingideas.com/to...rds/comparison When you use the form, the one labeled "Comparison Price Calculator", the table on the page changes to show different prices, based on how many business cards you want. I checked the source code, and from what I can see, it's a basic form with nothing special to it. How is this done? I want to mimic this effect, but I can't find any information on how to do this. Any help would be greatly appreciated, thanks. Hi guys, I've been frustrated for awhile trying to fix three of my problems. I just started making a site for myself today, the specific one is http://www.bcsticketsnow.com/rosebowl.html Anyway, I've got three problems, and appreciate any help anyone can offer on any of them: 1. I'm new to frames, and am told to stay clear of it. But I don't know php, so this is the only way I know to make a header, middle and footer on all 20 pages that I'm going to have where I only need to edit one to change all. So I have 3 frames in the frameset, header, mainrosebowl, and footer. I understand that cols="220,*,100" will make the header 220 pixels, the footer 100 px, and the middle part the rest of the window. But I'm trying to figure out a way to have it go deeper than the window. As you can tell, I've got a scroll bar on that middle frame. I want that frame to extend to more than 100% and push the footer below the visible window. So I'm really looking for a big scroll bar for the entire window to scroll down, not a mini scroll bar just for the middle frame. Is this possible? Having the cols add up to only the size of the window isn't what I'm looking for. 2. In the header frame, I've got that drop down menu (says "Bowl Events"). When I put the form in for the drop down menu, it kind of expanded the height of the table. It had less space before in that row of the table with the blue background. When I put the form in there, it kinda messed up the spacing. I essentially want to delete that space below bowl events to make the height of the row of that table like half the size. Any ideas? 3. For that same drop down menu, I'm trying to target each link in that menu to open up a new window (like target="_top"). But putting it after <option value="URL" target=..."> does nothing. Am I supposed to put it in the javascript? Here's what I have now: <script type="text/javascript"> function goToPage(dd) { var ind = dd.selectedIndex; if (ind == 0) { return; } var url = dd.options[ind].value document.location=url; } </script> <form> <select name="eventlist" onChange="goToPage(this); return false;" size="1" style="border: 0; BACKGROUND: navy; COLOR: white; FONT-FAMILY: arial; FONT-SIZE: 15px; font-weight: bold;"> <option value="">Bowl Events</option> <option value="http://www.bcsticketsnow.com/bcschampionship.html" onclick="header.location.href='_top'">BCS Championship</option> <option value="http://www.bcsticketsnow.com/rosebowl.html">2009 Rose Bowl</option> <option value="http://www.bcsticketsnow.com/orangebowl.html">2009 Orange Bowl</option> <option value="http://www.bcsticketsnow.com/fiestabowl.html">2009 Fiesta Bowl</option> <option value="http://www.bcsticketsnow.com/sugarbowl.html">2009 Sugar Bowl</option> <option value="http://www.bcsticketsnow.com/chickfilabowl.html">2009 Chick-Fil-A Bowl</option> <option value="http://www.bcsticketsnow.com/capitalonebowl.html">2009 Capital One Bowl</option> <option value="http://www.bcsticketsnow.com/cottonbowl.html">2009 Cotton Bowl</option> <option value="http://www.bcsticketsnow.com/holidaybowl.html">2009 Holiday Bowl</option> </select></form> I've heard many times "don't use frames, there is better ways to accomplish it", and I was wondering, is this just referring to "invisible" frames, or any frames? For example, look at Kingdom of Loathing. They use frames (or what appears to be frames) and I can't see how they could successfully make that site without. If I had to have all the screens scroll as one rather than separate, and couldn't resize when I needed to, it would be extremely annoying. So, frames are bad, or just the invisible ones? Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts Hi guys, hope you can help with what I'm hoping will be a simple answer! I'm just developing a small web app using XML as a basic data source. The XML data simply populates an event listing and news page etc. I need the client to be able to add new events and new news stories etc themselves and was wondering if there was a way for him to do it without editing the XML file directly?? Previously, I've used an MS Access database and I've had a basic asp input or update form to add info to the database, but I guess it doesn't work this way with XML. XML seems an extremely easy way of storing, retreiving and displaying small amounts of data in this way, and wanted to avoid having a content management system for the client. Any help would be greatly appreciated!! Kind Regards Gaz How would I set something up on a website hosted by the server, were I can implement a text box that can be update by not updating the actual page it self, so I dont have to continually update the actual page rather some other form be able to update current news, and dates of certain events. If you get what Im trying to say. Not sure if it would be HTMl or PHP. Thanks for the help! Hey I have been asked to design my schools website which involves information from each department i.e. computing, maths, English, ect.. that needs to be included in the site. I would like for the departments to be able to change there information on the site from within the site instead of having to open a html editor and changing the text there then having to uploading it back up to the site. Is there a way that the text can be changed on the site, kind of like wikipedia, but with a html code? Cheers Hey, I have made an HTML-based iPhone theme that is a calendar (screenshot attached). My problem is that the HTML has to be reloaded in order to update the date, and that requires restarting the device. I would like the date to update automatically. Unfortunately, I do not know HTML beyond the minimum to get this working. I tried some javascript functions on timers but I can't get it working. The files are attached. How can I make it update itself? Thanks! P.S. You can load the HTML file on your computer, it just won't have the background or icons or anything. Ok so I am extremely new to coding and am setting up a small website. Everything I use right now is based off of a few excel spreadsheets and the site I'm making I want some of that info in a more public format rather than sharing a bunch of spreadsheets. One spreadsheet I have imports the html tables from another website and puts it into a google docs spreadsheet. So whenever the source code is changed on the original website it is also changed on my spreadsheet. Now, is it possible to reference a specific spreadsheet cell(s) (instead of the specific data in the cells) so that when the data is changed on the spreadsheet it is also changed on my website. The way I have it now it only shows what was on the spreadsheet at the time the code was entered. So if cell A1 said apples and then a day later cell A1 changed to bananas, my website still shows apples since that was what was originally entered even though the spreadsheet changed to bananas. I'm not sure if I'm too clear on what I'm asking...I tried. If you have a vague answer or a starting point where I should start looking that would be good too. Thanks. I've been running a PS3 Madden 10 Franchise for the last 6 months. I had a fellow member who created a cool website for the Franchise. Unfortunately, he won't be able to help update the website for Madden 11. Currently I'm stuck trying to learn HTML on my own and doing my best to update the website for Madden 11. Right now, I'm trying to change the Home Page banner. However, I can't seem to identify it in the code. For some reason the banner is split into two parts. " HomePageBanner1.png " and " HomePageBanner2.png " ... I would like to switch the current home page banner to the following, " DrewBreesBanner1.png " and " DrewBreesBanner2.png " ... Any help is greatly appreciated. Thank you. The html code for the home page is: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Blu Ray Franchise - League of Champions - Home Page</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" type="text/css" href="Style.css" /> <noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script language=JavaScript> var message = "Sorry, right click is disabled! (:"; function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; } if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } } document.onmousedown = rtclickcheck; </SCRIPT> <SCRIPT TYPE="text/javascript"> <!-- function popup(mylink, windowname) { if (! window.focus)return true; var href; if (typeof(mylink) == 'string') href=mylink; else href=mylink.href; window.open(href, windowname, 'width=660,height=380,left=375,top=225,scrollbars=no'); return false; } //--> </SCRIPT> </head> <body> <div id="header"> <center> <table border="0"> </tr> <br> <br> </table></center><font> </div> </div> <br> </div> <img src="Titles/FootballBanner.png"> <br> <br> <div id="wrapper"> <div id="sidebar"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <ul id="navigation"> <div class="news"> <br> <br> <br> <br> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <br><center><img src="Others/PowerRankings.png"></center> <br> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p></p> <p><center><div id="cboxdiv" style="text-align: center; line-height: 0"> <div><iframe frameborder="0" width="175" height="289" src="http://www5.cbox.ws/box/?boxid=637639&boxtag=vfs7an&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#DBE2ED 1px solid;" id="cboxmain"></iframe></div> <div><iframe frameborder="0" width="175" height="91" src="http://www5.cbox.ws/box/?boxid=637639&boxtag=vfs7an&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#DBE2ED 1px solid;border-top:0px" id="cboxform"></iframe></div> </div> </center> </div> </ul> </div> <div id="content"> <div class="search"><span></span> </div> <br> <br> <br> <br> <br> <br> <div class="bg"> <div class="column1"> <img src="Headlines/LatestHeadline(Top).png"> <br> <a href="Headline9.html"><img src="Headlines/LatestHeadline(Read).png" border="0" /></a> <br> <img src="Headlines/LatestHeadline(OtherHeads).png"> <br> <a href="Headline8.html"><img src="Headlines/LatestHeadline(Head8).png" border="0" /></a> <br> <a href="Headline7.html"><img src="Headlines/LatestHeadline(Head7).png" border="0" /></a> <br> <a href="Headline5.html"><img src="Headlines/LatestHeadline(Head5).png" border="0" /></a> <br><br> <a href="Headline4.html"><img src="Headlines/LatestHeadline(Head4).png" border="0" /></a> <br><br> <a href="Headline3.html"><img src="Headlines/LatestHeadline(Head3).png" border="0" /></a> <br><br> <a href="Headline2.html"><img src="Headlines/LatestHeadline(Head2).png" border="0" /></a> <br><br> <a href="Headline1.html"><img src="Headlines/LatestHeadline(Head1).png" border="0" /></a> <br><br><br><br><br><br><br><br><br><br><br><br><br> <br> </div> <div class="column2"> <div class="news"> <br> <center><img src="Others/CowboysEagles.png"></center> <br> <br><center><img src="Titles/FootballBanner2.png"></center> <br> <br> <br> <br><center><img src="Others/PoWeek1.png"></center> <br> <br> <br> <br> </div> </div> <div class="news"> </div> </div> </div> </div> <center><img src="Titles/FootballBanner.png"></center> <br> <div id="footer"> <ul> <li><a href="Home.html">Home</a>|</li> <li><a href="TeamOwners.html">Team Owners</a>|</li> <li><a href="Standings.html">Standings</a>|</li> <li><a href="LeagueLeaders.html">League Leaders</a>|</li> <li><a href="WeeklyRecaps.html">Weekly Recaps</a>|</li> <li><a href="Highlights.html">Highlights</a>|</li> <li><a href="http://forum.blu-ray.com/blu-ray-games-playstation-3/135356-rules-madden-2011-sim-online-franchise.html#post2987081">Rules</a>|</li> <li><a href="http://blurayfranchise.creaforum.net/index.htm">Forums</a></li> </ul> <p></p> </div> </body> </html> The website can be viewed HERE . Hi everyone I'm currently told to design a html page that updates live(Constantly changing) data, I wonder if it is possible through html coding. Lets say the data updates every 2 seconds, as in the page changes the data without me manually refreshing the page. Is it even possible in the first place? Sorry, but I'm kinda new to html code writing and all. Sorry haha. I am creating my first site for a business and I am almost content with the template I am going to be using. The problem is that from time to time new brand names of things will come out and I will need to put a link for them in my links on the right and top of my pages. My plan was to use my template over and over for every page on the site just replacing the content section. Is there a way to update just the main page so that it adds the new links to all the pages instead of going through each one to add them? I have very lilttle exirience with java script and would like to keep it as much pure html and css as posssible |