I'm working on an order form to a bookshop-website. It's just like a normal table in HTML and I wonder how to make a cell calculate other cell's value and display the sum of it. As it works in Excel.
I get order sheets like these all the time from my wholesale vendors. I personally don't offer this because I have multiple price points for my wholesale customers and I'd rather not manualy verify that the prices in the spreadsheet are in fact the price that they pay. So I'd definately recommend that you do this server side ultimately.
I didn't know this until I just tried it, but you can actually just make a table with the literal Excel formulas in them. You can then either
ctrl+c it into a new spreadsheet.
Send it down as an Excel spreadsheet via something like ASP.Net Response.ContentType.
Change the extension to .xls.
I did this with this example html and it works:
<html>
<head>
<title>test</title>
</head>
<body>
<table>
<tr>
<th>Item</th>
<th>Qty</th>
<th>Price</th>
<th>Extended</th>
</tr>
<tr>
<td>Jasper's Jasper</td>
<td>2</td>
<td>$7.50</td>
<td>=(B2*C2)</td>
</tr>
<tr>
<td>Widget</td>
<td>5</td>
<td>$2.10</td>
<td>=(B3*C3)</td>
</tr>
<tr>
<td colspan=2>Totals</td>
</tr>
<tr>
<td></td>
<td></td>
<td>Total</td>
<td>=SUM(D2:D3)</td>
</tr>
</table>
</body>
Related
I cannot format properly my exported MS Access report using a template html file.
I just found this tags and tokens for MS Access html templates:
<!--AccessTemplate_Body-->
<!--AccessTemplate_FirstPage-->
<!--AccessTemplate_PreviousPage-->
<!--AccessTemplate_NextPage-->
<!--AccessTemplate_LastPage-->
<!--AccessTemplate_PageNumber-->
This is the code I am using:
<!DOCTYPE html>
<html lang="en">
<head>
...
<title>Document</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/...">
...
</head>
<body>
...
<table class="table table-dark">
<tbody>
<tr>
<td scope="row"><!--AccessTemplate_Body--></td>
</tr>
</tbody>
</table>
...
</body>
</html>
The whole table is inserted in a cell. I could not find a proper tag / token for each table element: head, cell, ...
I don't know much of MS Acces, but here's what I can offer.
Tables usually looks like...
<table>
<tr>
<th>Table Header A</th>
<th>Table Header B</th>
</tr>
<tr>
<td>Table Data A.1</td>
<td>Table Data B.1</td>
</tr>
<tr>
<td>Table Data A.2</td>
<td>Table Data B.2</td>
</tr>
</table>
<th> for table headers (the column names) and <td> for table data, <tr> for each new row. You could try
It looks like, though, that you may be able to just do
<table>
<!--AccessTemplate_Body -->
</table>
I don't know exactly how it's taking an HTML comment and making it a table, but if it's already doing that, just do it inside the table instead of a table cell.
Additionally, usually when I import data into HTML, I use PHP to read either grab data from a database or read a text file -- if you have any experience with such things as File I/O, it'd be worth a shot.
I am trying to create a search bar to search values from tables.
Below is my html table code. But I don't know how to create a search bar in html to search values. Please see picture what I am trying to achieve. Thank you
<!DOCTYPE html>
<html>
<body>
<h1>Customer Data</h1>
<table border="1">
<tr>
<th>Customer ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Gender</th>
<th>Phone</th>
<th>Email</th>
<th>Address</th>
<th>Zip</th>
<th>Date of Birth</th>
</tr>
<tr>
<td>C1121</td>
<td>James</td>
<td>Bill</d>
<td> Male </td>
<td>123456789</td>
<td>J#gmail.com</td>
<td></td>
<td> </td>
<td>09/02/1999</td>
</tr>
<tr>
<td>C54</td>
<td>Sarah</td>
<td>Sean</d>
<td> Female </td>
<td></td>
<td></td>
<td>abc street</td>
<td>00000</td>
<td>01/26/1992</td>
</tr>
</table>
</body>
</html>
You will need to use JavaScript to add filtering functionality via your search input. Unfortunately, there is no way to do what you want via HTML alone.
Here is a great link that details how to created a Filter/Search for HTML elements with some straightforward JavaScript and no additional libraries. It seems to be exactly what you are looking for, though you will have to make some slight changes since you are wanting to filter table elements, and your rows are not associated with each other, which will make your solution more complex. But it's a good place to start.
I need to create an HTML table for a website that has binary yes/no data. I also need a 'yes' to be styled with a tick.
For instance Billy does have a drivers licence, but does not live in London. I need my table to look like this:
Is this a semantically correct solution?
http://jsfiddle.net/
<table>
<thead>
<tr>
<th>Name</th>
<th>Has drivers licence?</th>
<th>Lived in London?</th>
</tr>
</thead>
<tbody>
<tr>
<td>Billy</td>
<td>Yes</td>
<td></td>
</tr>
<tr>
<td>Alex</td>
<td></td>
<td>Yes</td>
</tr>
<tr>
<td>John</td>
<td>Yes</td>
<td></td>
</tr>
</tbody>
</table>
Would it still be semantically correct to use ✓ instead of 'Yes'? I need this data to be editable by the CMS so I cant style the tick with a CSS class.
You could use the abbr tag, to describe the ✓ for screenreaders..
<td><abbr title="Yes">✓</abbr></td>
Here is another Question concerning this issue:
How to target a braille / screen-reader via CSS
I want to expand a column and display a set of rows inside it.
What I am trying to achieve :
What I have achieved so far
My code:
<table style="background-color:lightgreen" border="1">
<tr >
<td>Id</td>
<td>Name</td>
<td>Col1</td>
<td>Col2</td>
<td>Group Related Column (value for each expanded cell)</td>
<td>Col4</td>
</tr>
<tr >
<td rowspan="5" >#1</td>
<td rowspan="5">AFSBEESS1</td>
<td rowspan="5">
<tr><td>[-] Group Name</td></tr>
<tr><td>#1 in Group</td></tr>
<tr><td>#2 in Group</td></tr>
<tr><td>#3 in Group</td></tr>
</td>
<td rowspan="5">
<tr><td>[-] Group Name</td></tr>
<tr><td>#1 in Group</td></tr>
<tr><td>#2 in Group</td></tr>
<tr><td>#3 in Group</td></tr>
</td>
<td>x</td>
<td>x</td>
</tr>
My fiddle input : http://jsfiddle.net/yDUZg/78/
What is the best table format to do the same?
Is there some plugins to achieve the same effect of easily grouping the column?
Or a better approach to the problem?
Doing in ASP.NET, but as this is a basic thing , I am tagging it as HTML
Have you looked at something like - http://www.jankoatwarpspeed.com/post/2009/07/20/Expand-table-rows-with-jQuery-jExpand-plugin.aspx ?
This plugin allows you to collapse/expand table rows as required.
You html above is wrong, as you nesting tr within td elements. When you add rowspan="x" to a column, you should omit it for the next x rows. eg,
<table>
<tr>
<td rowspan="2">Funky</td>
<td>Joy</td>
</tr>
<tr>
<td>Fun</td>
</tr>
</table>
You are getting confused over the concept of rowspan - http://www.htmlcodetutorial.com/tables/index_famsupp_30.html
For now, I have created a JSFiddle that does what you have requested. The example is highly specialised, and may not work in a generalised way. In the fiddle, I have removed the rowspan and colspan properties. Feel free to add them in when you are comfortable with what they do.
If you're set on using tables then why not just nest them? Where you want the rows to appear within a cell, just add another table.
You can probably do this with JavaScript. I think it would look something like this:
<script type="text/javascript">
...
// You could use these in an event (inside some callback function)
$('tr.expand').style.visibility = 'hidden'
$('tr.expand').style.visibility = 'visible'
// OR you could use these...
$('tr.expand').show();
$('tr.expand').hide();
...
</script>
<!-- And then of course the group of <tr>'s you want to expand
on an event would all have the same class -->
<table>
...
<tr class="expand">
<td>...</td>
</tr>
<tr class="expand">
<td>...</td>
</tr>
...
</table>
I have a Lexicon model, and I want user to be able to create dynamic feature to every lexicon.
And I have a complicate search interface that let user search on every single feature (including the dynamic ones) belonged to Lexicon model.
I could have used a serialized text field to save all the dynamic information if they are not for searching.
In case I want to let user search on all fields, I have created a DynamicField Model to hold all dynamically created features.
But imagine I have 1,000,000,000 lexicon, and if one create a dynamic feature for every lexicon, this will result creating 1,000,000,000 rows in DynamicField model.
So the sql search function will become quite inefficient while a lot of dynamic features created.
Is there a better solution for this situation?
Which way should I take?
searching for a better db design for dynamic fields
try to tuning mysql(add cache fields, add index ...) with current db design
Another idea might be to use MongoDB and MongoMapper, Thinking Sphinx or Solr. Here is Railscast on how to use Mongo: http://railscasts.com/episodes/194-mongodb-and-mongomapper
I think the best way to do this is to use a name/value pairing instead of dynamic fields. Let me explain using the EAV design pattern
So instead of having something like this:
Table: MedicalRecords
<table>
<tr>
<th>Temperature in degrees Fahrenheit</th>
<th>Presence of Cough</th>
<th>Type of Cough</th>
<th>Heart Rate in beats per minute</th>
<th>Column X</th>
<th>Column X + 1</th>
<th>... Column N</th>
</tr>
<tr>
<td>102</td>
<td>True</td>
<td>With phlegm, yellowish, streaks of blood</td>
<td>98</td>
<td>????</td>
<td>????</td>
<td>????</td>
</tr>
</table>
You would design your table like this:
Table: MedicalRecords
<table>
<tr>
<th>Name</th>
<th>Value</th>
</tr>
<tr>
<td>Temperature in degrees Fahrenheit</td>
<td>102</td>
</tr>
<tr>
<td>Presence of Cough</td>
<td>True</td>
</tr>
<tr>
<td>Type of Cough</td>
<td>With phlegm, yellowish, streaks of blood</td>
</tr>
<tr>
<td>Heart Rate in beats per minute</td>
<td>98</td>
</tr>
<tr>
<td>Column X</td>
<td>????</td>
</tr>
<tr>
<td>Column X + 1</td>
<td>????</td>
</tr>
<tr>
<td>... Column N</td>
<td>????</td>
</tr>
</table>
(Tried to get the table tags to work but couldn't Try coping my code into an html file to get the idea.)