Jump to content

Search the Community

Showing results for tags 'table'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

  1. The JavaScript table sort algorithm on the page "How TO - Sort a Table" is quite inefficient. Not only does it use the infamous quadratic "bubble sort", but is also updates the table unnecessarily often. I was just learning JavaScript and HTML and was frustrated to find no reasonable example anywhere on the internet; so I made one myself 😁. Please use the attached algorithm, which is basically the same, but with three improvements: - Faster sorting by using binary insertion; - updates the table only when needed; - uses textContent instead of innerHTML so it is not distracted by invisible data. Feel free to adjust the program to your style. If you are interested, I am happy to spice it up with some comments for legibility, but it is quite trivial anyway. Jurjen tablesort.js
  2. Hi, im new with HTML and have a question. im working to build an app in Microsoft PowerAppps platform. im using an HTML Text component which is inserted into mail body and sends to the users. i have an issue with the spaces between the tables, while working in the app designer the mails looks as expected: there are 3 tables with a separate header to each table, im using a <p> tag for it. also when the mail is sent, in the outlook preview it looks ok and the headers are placed between the tables.l it is when im openeing the mail where things are becoming wiered, all the spaces between the tables are missing and the headers are pushed to the right side of the mail. if any additional information required i will be happy to provide. thanks in advance. my formulas between the tabkes are as follow: . . . </table> <br> <p><span style='color: rgb(0, 0, 0); font-family: ""Times New Roman"";vertical-align: top; font-size: 25px;'><b>Risks</b></span> </p> <br> <table align=""left"" border=""1"" cellpadding=""1"" cellspacing=""1"" style=""width:1500px""> . . . Screenshots: #1: mail looks ok while in preview mode #2: no spaces between tables and headers are pushed aside
  3. I wonder if anyone has any advice... I've created a searchable table using the 'HTML how to' here: https://www.w3schools.com/howto/howto_js_filter_table.asp I would love it if it was possible to add filter elements above the table so when you clicked on them only the relevant rows in the table would show. A bit like this, but applied to a table: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_filter_elements Any thoughts or advise would be much appreciated! Thank you.
  4. Good Afternoon, I wonder if someone could help. I'm looking at the filter/search table 'How To', here: https://www.w3schools.com/howto/howto_js_filter_table.asp Ideally, we would like to create a table that is searchable across all columns, is this possible? At the moment I can see how to make it search column 1 or column 2, I would ideally like it to search both. Using the example on the 'How To' page it would mean that someone could search either a name or a country and they would see the results they wanted. TIA.
  5. AlexF

    Text List table

    Hello guys, i want to insert on my website a box like that in the image. How can i do it? Any code model? Thank you
  6. I use javascript (and Plotly.js) to create a table (autofit column width) that shows the content of a CSV file. Then the user can apply some filters to show only a few rows and the table shrinks to fit the cell contents. Is there any way to keep the original column width?
  7. Browser: Chrome (displaying at 100%) Desktop Monitor: 4K When displaying a simple table of one cell, the table displays roughly twice the size it should. Just as though you zoomed in 200%. I have a 4K desktop monitor and the table should display the full width 3840px and a height of 2560px. But the table is displaying twice that size. How do I display this table so it fits correctly on my screen (3840 x 2560)? How can something so simple be this difficult to accomplish? HTML Code: <!DOCTYPE html> <html> <head> <title> Test </title> <link rel="stylesheet" type="text/css" href="css/styles.css"> </head> <body> <table> <tr> <td> </td> </tr> </table> </body> </html> Style Sheet Code: body{ margin: 0; }
  8. Hello, I'm kind of dealing with an issue and I have no idea how to solve this...hoping someone would. I'm making a pdf report with HTML, doing this because it will allow the report generation to be automated. In any case, I'm only able to use HTML - no CSS. So please don't provide solutions in CSS, cause I have read them all and unfortunately, the system we use to automate does not recognise CSS. So here is the problem. I have a table set-up in on the pdf page so it looks like this: Column 1 (25%) Column 2 (75%) [picture] cell with picture and text text cell with picture and text cell with picture and text footer text footer cell with picture and text I have set this up with a range of tables within tables (if there are suggestions on how to do this better with ONLY HTML would love to hear them?!) The problem I'd like to make sure the footer parts in each of the columns are always at the bottom of the column whilst the rest should be aligned at the top. As of now, I've used multiple <br> to create breaks there and I was wondering if there is a better way to do this? Thanks for reading! Hope you know of a solution!
  9. How do I change the formatting of the drop down tab? I need each category to be shorter and stack nicer. http://03f7e3d.netsolhost.com/wordpress1/manufacturers/ <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> * { box-sizing: border-box; } body { background-color: #ffffff; padding: 14px; font-family: Garamond; } /* Center website */ .main { width: 1000px; margin: auto; } h1 { font-size: 40px; word-break: break-all; } .row { margin: 40px; } /* Add padding BETWEEN each column */ .row, .row>.column { padding: 16px; } /* Create 5 equal columns that floats next to each other */ .column { float: left; width: 20%; display: none; } /* Clear floats after rows */ .row:after { content: ""; display: table; clear: both; } /* Content */ .content { background-color: white; padding: 14px; width: 180px; height: 75px; } /* The "show" class is added to the filtered elements */ .show { display: block; } /* Style the buttons */ .btn { border: none; outline: none; padding: 4px; background-color: #ebebee; color: black; cursor: pointer; font-family: :times, sans-serif; } .btn:hover { background-color: #c6c6c6; } .btn.active { background-color: #848484; color: white; } </style> </head> <body> <!-- MAIN (Center website) --> <div class="Main"> <CENTER> <h1>Our Manufacturers</h1> </CENTER> <hr> <div id="myBtnContainer"> <button class="btn active" onclick="filterSelection('ALL')">All</button> <button class="btn" onclick="filterSelection('NTX')"> North Texas</button> <button class="btn" onclick="filterSelection('OK')"> Oklahoma</button> <button class="btn" onclick="filterSelection('AR')"> Arkansas</button> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .dropbtn { background-color: #ebebee; color: black; padding: 7px; font-size:14px; border: none; } .dropdown { position: relative; display: inline-block; text-align: left; } .dropdown-content { display: none; position: absolute; background-color: #ebebee; min-width: 220px; z-index: 1; } .dropdown-content a { color: black; padding: 3px; text-decoration: none; display: block; } .dropdown-content a:hover { background-color: #ddd; } .dropdown:hover .dropdown-content { display: block; } .dropdown:hover .dropbtn { background-color: #ffff; } </style> </head> <div class="dropdown" id="dropdown"> <button class=" dropbtn">…</button> <div class=" dropdown-content"> <button class="btn" onclick="filterSelection('WC')"> Wire & Cable</button> <button class="btn" onclick="filterSelection('ACC')"> Wire & Cable Accessories</button> <button class="btn" onclick="filterSelection('MC')"> Motor Control</button> <button class="btn" onclick="filterSelection('WD')"> Wiring Devices</button> <button class="btn" onclick="filterSelection('CF')"> Conduit & Fittings</button> <button class="btn" onclick="filterSelection('FUS')"> Fuses</button> <button class="btn" onclick="filterSelection('TOOL')"> Tools & Fasteners</button> <button class="btn" onclick="filterSelection('EW')"> Enclosures & Wireway</button> <button class="btn" onclick="filterSelection('SPEC')"> Specialty</button> </div> </div> </div> </body> </html> </div> </body> </html> <!-- Portfolio Gallery Grid --> <!--Start TOA--!> <div class="column ALL, column NTX, column OK, column AR, column SPEC"> <div class="content"> <center><a href="https://www.airkinglimited.com" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/AirKing.jpg" alt="Air King" style=" height:48px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column AR,column WC"> <div class="content"> <center><a href="https://www.cmewire.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/CME-2.png" alt="CME" style="height:54px"></center> </div> </div> <div class="column ALL,column NTX, column ACC, column CF, column TOOL"> <div class="content"> <center><a href="https://www.lhdottie.com target="_blank"/"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Dottie-2.png" alt="Dottie" style="height:48px"></center> </div> </div> <div class="column ALL,column OK, column TOOL"> <div class="content"> <center><a href="https://www.dewalt.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Dewalt-2.png" alt="Dewalt" style="height:41px"></center> </div> </div> <div class="column ALL,column OK, column SPEC"> <div class="content"> <center><a href="https://www.dymo.com/en-US" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Dymo.png" alt="Dymo" style="height:42px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column AR, column FUS"> <div class="content"> <center><a href="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Bussman.png" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Edison-2.png" alt="Edison" style="height:45px"></center> </div> </div> <div class="column ALL,column OK, column AR, column FUS"> <div class="content"> <center><a href="http://http://www.cooperindustries.com/content/public/en/bussmann.html" target="_blank"> <img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/10/Eaton-Bussman.png" alt="Bussman" style="height:46px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column CF, column EW"> <div class="content"> <center> <a href="http://www.cooperindustries.com/content/public/en/b-line.html" target="_Blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/B-line.png" alt="B-Line" style="height:48px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column CF, column MC"> <div class="content"> <center><a href="http://www.cooperindustries.com/content/public/en/crouse-hinds.html" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Crouse-Hinds.png" alt="Crouse Hinds" style="height:52px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column AR, column WD"> <div class="content"> <center> <a href="http://www.cooperindustries.com/content/public/en/wiring_devices.html" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Wiring-Devices.png" alt="Eaton Wiring" style="height:52px"></center> </div> </div> <div class="column ALL,column NTX,column OK, column AR, column LIT"> <div class="content"> <center> <a href="https://www.eiko.com/" target="_blank"> <img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Eiko-2.png" alt="Eiko" style="height:50px"></center> </div> </div> <div class="column ALL,column NTX, column WC"> <div class="content"> <center><a href="http://www.galvanelectrical.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Galvan-2.png" alt="Galvan" style="height:20px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column WC"> <div class="content"> <center><a href="https://www.generalcable.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/General-Cable-2.png" alt="General Cable" style="height:24px"></center> </div> </div> <div class="column ALL,column NTX, column EW"> <div class="content"> <center><a href="http://www.highlineproducts.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Highline.jpg" alt="Maclean Highline" style="height:21px"></center> </div> </div> <div class="column ALL,column NTX, column CF"> <div class="content"> <center><a href="http://www.ipexna.com/usa" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Ipex.png" alt="Ipex" style="height:48px"></center> </div> </div> <div class="column ALL,column OK, column TOOL"> <div class="content"> <center><a href="https://www.irwin.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Irwin-2.png" alt="Irwin Tools" style="height:48px"></center> </div> </div> <div class="column ALL,column OK, column TOOL"> <div class="content"> <center><a href="https://www.lenoxtools.com/Pages/Home.aspx" target="_Blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Lenox.png" alt="Lenox" style="height:30px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column ACC, column LIT, column TOOL"> <div class="content"> <center><a href="http://www.nsiindustries.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/NSI-2.png" alt="NSI" style="height:48px"></center> </div> </div> <div class="column ALL,column NTX, column CF"> <div class="content"> <center><a href="http://www.nec-inc.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/nec.png" alt="NEC" style="height:64px"></center> </div> </div> <div class="column ALL,column NTX, column CF"> <div class="content"> <center><a href="https://www.patriotsas.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Patriot-2.png" alt="Patriot" style="height:48px"></center> </div> </div> <div class="column ALL,column NTX,column OK, column SPEC"> <div class="content"> <center><a href="https://www.polywater.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Polywater-2.png" alt="Polywater" style="height:42px"></center> </div> </div> <div class="column ALL,column NTX, column CF"> <div class="content"> <center><a href="http://www.primeconduit.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Prime-2.png" alt="Prime" style="height:28px"></center> </div> </div> <div class="column ALL,column OK, column SPEC"> <div class="content"> <center><a href="https://www.sharpie.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Sharpie-2.png" alt="Sharpie" style="height:43px"></center> </div> </div> <div class="column ALL,column NTX, column OK, column AR, column MC"> <div class="content"> <center> <a href="http://spikeelectric.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Spike.png" alt="Spike" style="height:42px"></center> </div> </div> <div class="column ALL,column OK"> <div class="content"> <center><a href="https://www.westerntube.com/" target="_blank"><img src="http://03f7e3d.netsolhost.com/wordpress1/wp-content/uploads/2018/11/Western-Tube-2.png" alt="Western Tube" style="height:30px"></center> </div> </div> </hr> </table</table> <!--END Combined--!> <!-- END MAIN --> <!-- END GRID --> <script> filterSelection("all") function filterSelection(c) { var x, i; x = document.getElementsByClassName("column"); if (c == "all") c = ""; for (i = 0; i < x.length; i++) { w3RemoveClass(x, "show"); if (x.className.indexOf(c) > -1) w3AddClass(x, "show"); } } function w3AddClass(element, name) { var i, arr1, arr2; arr1 = element.className.split(" "); arr2 = name.split(" "); for (i = 0; i < arr2.length; i++) { if (arr1.indexOf(arr2) == -1) { element.className += " " + arr2; } } } function w3RemoveClass(element, name) { var i, arr1, arr2; arr1 = element.className.split(" "); arr2 = name.split(" "); for (i = 0; i < arr2.length; i++) { while (arr1.indexOf(arr2) > -1) { arr1.splice(arr1.indexOf(arr2), 1); } } element.className = arr1.join(" "); } // Add active class to the current button (highlight it) var btnContainer = document.getElementById("myBtnContainer"); var btns = btnContainer.getElementsByClassName("btn"); for (var i = 0; i < btns.length; i++) { btns.addEventListener("click", function() { var current = document.getElementsByClassName("active"); current[0].className = current[0].className.replace(" active", ""); this.className += " active"; }); } var btnContainer = document.getElementById("dropdown"); var btns = btnContainer.getElementsByClassName("btn"); for (var i = 0; i < btns.length; i++) { btns.addEventListener("click", function() { var current = document.getElementsByClassName("active"); current[0].className = current[0].className.replace(" active", ""); this.className += " active"; }); } </script> </body> </html>
  10. I have been using the <block-size: XX%;> property to prevent a table from resizing on different screens but I can't seem to get it right, what could I use to solve this? this is an example of how I'm applying the code: HTML <div .div-central> <tr>example1</tr> <tr>example2</tr> <tr>example3</tr> </div> Css .div-central { block-size: 60%; }
  11. Hi I would like to know how to fetch all columns from a table. Not the data in the table, but only the names of the columns. I made a script. I tested the query first in the console giving me a good result in the section Field . Can someone please explain how to use this in PHP ? code example: <?php // test set up for fetching column names $servername = "localhost"; $username = "name"; $password = "pass123"; $dbname = "test_database"; // $conn = new mysqli($servername, $username, $password, $dbname); if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } if ($stmt = $conn->prepare("SHOW COLUMNS FROM test_table ")) { $stmt->execute(); $row = $stmt->fetch(); var_dump($stmt); var_dump($row); foreach ($row as $value) { var_dump($value); } } $stmt->close(); $conn->close(); ?> EDIT: I solved the script in the following way. <?php $stmt = $conn->prepare("SHOW COLUMNS FROM test_table"); $stmt->execute(); $res = $stmt->get_result(); var_dump($res); foreach ($res as $val){ $col = $val['Field']; var_dump($col); } ?> You have to remove the if part and the {} and replace it with the code above.
  12. Hello everyone I am trying to place an image within the right hand table but the background image is still shown when I place the image in the right hand table of my website that I am working on I would like that part of the background image covered I have attached screenshots of the HTML code and the webpage that I am working on any help and solutions would be greatly appreciated thanks so very much in advance.
  13. hello prodeveloper, I want to show some data in a html table with bootstraps basics. The first columns are really large, the last ones are really tiny. Can someone tell me where the mistake could be found? I have 3 headlines tags (<th>) and 7 tabledata tags (<td>). I have already tried "<th colspan="3"> to set columnheadlines to the right position, without success. in this table i want to show how many math tasks my childeren solved right, calucalted false and how many "stars" they reached in a day, a week, the week before, in a month and so one. Can someone help me to make the the table look good? that's the result: click here that's the code: <thead> <tr><th style="padding-left:20px"><strong>#</strong></th> <th style="padding-left:20px"><strong>Kilian</strong></th> <th style="padding-left:20px"><strong>Ilias</strong></th> </tr> </thead> <tbody> <tr> <td>heute</td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($HeuteKilianRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($HeuteKilianFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($HeuteKilianSterne,0,",","."); ?></td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($HeuteIliasRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($HeuteIliasFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($HeuteIliasSterne,0,",","."); ?></td> </tr> <tr> <td>aktuelle Woche</td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheKilianRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheKilianFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheKilianSterne,0,",","."); ?></td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheIliasRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheIliasFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($aktuelleWocheIliasSterne,0,",","."); ?></td> </tr> <tr> <td>Vorwoche</td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($Woche_1KilianRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($Woche_1KilianFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($Woche_1KilianSterne,0,",","."); ?></td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($Woche_1IliasRichtig,0,",",".")." "; ?></td> <td><i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($Woche_1IliasFalsch,0,",",".")." "; ?></td> <td><i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($Woche_1IliasSterne,0,",","."); ?></td> </td> </tr> <tr> <td>Vor 2 Wochen</td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($Woche_2KilianRichtig,0,",",".")." "; ?> <i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($Woche_2KilianFalsch,0,",",".")." "; ?> <i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($Woche_2KilianSterne,0,",","."); ?> </td> <td><i class="fa fa-check" aria-hidden="true"></i> <? echo " ".number_format($Woche_2IliasRichtig,0,",",".")." "; ?> <i class="fa fa-close" aria-hidden="true"></i> <? echo " ".number_format($Woche_2IliasFalsch,0,",",".")." "; ?> <i class="fa fa-star-o" aria-hidden="true"></i> <? echo " ".number_format($Woche_2IliasSterne,0,",","."); ?> </td> </tr>
  14. Hello. Is this the right place to Discuss W3CSS ? Or is that a separate forum ? I am not sure if this is a question, or suggestion - or both. https://www.w3schools.com/w3css/w3css_input.asp I have reviewed the INPUT and the TABLE information in the W3CSS pages, and can not locate the information I am after. I am wondering about the correct technique of using tables and forms in ONE. Ive two scenarios in mind. ONE: You display a table and EACH row contains its own FORM. it contains, text, an input field, and in the 3rd column, its own submit button. each form sends minimal data to get processed. TWO: you have an HTML form, and a table. There is ONE Form, with ONE submit button, but it has multiple table rows, containing text, input fields etc.. Is there an existing tutorial on this ? If not, can one be added to the W3CSS website (and a hyper link to/from the INPUT and TABLE pages).
  15. I am making a site using a table with no borders to organize information on the page to display like a list. I was having issues with td pushing the adjacent td over where as I feel they should line up as left alignment. So I copied just the table information and the padding to another page just to simplify the HTML and locate the issue. Even with the code below, the alignment is still off. Even if I remove the padding the alignment is off. I have also tired changing the width of the table, no help. The only thing that seems to work is shortening the td content. Can anyone help me fix this? <!DOCTYPE html> <html> <style> .table { padding:150px; } </style> <body> <div class="table"> <table style="width:100%"> <tr> <th>Job</th> <th>Food</th> </tr> <tr> <td><p>Technology Teacher</p></td> <td><p>Lamb Karahi</p></td> </tr> <tr> <td><p>Previously a Manager</p></td> <td><p>Pho Thai</p></td> </tr> </table> <table style="width:100%"> <tr> <th>Movies</th> <th>Shows</th> </tr> <tr> <td><p>Count of Monte Cristo</p></td> <td><p>Chopped</p></td> </tr> <td><p>Good Will Hunting</p></td> <td><p>West World</p></td> </table> </div> </div> </body> </html>
  16. Hi, just wondering if anyone can help me, im trying to display my table above the statisics of the users input, but all it seems to do is split the table. Not sure what im doing if anyone can give me some insight that would be great, thank you. <!DOCTYPE html> <html> <body> <p>GPA CALCULATOR</p> </br> <p>Course Code - Grade Value</p> <p>Statistics</p> <script> //List of Course Code for Validation var coursecode =["ACC1101","ACC3118","ACC5202","ACC5213","ACC5216","ACC5502","ACC8000","ACC8003","ACC8105","AGR2302","AGR3303","AGR3304","AGR3305","AGR4305","ANT1001","ANT2005","ANT2008","ANT3006","BCA3000","BCA4000","BCA8003","BIO1101","BIO1103","BIO1104","BIO1203","BIO1810","BIO2106","BIO2107","BIO2108","BIO2118","BIO2119","BIO3101","BIO3102","BIO3107","CDS1000","CHE1110","CIS1000","CIS2000","CIS2002","CIS3001","CIS3002","CIS3003","CIS3008","CIS5100","CIS5200","CIS5302","CIS5308","CIS8000","CIS8004","CIS8008","CIS8009","CIS8100","CIS8501","CIV1500","CIV2605","CIV2701","CIV3505","CIV3506","CIV3906","CIV4508","CIV5705","CLI1110","CLI3301","CMS1000","CMS1010","CMS1100","CMS2017","CMS2019","CSC1401","CSC1402","CSC2402","CSC2408","CSC3400","CSC3403","CSC3407","CSC3412","CSC3420","CSC3600","CSC8004","CSC8407","CSC8416","CSC8419","CSC8422","CSC8500","CSC8503","CSC8507","CSC8512","CSC8600","CWR1001","CWR2001","DCA9000","DCA9001","DCA9500","DCA9501","EAP7307","EAP7308","ECO1000","EDC1100","EDC1400","EDC2100","EDC2400","EDC3100","EDC4000","EDE2101","EDE3103","EDG3000","EDG5000","EDH1150","EDH2151","EDH2152","EDH3155","EDM8004","EDP2111","EDP4130","EDP4140","EDP4200","EDR8000","EDR8060","EDR8061","EDS2401","EDS3450","EDS4250","EDS4401","EDX1170","EDX1250","EDX2190","EDX2260","EDX3270","EDX3280","ELE1301","ELE1502","ELE2303","ELE2601","ELE2702","ELE2912","ELE3105","ELE3305","ELE3803","ELE3804","ELE3807","ELE3914","ELE4605","ELE4607","ELE5001","ENG1002","ENG1003","ENG1004","ENG1100","ENG1901","ENG2002","ENG3003","ENG3111","ENG4903","ENG5001","ENG8001","ENG8101","ENG8104","ENG8208","ENG8411","ENG8412","ENL1000","ENL2007","ENL3000","ENM1500","ENM1600","ENM2600","ENS7605","ENV2103","ENV2201","ENV3104","ENV4204","FIN1101","FIN2106","FIN2302","FIN3106","FIN3109","FIN5003","FIN8201","FIN1000","FIN1002","FIN1003","FIN2004","FIN2005","FIN2006","FIN3002","GIS1402","GIS3407","HEA8201","HIS1000","HIS2001","HIS8004","HMT2000","ACC1101","ACC3118","ACC5202","ACC5213","ACC5216","ACC5502","ACC8000","ACC8003","ACC8105","AGR2302","AGR3303","AGR3304","AGR3305","AGR4305","ANT1001","ANT2005","ANT2008","ANT3006","BCA3000","BCA4000","BCA8003","BIO1101","BIO1103","BIO1104","BIO1203","BIO1810","BIO2106","BIO2107","BIO2108","BIO2118","BIO2119","BIO3101","BIO3102","BIO3107","CDS1000","CHE1110","CIS1000","CIS2000","CIS2002","CIS3001","CIS3002","CIS3003","CIS3008","CIS5100","CIS5200","CIS5302","CIS5308","CIS8000","CIS8004","CIS8008","CIS8009","CIS8100","CIS8501","CIV1500","CIV2605","CIV2701","CIV3505","CIV3506","CIV3906","CIV4508","CIV5705","CLI1110","CLI3301","CMS1000","CMS1010","CMS1100","CMS2017","CMS2019","CSC1401","CSC1402","CSC2402","CSC2408","CSC3400","CSC3403","CSC3407","CSC3412","CSC3420","CSC3600","CSC8004","CSC8407","CSC8416","CSC8419","CSC8422","CSC8500","CSC8503","CSC8507","CSC8512","CSC8600","CWR1001","CWR2001","DCA9000","DCA9001","DCA9500","DCA9501","EAP7307","EAP7308","ECO1000","EDC1100","EDC1400","EDC2100","EDC2400","EDC3100","EDC4000","EDE2101","EDE3103","EDG3000","EDG5000","EDH1150","EDH2151","EDH2152","EDH3155","EDM8004","EDP2111","EDP4130","EDP4140","EDP4200","EDR8000","EDR8060","EDR8061","EDS2401","EDS3450","EDS4250","EDS4401","EDX1170","EDX1250","EDX2190","EDX2260","EDX3270","EDX3280","ELE1301","ELE1502","ELE2303","ELE2601","ELE2702","ELE2912","ELE3105","ELE3305","ELE3803","ELE3804","ELE3807","ELE3914","ELE4605","ELE4607","ELE5001","ENG1002","ENG1003","ENG1004","ENG1100","ENG1901","ENG2002","ENG3003","ENG3111","ENG4903","ENG5001","ENG8001","ENG8101","ENG8104","ENG8208","ENG8411","ENG8412","ENL1000","ENL2007","ENL3000","ENM1500","ENM1600","ENM2600","ENS7605","ENV2103","ENV2201","ENV3104","ENV4204","FIN1101","FIN2106","FIN2302","FIN3106","FIN3109","FIN5003","FIN8201","FIN1000","FIN1002","FIN1003","FIN2004","FIN2005","FIN2006","FIN3002","GIS1402","GIS3407","HEA8201","HIS1000","HIS2001","HIS8004","HMT2000","HMT4005","INR1000","INR2000","INR3000","INR8010","ISE1000","ISE1001","ISE2001","ISE2002","ISE3000","JRN1010","JRN2000","JRN2001","JRN3003","LAC1001","LAC2001","LAW1101","LAW1111","LAW1112","LAW1113","LAW1114","LAW2211","LAW2212","LAW2213","LAW3130","LAW3311","LAW3312","LAW3467","LAW3469","LAW3471","LAW3473","LAW5230","LAW8001","LAW8715","MAT1000","MAT1101","MAT1102","MAT2409","MAT3201","MAT8180","MBA8000","MEC1201","MEC2101","MEC2202","MEC2402","MEC2405","MEC2901","MEC2902","MEC3102","MEC3203","MEC3302","MEC4103","MGT1000","MGT1001","MGT2001","MGT2204","MGT3001","MGT3005","MGT5000","MGT8002","MKT1001","MKT1002","MKT2013","MKT2015","MSC8001","MSC8002","MUI1001","MUI1007","MUI1008","MUI2002","MUI2003","MUI2006","MUI2020","MUI3005","MUI3010","MUI4002","NSC2500","NUR1100","NUR1102","NUR2100","NUR2200","NUR2300","NUR2499","NUR2800","NUR3010","POL1000","POL2000","PRL1002","PRL2002","PRL2003","PSY1010","PSY1020","PSY2010","PSY2020","PSY2100","PSY3010","PSY3030","PSY3060","REN1201","REN2200","RSH8000","RSH8001","SCI1001","SCI4405","SES1299","SES2101","SES2102","SES2103","SES2104","SES3101","SES3102","SES3204","SES8003","SES8005","SES8008","SES8299","SOC1000","SPE3005","SPE3009","STA2300","STA2301","STA3300","STA8005","SVY1102","SVY1901","SVY2105","SVY2106","SVY2301","SVY2302","SVY2902","SVY3202","SVY4309","THE1001","THE1021","THE1022","THE2003","THE2006","THE2009","THE2011","THE3011","URP1001","URP2001","URP4002","VSA1002","VSA1004","VSA2000","VSA2002","VSA2004","VSA3004","VSA3021","HMT4005","INR1000","INR2000","INR3000","INR8010","ISE1000","ISE1001","ISE2001","ISE2002","ISE3000","JRN1010","JRN2000","JRN2001","JRN3003","LAC1001","LAC2001","LAW1101","LAW1111","LAW1112","LAW1113","LAW1114","LAW2211","LAW2212","LAW2213","LAW3130","LAW3311","LAW3312","LAW3467","LAW3469","LAW3471","LAW3473","LAW5230","LAW8001","LAW8715","MAT1000","MAT1101","MAT1102","MAT2409","MAT3201","MAT8180","MBA8000","MEC1201","MEC2101","MEC2202","MEC2402","MEC2405","MEC2901","MEC2902","MEC3102","MEC3203","MEC3302","MEC4103","MGT1000","MGT1001","MGT2001","MGT2204","MGT3001","MGT3005","MGT5000","MGT8002","MKT1001","MKT1002","MKT2013","MKT2015","MSC8001","MSC8002","MUI1001","MUI1007","MUI1008","MUI2002","MUI2003","MUI2006","MUI2020","MUI3005","MUI3010","MUI4002","NSC2500","NUR1100","NUR1102","NUR2100","NUR2200","NUR2300","NUR2499","NUR2800","NUR3010","POL1000","POL2000","PRL1002","PRL2002","PRL2003","PSY1010","PSY1020","PSY2010","PSY2020","PSY2100","PSY3010","PSY3030","PSY3060","REN1201","REN2200","RSH8000","RSH8001","SCI1001","SCI4405","SES1299","SES2101","SES2102","SES2103","SES2104","SES3101","SES3102","SES3204","SES8003","SES8005","SES8008","SES8299","SOC1000","SPE3005","SPE3009","STA2300","STA2301","STA3300","STA8005","SVY1102","SVY1901","SVY2105","SVY2106","SVY2301","SVY2302","SVY2902","SVY3202","SVY4309","THE1001","THE1021","THE1022","THE2003","THE2006","THE2009","THE2011","THE3011","URP1001","URP2001","URP4002","VSA1002","VSA1004","VSA2000","VSA2002","VSA2004","VSA3004","VSA3021"]; // Course Code and Grade Value Arrays var courseCodeArray = []; var gradeValueArray = []; // Prompt for User to Enter Their Courses Codes which is then Looped Until a Valid Respond // is Entered var input_coursecode = prompt("Please Enter Your Course Code?", ""); var a = coursecode.indexOf(input_coursecode); while(a == -1) { alert("The Code you Entered is not a Valid Course Code, Please Try Again"); var input_coursecode = prompt("Please Enter Your Course Code?", ""); var a = coursecode.indexOf(input_coursecode); } courseCodeArray.push(input_coursecode); // Prompt for User to Enter Their Grade Value which is then Looped Until a Valid Respond // is Entered var input_gradeValue = parseInt(prompt("Please Enter Your Grade for this Course?", "")); while(input_gradeValue > 7 || input_gradeValue < 1) { alert("The Grade you Entered is Not Valid, Please Try Again!"); var input_gradeValue = parseInt(prompt("Please Enter Your Grade for this Course?", "")); } gradeValueArray.push(input_gradeValue); var askUser = confirm("Would You Like to add Another Course?"); while(askUser == true) { var input_coursecode = prompt("Please Enter Your Course Code?", ""); var a = coursecode.indexOf(input_coursecode); while(a == -1) { alert("The Code you Entered is not a Valid Course Code, Please Try Again"); var input_coursecode = prompt("Please Enter Your Course Code?", ""); var a = coursecode.indexOf(input_coursecode); } courseCodeArray.push(input_coursecode); var input_gradeValue = parseInt(prompt("Please Enter Your Grade for this Course?", "")); while(input_gradeValue > 7 || input_gradeValue < 1) { alert("The Grade you Entered is Not Valid, Please Try Again!"); var input_gradeValue = parseInt(prompt("Please Enter Your Grade for this Course?", "")); } gradeValueArray.push(input_gradeValue); var askUser = confirm("Would You Like to add Another Course?"); } // Table Listing Course Codes Enters and Grades for (var i = 0; i < courseCodeArray.length; i++) { document.writeln('<table border="1">'); document.writeln('<tr>'); document.writeln('<td>'+courseCodeArray+'</td>'); document.writeln('<td>'+gradeValueArray+'</td>'); document.writeln('</tr>'); } // Number of Courses the User has Completed: var lengthofCourseCode = courseCodeArray.length; document.write("Number of courses completed: " + lengthofCourseCode + "</br>"); //Highest Grade Value document.write("Highest Grade Value: " + Math.max.apply(null,gradeValueArray) + "</br>"); //Lowest Grade Value document.write("Lowest Grade Value: " + Math.min.apply(null,gradeValueArray) + "</br>"); //GPA CALCULATOR //GPA Score var sumofGradeValue = 0; for(var i=0, n=gradeValueArray.length; i < n; i++) { sumofGradeValue += gradeValueArray; } var actualGPA = sumofGradeValue/lengthofCourseCode; document.write("GPA : " + actualGPA + "</br>"); </script> </body> </html>
  17. In phpmyadmin I did the following query and had it output in php like this: $sql = "UPDATE `table` SET count = count + 1 WHERE unique_nr = 5175781"; this all worked well. though when I tried to implement it in my script I had an error: script: <?php // code to establish dbase connection: var_dump($unique_nr); // $stmt = $conn->prepare('UPDATE table SET count = ? WHERE unique_nr = ? '); $stmt = $conn->prepare('UPDATE table SET count = count + 1 WHERE unique_nr = ? '); $stmt->bind_param("is", $count, $unique_nr); $stmt->execute(); ?> resulting in an error message. I also tried this way of writing for bind_param: $stmt->bind_param("s", $unique_nr); but that didnt update the column, though there wasnt an error message anymore
  18. Hello, I have the following tables: CustomerPersonalDetails ID, Name, Surname, etc. CustomerAccountDetails ID, UserName, Password, ApplicationDate, RegistrationDate with single and original data, and CustomerEconomicOverview ID, + Fields with Calculated Data ​Custo​merBehaviourOverview ID, + Fields with Calculated Data with single and calculated data. They all are connected with 1:1 relation. I would like to ask what the suggestable practice is; to keep the data grouped and separated like above or to put them all in one table. Also, my intention is to encrypt all original data. Thanks in advance.
  19. Hello, I have Events and Tickets​ tables. In Tickets table I have at least the following fields: EventsID CustomersID​ TicketNo ... The number of tickets for an event varies between 500-20,000. That means the number of records after 100 events may be 50,000-2,000,000. I wonder if it is better for each event to have a different table, which means I have 100 tables with 500-20,000 records in each. Which design is better for selecting/querying customers records? Thanks in advance.
  20. j.silver

    Index vs Key

    Dear all, I am trying to dig into the exact difference between key and index in MySQL tables. Some say they are synonymous, others give some differences. I still don't feel confident enough to decide when to use each on a table. I would appreciate if someone well-versed in their difference explain such difference and when to use each. Thanks.
  21. Hi, im a little bit struggling here. What I am trying to do is read the content from a Table by reading the number of rows and cells,(later on only selected rows by checkbox) then display the data in a ´generated Table (where i have to add cells with inputfields) So now my question is: How do i have to write the code so the first row will be created with <th> instead of <td> ? How to add input fields to the cells ? (actually they all could be input fields, just filled out with the data from the table i read from and blank fields for the added or so on.) function generate_table() { // get the reference for the body var body = document.getElementsByTagName("body")[0]; var x = document.getElementById("TableB").rows.length; var y = document.getElementById("TableB").rows[0].childElementCount; var z = document.getElementById("TableB").rows[1].cells[3].innerText; alert("x="+x +" y="+y+" z="+z); // creates a <table> element and a <tbody> element var tbl = document.createElement("table"); var tblBody = document.createElement("tbody"); // creating all cells for (var i = 0; i < x; i++) { // creates a table row var row = document.createElement("tr"); alert("ROW"+row); for (var j = 0; j < y; j++) { // Create a <td> element and a text node, make the text // node the contents of the <td>, and put the <td> at // the end of the table row var cellText = document.createTextNode("cell in row "+i+", column "+j); if (row.tabIndex[0]){ var cell = document.createElement("th"); cell.appendChild(cellText); row.appendChild(cell); } else{ cell = document.createElement("td");} cell.appendChild(cellText); row.appendChild(cell); } // add the row to the end of the table body tblBody.appendChild(row); } // put the <tbody> in the <table> tbl.appendChild(tblBody); // appends <table> into <body> body.appendChild(tbl); // sets the border attribute of tbl to 2; tbl.setAttribute("border", "2"); tbl.setAttribute("class", "tableTest"); }
  22. Desperately needed: a way to retrieve all records from a database table while using prepared statements. The script now works but only for 1 record. <?php $_POST['id']= '2'; // set connection variables // Create connection $conn = new mysqli($servername, $username, $password, $dbname); // Check connection if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } $stmt = $conn->prepare("SELECT * FROM table WHERE id LIKE ? ;"); if ( !$stmt ) { yourErrorHandler($conn->error); // or $mysqli->error_list } else if ( !$stmt->bind_param('i', $id ) ) { yourErrorHandler($stmt->error); // or $stmt->error_list } else if ( !$stmt->execute() ) { yourErrorHandler($stmt->error); // or $stmt->error_list } else { $result = $stmt->get_result(); while ($row = mysqli_fetch_assoc($result)) { var_dump($row); $data[]=$row; var_dump($id); var_dump($data); $array= implode("|" , $row) ; var_dump($array); foreach( $data as $row ) { $id = $row['id']; $name = $row['name']; var_dump($id); var_dump($name); } } } ?> I hope someone can give a query that executes what is desired, but maybe there is also a possibilty to put the query in a loop? Please help.
  23. Hi Guys, I have a slight problem with some of my code. I have a series of tables running down a page with each table containing different data. All looks fine when I look at it as a HTML page but when I use it as an Email 2/3 elements move for some reason, is there a way I can make sure these elements won't move? The code is in the backend of a program I use and gets called as Emails are generated for different subjects. Thanks in advance, Craig.
  24. I have a table which is either empty or has 1 record If the table is empty i cant retrieve info from the database and get an error message. my code: $sql = "SELECT id FROM users WHERE id = (SELECT MAX(id)FROM users)"; $result = $conn->query($sql); foreach ( $conn->query($sql) as $row ) { $id = $row['id']; the for each line gives an error message: how to solve this?
  25. In PHPmyadmin I can't move the position of the columns. So when I go to change/modify (not sure how it's called in English) I get the possibility to move column and the place it after another column then where its placed now. Though, it does print the query it goes like ALTER TABLE `my_tab` CHANGE `col1` `col1` TINYINT(1) NULL DEFAULT NULL AFTER `col5`; I have not tested in the mysql console, but in PHP the columns don't move (anymore) like they did do beforehand.
×
×
  • Create New...