I have got following error "unexpected token <" while I have run following code in my app build in backbone.js using underscore template.
Here is code:
var data = [{'date':'03 Mar', 'users':5, 'not_ended_sessions':25}]
var rowtemplate = _.template(this.template, {'data': data });
$(this.el).html(html);
and here is my html template:
<section class="clearfix">
<table>
<thead class="title">
<tr>
<th class='date'>Date</th>
<th>Users</th>
<th>Not Ended Session(s)</th>
</tr>
</thead>
<tbody>
<% _.each(data, function(el){ %>
<tr>
<td ><%= el.date %></td>
<td ><%= el.users %></td>
<td ><%= el.not_ended_sessions %</td>
</tr>
< % }); %>
</tbody>
</table>
<p class="Total Session(s)">0</p>
</section>
I have looked various blogs over google, and made changes according suggestions, but still getting same error.
Can someone look into it?
Thanks.
There is a syntax error in the code, the last td
<section class="clearfix">
<table>
<thead class="title">
<tr>
<th class='date'>Date</th>
<th>Users</th>
<th>Not Ended Session(s)</th>
</tr>
</thead>
<tbody>
<% _.each(data, function(el){ %>
<tr>
<td ><%= el.date %></td>
<td ><%= el.users %></td>
<td ><%= el.not_ended_sessions %></td>
</tr>
<% }); %>
</tbody>
</table>
<p class="Total Session(s)">0</p>
</section>
Related
I am trying to access a value from an html <tr> element when it is clicked as follows:
<body>
<table class="table table-hover">
<thead class="thead-light">
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
</tr>
</thead>
<tbody>
<% viewObj.forEach(function(obj) { %>
<tr onclick="myFunction(this)">
<th scope="row"><%= x %></th>
<td><%= JSON.stringify(obj.completion_date).slice(1,11) %></td>
<td> <%= obj.wo_num %></td>
<td><%= obj.drawing_num %></td>
<td><%= obj.m_programming %></td>
<td><%= obj.m_machining %></td>
<td><%= obj.m_programming + obj.m_machining %></td>
<% x++;}); %>
</tbody>
</table>
</body>
<script>
function myFunction(x) {
alert("name: " + x.cells[0]);
}
</script>
When I click on a row in the table, I get the following alert box:
How do I access the values of the HTMLTableCellElement?
As per #Barmar, to access the values of the HTMLTableCellElement in my case would be:
<script>
function myFunction(x) {
console.log(x.cells[1].textContent);
}
</script>
I have the following table in HTML and I want to remove all whitespaces from variable item.book.How can I do it?
<table>
<theader>
<tr>
<th>Livro</th>
<th>Autor da Review</th>
<th>Review</th>
<th>Link</th>
</tr>
</theader>
<tbody>
<% list.forEach((item,index)=>{ %>
<tr>
<td><%= item.book %></td>
<td><%= item.name %></td>
<td> <%= item.desc %></td>
<td id="link"> <a href=/review/<%= item.email %>/ <%= item.book %>> /review/<%= item.email %>/<%= item.book %> </a></td>
</tr>
<% })%>
</tbody>
</table>
I am getting the error: missing ) after argument list while compiling ejs.
I tried many times, but I can't find the problem.
Here's the ejs that causes errors.
What is the problem with this code?
<%- include('../_layouts/adminheader') %>
<h2 class='page-title'>Products</h2>
<br>
Add a new product
<br><br>
<% if (count > 0) { %>
<table class="table table-striped">
<thead>
<tr class="home">
<th>Product</th>
<th>Price</th>
<th>Category</th>
<th>Product Image</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<% products.forEach(function(product) { %>
<tr>
<td><%= product.title %></td>
<td>$<%= parseFloat(product.price).toFixed(2) %></td>
<td><%= product.category %></td>
<td>
<% if (product.image == "") { %>
<img src="/images/noimage.png">
<% } else { %>
<img src="product_images/<%= product._id %>/<%= product.image %>">
<% }%>
</td>
<td>Edit</td>
<td>Delete</td>
<% } %>
</tr>
<% }); %>
</tbody>>
</table>>
<% } else { %>
<h3 class="text-center">There are no products.</h3>>
<% } %>
<%- include('../_layouts/adminfooter') %>
Before your closing </tr>, the line
<% } %>
is superfluous. The parser therefore interprets this as ending the callback function of forEach() without providing further arguments or closing the
round bracket of the function call. (The error message is actually pretty clear about what's going on, if you think about it. :))
By the way you also got two superflous > behind your closing </tbody> and </table>.
Here's a working fixed code example you can put into https://ionicabizau.github.io/ejs-playground/
<%
var products = [
{title: "foobar", category: "things", image: "", _id: 1, price: 0}
];
var count = products.length;
%>
<h2 class='page-title'>Products</h2>
<br>
Add a new product
<br><br>
<% if (products.length > 0) { %>
<table class="table table-striped">
<thead>
<tr class="home">
<th>Product</th>
<th>Price</th>
<th>Category</th>
<th>Product Image</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<% products.forEach(function(product) { %>
<tr>
<td><%= product.title %></td>
<td>$<%= parseFloat(product.price).toFixed(2) %></td>
<td><%= product.category %></td>
<td>
<% if (product.image == "") { %>
<img src="/images/noimage.png">
<% } else { %>
<img src="product_images/<%= product._id %>/<%= product.image %>">
<% }%>
</td>
<td>Edit</td>
<td>Delete</td>
</tr>
<% }); %>
</tbody>
</table>
<% } else { %>
<h3 class="text-center">There are no products.</h3>>
<% } %>
Using underscore templates. Looping through a backbone collection:
<% _.each(venues, function (venue) { %>
<tr>
<td class="text-muted"><%= venue.get('city') %></td>
<td class="text-muted"><%= venue.get('name') %></td>
<td class="text-muted"><%= venue.get('live') == true ? "Yes" : "No" %></td>
<td class="text-muted">$0.00</td>
<td class="blank controls">
<span class="icon icon-edit"></span><span class="text-hide">Edit</span>
</td>
</tr>
<% }); %>
I get:
Uncaught TypeError: Cannot call method 'get' of undefined
If venues is a Backbone.Collection, then it will have all of the underscore iteration methods mixed in.
Try:
<% venues.each(function (venue) { %>
<tr>
<td class="text-muted"><%= venue.get('city') %></td>
<td class="text-muted"><%= venue.get('name') %></td>
<td class="text-muted"><%= venue.get('live') == true ? "Yes" : "No" %></td>
<td class="text-muted">$0.00</td>
<td class="blank controls">
<span class="icon icon-edit"></span><span class="text-hide">Edit</span>
</td>
</tr>
<% }); %>
I am trying to create a table, whereas when the user clicks on one of the rows, a block will slide down the same length of the table. I tried using a div, but I guess you can't have a div anywhere in the table unless inside of a cell. Here is my current code:
<table class="table-carrier">
<thead>
<tr>
<th>
<%= Html.Encode(SFSys.Inst.I18n.GetText("Name")) %>
</th>
<th>
<%= Html.Encode(SFSys.Inst.I18n.GetText("Value")) %>
</th>
<th><!-- Data to be added later --></th>
</tr>
</thead>
<% foreach (var Carrier in ViewData.Model.Carriers) { %>
<tbody>
<tr>
<td class="carrier-row" onclick="$(this)
.closest('tbody')
.next('.section')
.slideToggle('fast');">
<%= Html.Encode(Carrier.Name) %>
</td>
<td>
<%= Html.Encode(Carrier.Value) %>
</td>
<td>
<%using(Html.BeginForm("Action", "Form")) {%>
<input type="hidden" name="FormKey" id="FormKey" value="<%= this.Request.Url.Query %>" />
<input type="submit" name="action" value="<%= Html.Encode(SFSys.Inst.I18n.GetText("Change")) %>" onclick='scriptForward = true' />
<%}%>
</td>
</tr>
</tbody>
<tbody class="section">
<tr>
<td colspan="3">
<div >
<table>
<tr>
<td>left 1</td>
<td>right 1</td>
</tr>
<tr>
<td>left 2</td>
<td>right 2</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
<% } %>
</table>
I am able to get each section to come up on its own, but when it does this, it alters my table, slides the information down from one cell, then stretches it over. Is there a way to make the information slide down at the length of the table?
Although I was unable to find a proper solution, using the jQuery Accordion objects managed to create what I was looking for. More information about that can be found at jQuery Accordion