JavaScript - Newbie - Help Submitting Contents Of Input To Table Field
Hi all,
What I am trying to achieve. I have a php page that has a button on it when clicked shows a div (previously hidden) in the middle of the page this div contains a table with rows. Each row has an image acting as a button and a series of fields that are populated from a database. One of the fields is a quantity box I want to be able to change the value in this box and click on the submit img and have it submit this info (including the altered quantity) back to the php page or to the submit function so that I can then access the values. I have absolutly no idea how to start this. I have very limited javascript experience. the submit looks something like (at the moment) Code: echo '<a href="#" onclick="javascript: document.getElementById(\'stockitemid\').value = '.$stockline->purchaseitemid.'; submitbutton(\'addLineFromStock\')" >'.$purchaseLineImg.'</a>'; and then I was trying to alert in the submit function something like: Code: alert(document.getElementById('stockitemid').value); my div td fields look like Code: <td> <input type="text" size="3" name="sid[<?php echo $stockline->purchaseitemid; ?>]" id="stockitemid<?php echo $count; ?>" value="<?php echo $stockline->purchaseitemid; ?>" /> </td> <td> <input type="text" size="3" name="stockqty[<?php echo $stockline->purchaseitemid; ?>]" id="stockquantity" value="<?php echo $stockline->quantitysupplied; ?>" /> </td> Any help would be greatly appreciated Thanks Kate Similar TutorialsI was curious if there is a method to keep a single input from submitting a form. I have an input into which I'm building a drop down search feature, however, I'd like it so when the user presses return there, instead of submitting the form, it runs an AJAX POST instead. I am currently using keyUp to recognize the button press, but its still submitting the form its attached to. Obviously, I'd like that not to happen. This little script works nicely in IE, and FF but fails in Chrome. It saves the contents of input boxes and displays them next time the page loads: (the cookie functions are the usual ones) Code: window.onload = function() { var theInputs = document.getElementsByTagName('input'); for(var i = 0; i < theInputs.length; i++) { if(theInputs[i].type == 'text') { theInputs[i].onkeyup = function() { createCookie(this.name,this.value,9999); } } if(readCookie(theInputs[i].name+'val') != null) { theInputs[i].value = readCookie(theInputs[i].name+'val'); } } } Is there an obvious reason why Chrome is not doing this? Hi, How I build a table based on a list under a <DIV></DIV> like this? printing: 1 and: 3 typesetting: 2 industry: 2 has: 2 been: 1 s: 1 standard: 1 ever: 1 since: 1 1500s: 1 when: 1 an: 1 unknown: 1 printer: 1 took: 1 a: 2 galley: 1 type: 3 scrambled: 1 Regards Bob I am building an e-learning lesson in Lectora that will be deployed to a SCROM compatible learning management system. The lesson is converted into HTML before that happens. My table of contents is around 100 pixels wide but some of the page names are longer than that and do not display fully when viewed in a browser. What I am trying to do is this: The page name for this page is very, very long and I can't see it all. Blah blah Would become The page name for this page is very, very long and I can't see it all. Blah blah I've been led to believe there is javascript that will do that. Good morning! I am Brazilian, sorry if there is a clerical error because I used the Google translator. I'm having trouble recovering in JS content of the columns of a <TABLE>. I did many searches but found nothing that could help me. I appreciate any help. Thank you! Manoel Zancheta Hello i am using a simple calendar date picker in which when u click a date is displayed in an input field. Using a javascript i am trying to retrieve data from a second page using this value but probably i am doing something wrong. 1st page: Code: <script type="text/javascript"> function showCustomer(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","check6.asp?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> Check in: <input onchange="showCustomer(this.value)" size="22" id="f_date1" /><button id="f_btn1">...</button> <script type="text/javascript">//<![CDATA[ var cal = Calendar.setup({ onSelect: function(cal) { cal.hide() }, showTime: true }); cal.manageFields("f_btn1", "f_date1", "%Y-%m-%d"); //]]></script> </form> <br /> <div id="txtHint">here...</div> </body> </html> and in second one i am trying to get date like this: Code: sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price,details FROM dbo.rooms, dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and '" & request.querystring("q") & "' not between checkin and checkout" I'm new in web-development. I've searched it but it's not found. I make a input then how i get value of it for javascript value?
Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <script type="javascript/text"> <!-- function clearInputField( input, def ) input = document.getElementById( input ); if ( input.value == def ) { input.value = ''; } } --> </script> </head> <body> <b>Testing Input</b> <input id="input" onclick="JavaScript: clearInputField('input', 'Enter Text');" type="text" size="31" value="Enter Text" /> <body> </html> This gives me a "Uncaught ReferenceError: clearInputField is not defined" error and I'm not sure why...? Hey thanks in advance to anyone who can take a peak at my code and hopefully point me in the correct direction. I have been working on my final project in my javascript class for a bit, and there are a few erros I cant seem to find through firebug or error console. It is due this evening at midnight, so anyone that could help, I really need this assignment for a decent grade. Basically there are two issues so far, one needs to be solved so the other can be as well. First, line 103 - 105 should create a hyperlink to the specified id, but is doesn't return a number. so the link goes no where it is this code: PHP Code: //create hypertext link to the section heading var linkItem = document.createElement("a"); linkItem.innerHTML = n.innerHTML; linkItem.href = "#" + n.id; Next I belive there is a problem with the function expandCollapseDoc(), that might fix itself when the other problem is solved. The document should expand and collapse with the menu. Here is my javascript code: PHP Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 7 Tutorial Case Author: Mike Cleghorn Date: 2-15-10 Filename: toc.js Global Variables: sections An array contain the HTML elements used as section headings in the historic document Functions List: addEvent(object, evName, fnName, cap) Adds an event hander to object where evName is the name of the event, fnName is the function assigned to the event, and cap indicates whether event handler occurs during the capture phase (true) or bubbling phase (false) makeTOC() Generate a table of contents as a nested list for the contents of the "doc" element within the current Web page. Store the nested list in the "toc" element. levelNum(node) Returns the level number of the object node. If the object node does not represent a section heading, the function returns the value -1. createList() Goes through the child nodes of the "doc" element searching for section headings. When it finds a section heading, a new entry is added to the table of contents expandCollapse() Expands and collapse the content of the table of contents and the historic document expandCollapseDoc() Goes through the child nodes of the "doc" element determining which elements to hide and which elements to display isHidden(object) Returns a Boolean value indicating whether object is hidden (true) or not hidden (false) on the Web page by examining the display style for object and all its parent nodes up to the body element */ function addEvent(object, evName, fnName, cap) { if (object.attachEvent) object.attachEvent("on" + evName, fnName); else if (object.addEventListener) object.addEventListener(evName, fnName, cap); } addEvent(window, "load", makeTOC, false); var sections = new Array("h1","h2","h3","h4","h5","h6"); var sourceDoc; //document on which TOC is based on function makeTOC(){ var TOC = document.getElementById("toc"); TOC.innerHTML = "<h1>Table of Contents</h1>"; var TOCList = document.createElement("ol"); TOC.appendChild(TOCList); sourceDoc = document.getElementById("doc"); //generate list items containing section headings createList(sourceDoc, TOCList); } function levelNum(node) { for (var i = 0; i < sections.length; i++) { if(node.nodeName == sections[i].toUpperCase()) return i; } return -1; //node is not section heading } function createList(object, list) { var prevLevel = 0; //level of the pervious TOC entry var headNum = 0; //running count of headings for (var n = object.firstChild; n != null; n = n.nextSibling) { //loop through all nodes in object var nodeLevel = levelNum(n); if (nodeLevel != -1) { //node represents a section heading //insert id for the section heading if necessary headNum++; //create list item to match var listItem = document.createElement("li"); listItem.id = "TOC" + n.id; //create hypertext link to the section heading var linkItem = document.createElement("a"); linkItem.innerHTML = n.innerHTML; linkItem.href = "#" + n.id; //append the hypertext to the list entry listItem.appendChild(linkItem); if (nodeLevel == prevLevel) { //append the entry to the current list list.appendChild(listItem); } else if (nodeLevel > prevLevel) { //append entry to new nest list var nestedList = document.createElement("ol"); nestedList.appendChild(listItem); list.lastChild.appendChild(nestedList); //add plus/minus box beffore the text var plusMinusBox = document.createElement("span"); plusMinusBox.innerHTML = "--"; addEvent(plusMinusBox, "click", expandCollapse, false) nestedList.parentNode.insertBefore(plusMinusBox, nestedList.previousSibling); list = nestedList; prevLevel = nodeLevel; } else if (nodeLevel < prevLevel) { //append entry to a higher-level list var levelUp = prevLevel - nodeLevel; for (var i = 1; i<= levelUp; i++) {list = list.parentNode.parentNode;} list.appendChild(listItem); prevLevel = nodeLevel; } } } } function expandCollapse(e) { var plusMinusBox = e.target || event.srcElement; var nestedList = plusMinusBox.nextSibling.nextSibling; //Toggle the plus and minus symbol if (plusMinusBox.innerHTML == "--") plusMinusBox.innerHTML = "+" else plusMinusBox.innerHTML = "--"; //Toggle display of nested list if(nestedList.style.display == "none") nestedList.style.display = "" else nestedList.style.display = "none"; //expand/collapse doc to match TOC expandCollapseDoc(); } function expandCollapseDoc() { var displayStatus = ""; for (var n = sourceDoc.firstChild; n != null; n = n.nextSibling) { var nodeLevel = levelNum(n); if (nodeLevel != -1) { //determain display status of TOC entry var TOCentry = document.getElementById("TOC" + n.id); if (isHidden(TOCentry)) displayStatus = "none" else displayStatus = ""; } if (n.nodeType == 1) { //apply to current status for the node n.style.display = displayStatus; } } } function isHidden(object) { for (var n = object; n.nodeName != "BODY"; n = n.parentNode) { if (n.style.display = "none") return true; } return false; } the html was too long, so i uploaded it to my webspace you can check out the almost working version at http://www.kinetic-designs.net/final/usconst.htm Again thank you so much! Any questions just ask! Hi I want to get javascript to show or hide a row in a table depending on whether a value is held by a variable collected in a mulitple part formmail. If only 1 adult fills in their name on the earlier form there is no need to show the row which asks him to agree to membership on a later form page. This is what Ive got so far Code: <form name="frm3" method="post" action="bookingscript.php"> <input type="hidden" name="adult2fn" value="$adult2name" /> <script Language="JavaScript"> var name1 = document.frm3.adult2fn.value; if(name1 =="") {alert("hello");document.getElementById("hidden_row").style.display = 'none';} else {alert("no way");document.getElementById("hidden_row").style.display = '';}; </script> <table border="1"> <tr> <td>Always visible</td> </tr> <tr id="hidden_row"> <td>Hide this</td> </tr> <tr> <td>Always visible</td> </tr> </table> </form> If $adult2name is blank then name1 is blank and the row does not show, else $adult2name contains a name, name1 is not blank and the row shows. I have tried displaying the hidden form field (by changing it to text), and adding my own content, also putting in my own values instead if $adult2name and the Alerts appear as appropriate, but the whole table disappears whilst the alert is on and reappears when the alert is OKed for either condition of the if. Same in Firefox and IE7 & 8 Could someone please tell me the error of my ways. Many thanks Richard Below is my previous code I had working in the manner it would change the price, sub_total, tax, sh, total, and total_paid input fields to 0. There are two problems with this... 1. When it outputs to the input fields, the value displays as 0 instead of 0.00. 2. I need to have it only react when the value typed into the input field "trees_sold" is "0". If any higher, I would like it to ignore the statement. Code: <!-- Comp all prices to zero value --> <SCRIPT LANGUAGE="JavaScript"> var trees_sold = 0.00; function InitSaveVariables(form) { price = form.price.value; sub_total = form.sub_total.value; tax = form.tax.value; sh = form.sh.value; total = form.total.value; total_paid = form.total_paid.value; } function CompPrices(form) { if (trees_sold == 0.00) { InitSaveVariables(form); form.price.value = 0.00; form.sub_total.value = 0.00; form.tax.value = 0.00; form.sh.value = 0.00; form.total.value = 0.00; form.total_paid.value = 0.00; } } </script> Code: <input name="trees_sold" id="trees_sold" size="15" onkeyup="javascript:CompPrices(this.form);" maxlength="15" /> Below is my current code I'm working with that I can't seem to get to function properly. I've modified the first two lines of code here, and am attempting to pull any data that is typed in and automatically take into consideration if it is a "0" value, it reacts as my code below says "if (trees_sold == 0.00)" and if anything else, it will not do anything. This is not working unfortunately. Code: <!-- Comp all prices to zero value --> <SCRIPT LANGUAGE="JavaScript"> form.trees_sold.value = ""; trees_sold = form.trees_sold.value; function InitSaveVariables(form) { price = form.price.value; sub_total = form.sub_total.value; tax = form.tax.value; sh = form.sh.value; total = form.total.value; total_paid = form.total_paid.value; } function CompPrices(form) { if (trees_sold == 0.00) { InitSaveVariables(form); form.price.value = 0.00; form.sub_total.value = 0.00; form.tax.value = 0.00; form.sh.value = 0.00; form.total.value = 0.00; form.total_paid.value = 0.00; } } </script> Code: <input name="trees_sold" id="trees_sold" size="15" onkeyup="javascript:CompPrices(this.form);" maxlength="15" /> Anyone have any ideas? Thank you. Hi everyone, im new to javascript and I have created two forms.. a value will be put in the first field and the second field should display either $20 or $35 depending on the value of the first field. Im doing something wrong here.. but I cant see what. Any help is appreciated. <!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 content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>Distance from Depot</title> </head> <body> <form id="distanceform"> <ul> <li> <label for="Distance from EverWarm Depot">Distance from Depot (km):</label> <input type="text" id="distance" class="large"/> </li> </ul> </form> <input name="Button1" type="button" value="calculate" onclick="deliverycost()"/> <form id="deliverycostform"> <ul> <li> <label for="Delivery Cost" >Delivery Cost:</label> <input type="text" id="deliverycost" class="large"/> </li> </ul> </form> <script> function deliverycost() { /* Here is the delivery cost: less than or equal to twenty kilometres is $20.00 greater than twenty kilometres is $35.00 */ var distance = document.forms["neworder"]["distance"].value; if(distance<20) { document.getElementById('deliverycost').innerHTML="$20"; } else { document.getElementById('deliverycost').innerHTML="$35"; } } </script> </body> </html> i was wondering what event would clear an input field that has a value in it... so a user can type their own value.... any examples? hey friend i am trying to use automatic html input creation using java script for my new project .... my problem is the field "type propositon 1:is it answer? ignore this one:" not come into input variable such as $_POST['prop1'] i used PHP Code: pint_r($_POST) and the result was Code: Array ( [radio1] => on [cid] => 65 [desc] => dfdfdfdfd [submit] => Submit ) why my javascript created input field come into role? my php html code is PHP Code: <table> <form action="new.php" method="post"> <tr><td> question type:<br /> True or False:<input type="radio" name="radio1"> Objective:<input type="radio" name="radio2"> Other:<input type="radio" name="radio3" > </td></tr> <textarea name="desc" rows="6" cols="35" ></textarea> <br /> <a href="javascript:add()" ><b>add proposition</b></a> <div id="cat"></div> <div id="num" style="display:none;"></div> <br> </table> and the java script is ... PHP Code: <script language="javascript" type="text/javascript"> function add() { k=document.getElementById("num").innerHTML k=parseInt(k); if(!k) {document.getElementById("num").innerHTML=1; k=1;} else{ document.getElementById("num").innerHTML=k+1; k++; } document.getElementById("cat").innerHTML+="<tr><td>type propositon "+(k)+":<input type=\"text\" name=\"prop"+k+"\"><td>is it answer? </td> <td> <input type=\"checkbox\" name=\"ans"+k+"\"></td><td><td> ignore this one:</td><input type=\"checkbox\" name=\"ign"+k+"\"></td></td></tr><br>" } </script> can someone help me isolate this input script to 1 designated input field? it just removes any pre-existing value in the field but does so to all input text types now. Code: // Home Page Search Box Input Clear function initInputs () { var inputs = document.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++ ){ if(inputs[i].type == "text" ) { inputs[i].valueHtml = inputs[i].value; inputs[i].onfocus = function (){ this.value = ""; } inputs[i].onblur = function (){ this.value != ""? this.value = this.value: this.value = this.valueHtml; } } } } if (window.addEventListener){ window.addEventListener("load", initInputs, false); } else if (window.attachEvent){ window.attachEvent("onload", initInputs); } I'm building a template editor and need some help changing some of the variables. Part 1. Only at DEALERNAME. Must present coupon at time of write-up. Cannot be combined with any other offer. 1 coupon per customer per transaction. Expires: 00/00/00.s I need to be able to fill out two fields to change DEALERNAME and 00/00/00. I found a way to do this but it required the output to be in a field. I need it the output to look no different than before. Part 2. I'm using this to change some text via radio button but I would like an option to select how many details are there is the first place. Say they only want 1 or 2 details and not 3. Head Code: <script language="javascript" type="text/javascript"> function detail1a(){ document.getElementById("detail1").innerHTML = "Up to 5 Quarts"; } function detail1b(){ document.getElementById("detail1").innerHTML = "Synthetic Oil Extra"; } function detail1c(){ document.getElementById("detail1").innerHTML = "Lube Chassis"; } function detail2a(){ document.getElementById("detail2").innerHTML = "Up to 5 Quarts"; } function detail2b(){ document.getElementById("detail2").innerHTML = "Synthetic Oil Extra"; } function detail2c(){ document.getElementById("detail2").innerHTML = "Lube Chassis"; } function detail3a(){ document.getElementById("detail3").innerHTML = "Up to 5 Quarts"; } function detail3b(){ document.getElementById("detail3").innerHTML = "Synthetic Oil Extra"; } function detail3c(){ document.getElementById("detail3").innerHTML = "Lube Chassis"; } </script> Body Code: <span style="font-weight: bold;">Offer Details</span><br /> <p style="margin: 8px 10px"> Detail 1<br /> <input type="radio" name="on/off" onclick="detail1a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail1b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail1c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 2<br /> <input type="radio" name="on/off" onclick="detail2a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail2b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail2c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 3<br /> <input type="radio" name="on/off" onclick="detail3a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail3b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail3c();" />Lube Chassis<br /> </p> Output Code: <ul> <li><span id="detail1">Detail 1</span></li> <li><span id="detail2">Detail 2</span></li> <li><span id="detail3">Detail 3</span></li> </ul> I have a script where I move randomly users from one multiple selectfield to another and that part works perfectly, but... When I want to submit the form I don't get any users passed along, course they are not "selected". I have then read around on the net and I need to create an elemet with a hidden input field where all the randomly selected users is inserted to with comma separation, but dont know how?!?! This is what I got: Code: function randomusers(){ var given = 3, used = {}, randnum, opts = $('#select1 option'), olen = opts.length; function ran() { // generate a unique random number randnum = Math.floor(Math.random() * olen); return used['u'+randnum] ? ran() : randnum; } for (var i = 0; i < given; i++) { // get the correct quantity of randoms used['u'+ran()] = true; } opts.filter(function(index) { // remove all options that are not one of the randoms return !!used['u'+index]; }).appendTo('#select2'); } I have tryied to insert this: appendTo('#select2' + '<input type="hidden" name="test[]" value="" />'); but that didn't seem right... Please help :-) Hi all, I have a complicated (well to me it is!) problem with a form I am creating for my site. The form has three sections with the ability to add another field unlimited times. There is one for adding ingredients, one for equipment and one for steps The name and id does increment on all 3 however the problem is they seem to all be using the same count, by this I mean that if I add 2 steps (which brings the count to 3) and then add an ingredient, the ingredient id goes to ingredient4 - obviously because it is taking the count that step has set. I am no javascript guru, I am more a designer so I'm really struggling, Ive been working on this one for days.. There is also another problem in that if I create say 3 steps bringing the count up to step4 and then remove the second step, I cant see how I can bring the other steps after step2 count down by one, at the moment step4 and step3 are staying as step3 and step4 but because step2 was removed they should drop down to becoming step2 and step3. My php that inserts the data into my db isnt working because the ids keep getting messed up I have a demo URL up on ajburchell.com/form.html If anyone can help me with this I will be extremely grateful Thank you in advance How do I insert this javascript: <script language="JavaScript" type="text/javascript" src="http://www.ABC.com/members/display.php?token=email"></script> Into the values of this: <input id="Email" name="Email" type="text" size="30" /><input name="emailagent" type="HIDDEN" class="textfield" id="emailagent" value=''INSERT JAVASCRIPT" /> I am working on a project where I have 5 XML files that I bring into HTML and display the tables on one browser page. I would like for the row of the tables to change depending on what is in the "status" field. There will only be the following inputs in that column - "IS" which is in stock(green), "OS" which is out of stock(red), and "PO" which is Pre-Order(blue). 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-Type" content="text/html; charset=iso-8859-1" /> <title>ABC Book Store</title> <style type="text/css"> <!-- .style1 { font-size: 10pt; } --> </style> <script> function ld_fiction() { var doc=nb_fiction.XMLDocument; doc.load("fiction.xml"); document.getElementById("head_id").innerHTML="Fiction "; } function Id_nfiction() { var doc_s=nb_nfiction.XMLDocument; doc_s.load("nfiction.xml"); document.getElementByID("head_id_d").innerHTML="NonFiction"; } function ID_selfhelp() { var doc_t=nb_selfhelp.XMLDocument; doc_t.load("selfhelp.xml"); document.getElementByID("head_id_e").innerHTML="SelfHelp"; } function ID_reference() { var doc_u=nb_ref.XMLDocument; doc_u.load("ref.xml"); document.getElementByID("head_id_f").innerHTML="Reference"; } function ID_mags() { var doc_v=nb_mags.XMLDocument; doc_v.load("mags.xml"); document.getElementByID("head_id_g").innerHTML="Mags"; } </script> <XML id="nb_fiction" src="fiction.xml"></XML> <XML id="nb_nfiction" src="nfiction.xml"></XML> <XML id="nb_selfhelp" src="selfhelp.xml"></XML> <XML id="nb_ref" src="ref.xml"></XML> <XML id="nb_mags" src="mags.xml"></XML> <object id="nb_fiction" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0" height="0"></object> <object id="nb_nfiction" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0" height="0"></object> <object id="nb_selfhelp" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0" height="0"></object> <object id="nb_ref" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0" height="0"></object> <object id="nb_mags" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" width="0" height="0"></object> <body> <table width="30%" border="0" align="left" cellspacing="1" font size="10"> <tr bgcolor="#CCCCCC"> <td colspan="2"> <table id="FICTIONTABLE" table width="100%" datasrc="#nb_fiction" font size="1" border="0" align="center" bordercolor="#FFFFFF"> <caption> <span>Fiction </span> </caption> <thead> <tr> <th span class="style1">Stock No.</th></span> <th span class="style1">Title</th></span> <th span class="style1">Author</th></span> <th span class="style1">Status</th></span> <th span class="style1">Price</th></span> <th span class="style1">Publisher</th></span> <th span class="style1">Year of Release</th></span> </tr> </thead> <tbody> <tr> <td><span class="style1" datafld="stock"></td></span> <td><span class="style1" datafld="title"></td></span> <td><span class="style1" datafld="author"></td></td></span> <td><span class="style1" datafld="status"></td></span> <td><span class="style1" datafld="price"></td></span> <td><span class="style1" datafld="publisher"></td></span> <td><span class="style1" datafld="year"></td></span> </tr> </tbody> </table> </td> </tr> </body> </html> I only included the first part of the html code along with the first table, but there is a table for each xml file. You can also probably tell how the XML files are structured by looking at the way they are displayed in the tables. I think what I want to do can be accomplished with JavaScript, but I have no idea how to do it and it's the only thing I have left before I'm done. Any help would really be appreciated and thanks in advance. |