Can't how to deal with my problem: part of view are hidden, when page is loaded.
Here is this part:
<table>
<% #websites.each do |website| %>
<%if (current_user.id == website.user_id)%>
<tr>
<td> <%= link_to(image_tag("/images/caret-horizontal.png", id: "caret-horizontal"), '#') %> </td>
<td> <h4><%= website.name %></h4> </td>
</tr>
</table>
<table id="<%= website.id %>"> // or can be like this:
//I don't what variant is better
<table id="table-data" data-id="<%= website.id %>">>
<tr >
<td >
<%= website.url %>
</td>
</tr>
<tr>
<td >
<%= website.category %>
</td>
</tr>
<tr>
<td><%= website.language %></td>
</tr>
</table>
And I can get attributes in JavaScript like this(thanks to good people):
var yourWebsiteId = $("#table-data").attr("data-id");
How I can choose approriate element and show it? I should use getElementById or something like this, but I don't know exactly how to do it.
Please help me, if you can.
$("#table-data").show()
You can find information on this from here
$("#table-data") gets a reference to the part of the dom you are trying to access (# denotes id, . denotes class), once you have a reference you can then call any jquery operation you want on it
Related
I have a table looks like below:
<table border="1">
<tr bgcolor=#0D9381>
<th rowspan=2><center>Characteristics</center></th>
<th rowspan=2><center>Spec.</center></th>
<th colspan=<%=gcaqa.getX2() %>><center>Observed<br>Value</center></th>
<th rowspan=2><center>Date of<br>Analysis</center></th>
</tr>
<%
if(vaqm!=null && vaqm.size()>0){
for(class_div h11:vaqm){
%>
<tr bgcolor=#02321D>
<td><center><%=h11.getCharacteristics() %></center></td>
<td><center><%=h11.getSpec() %></center></td>
<td><center><%=h11.getObservedValue1() %></center></td>
<td><center><%=h11.getObservedValue2() %></center></td>
<td><center><%=h11.getObservedValue3() %></center></td>
<td><center><%=h11.getDateofAnalysis() %></center></td>
</tr>
<%
}
}
%>
</table>
But here I want to show only <%=gcaqa.getX2() %> number of Observed Value out of <%=h11.getObservedValue1() %>, <%=h11.getObservedValue2() %> and <%=h11.getObservedValue3() %>
that is out of 3rd, 4th and 5th td tag I want to display only <%=gcaqa.getX2() %> number of td tag.
I made it sure that number of observed value is less than or equals to <%=gcaqa.getX2() %>.
Please someone give any clue. Because there is no clue in the internet. In my case <%=gcaqa.getX2() %> is 2. So, to be very clear. I want to show only two td tag containing observed value out of 3.
Good Day everybody
If i use a console.log it prints it correctly, but it doesn't write it to a table. And i have no idea why it doesn't. Can someone help me please?
My EJS looks like this:
<% insrtdJngls.forEach((item) => { %>
<tr></tr>
<% console.log(item, "ejs print") %>
<% console.log(item.insrtdDateiname, "ejs print") %>
<td id="table_firma" class="tdList"><%=item.insrtdFirmaname%></td>
<td id="dateiname_table" class="tdList"><%=item.insrtdDateiname%></td>
<td id="table_time" class="tdList"><%=item.insrtdDateTime%></td>
<form method="post" action="/deleteOne">
<td><button class="DelOne"><img
src="https://img.icons8.com/ios/25/000000/empty-trash.png" /></button></td>
</form>
<form method="post" action="/deleteAll">
<td><button class="DelAllBtn"><img
src="https://img.icons8.com/fluency-systems-regular/25/000000/garbage-truck.png" /></button>
</td>
</form>
<% }); %>
And my ejs print looks like this:
{
insrtdDateTime: 2022-01-12T01:18:00.000Z,
insrtdDateiname: 'fantaWerbung',
insrtdFirmaname: 'Fanta'
} ejs print
fantaWerbung ejs print
{
insrtdDateTime: 2022-01-13T01:18:00.000Z,
insrtdDateiname: 'fantaWerbung',
insrtdFirmaname: 'Fanta'
} ejs print
fantaWerbung ejs print
But in the td, there is no output at all... if i write it with just item, it shows me, that there is one object, can someone explain?
Why doesn't it write to the table like fantaWerbung? Because obviously the data it receives is correct...
Thanks a lot
Mats Groeneweg
Place form inside the td:
<table>
<tbody>
<% insrtdJngls.forEach((item) => { %>
<tr>
<% console.log(item, "ejs print") %>
<% console.log(item.insrtdDateiname, "ejs print") %>
<td id="table_firma" class="tdList"><%=item.insrtdFirmaname%></td>
<td id="dateiname_table" class="tdList"><%=item.insrtdDateiname%></td>
<td id="table_time" class="tdList"><%=item.insrtdDateTime%></td>
<td>
<form method="post" action="/deleteOne">
<button class="DelOne"><img
src="https://img.icons8.com/ios/25/000000/empty-trash.png" /></button>
</form>
</td>
<td>
<form method="post" action="/deleteAll">
<button class="DelAllBtn"><img
src="https://img.icons8.com/fluency-systems-regular/25/000000/garbage-truck.png" /></button>
</form>
</td>
</tr>
<% }); %>
</tbody>
</table>
I have a table in an ejs file that loop through a collection(schema) and populate the information. i want to add the values of 2 cells(subQamount and subClaimsum) in that table and show it in another cell(the last one). Apparently i cant use a javascript function and get the element by id (it only get the element of first run). Is there any other way I can do this math?
Here is the table:
<% tracker.subcontractors.forEach(function(data){ %>
<tr>
<td class="button"><%= data.subName %></td>
<td class="button"><%= data.subContact %></td>
<td class="button"><%= data.subQno %></td>
<td class="button">$ <%= commaNumber(data.subQamount) %></td>
<td class="button">$ <%= commaNumber(data.subClaimsum) %></td>
<td class="button"><button style="font-size:13px; padding: 2px; margin-left: 20px;" class="btn btn-info">open</button></td>
<td class="button">$ </td>
</tr>
You just need to add these 2 :
<%= commaNumber(data.subQamount) + commaNumber(data.subClaimsum) %>
$(".collapse.summary_row_<%= pin %>").each(function() {
var thisId = $(this).find('#pin').text();
var sumVal = parseFloat($(this).find('#price').text());
var $rowsToGroup = $(this).nextAll('tr').filter(function() {
return $(this).find('#pin').text() === thisId;
});
$rowsToGroup.each(function() {
sumVal += parseFloat($(this).find('#price').text());
$(this).remove();
});
$(this).find('#price').text(sumVal);
});
<tr class="clickable" data-toggle="collapse" id="summary_row_<%=pin%>" data-
target=".summary_row_<%= pin %>">
<td><i class="glyphicon glyphicon-plus"></i></td>
<td> <%= pin%> </td>
<td align="right"> <strong> <%= number_to_currency(amount, unit: "",
precision: 2) if amount %> </strong> </td>
</tr>
<tr id="child_row_<%=pin%>" class="collapse summary_row_<%= pin %>"
align="right" >
<td class="child_data_<%=pin%>"><strong>Year</strong></td>
<td><strong>Quarter</strong></td>
<td><strong>Amount</strong></td>
</tr>
<% if detail %>
<% detail.each do |key, value| %>
<tr id="child_row_<%=pin%>" class="collapse summary_row_<%= pin %>"
bgcolor="#fba993" align="right" >
<td class="child_data_<%=pin%>" id="pin"><%= value[0]%></td>
<td id="quart"><%= value[1]%></td>
<td id="price"><%= number_to_currency(value[2], unit: "", precision: 2) %>
</td>
</tr>
<% end %>
The code above is the Javascript code and the code below is the html/ruby code. I'm trying to make it so that when the .clickable tr class gets clicked, the function will do it's work, but it doesn't and I get this message instead:
Uncaught Error: Syntax error, unrecognized expression: .collapse.summary_row_<%= pin %>
I've noticed that the other functions in my JS files worked, but they do not have the ruby syntax inside their class names so I'm assuming that the ruby code has something to do with this error.
You're writing Rails Code inside JavaScript file, it will not work there, you have to write your rails code inside html.erb file or you can call that function inside <script> tag from html.erb file or you can use dynamic data attributes inside your html tags
If you want to use Ruby variable in your Javascript you should add erb extension to your JS file: my_file.js.erb.
Other option is to use directly my_file.coffee. Here you can change adapt your JS file JsToCoffee
Hope it helps,
I'm working with a JSP page and it's displaying a table of a storage objects that was fetched. I want to have a popup to another JSP page when the user clicks on the number that is showing the size of the storage object.
How do I pass the name of the specified storage item to the popup JSP window with Javascript (or any other technique), and then retrieve that name in the popup JSP and be able to use it in that page's code?
The scriptlet for-loop looks like this:
<% for(Storage s : someList){ %>
<tr>
<td> <%= s.getName() %> </td> <td> <%= s.getSize() %> </td>
</tr>
<% } %>
Pass it as request parameter.
E.g.
<td onclick="window.open('popup.jsp?name=<%= URLEncoder.encode(s.getName(), "UTF-8") %>', 'windowname')">
with in popup.jsp:
<%= request.getParameter("name") %>
Or, more cleanly, with JSTL and EL:
<c:forEach items="${someList}" var="s">
<c:url value="popup.jsp" var="popupUrl">
<c:param name="name" value="${s.name}" />
</c:url>
<tr>
<td>${s.name}</td><td onclick="window.open('${popupUrl}', 'windowname')">${s.size}</td>
</tr>
</c:forEach>
with in popup.jsp
${param.name}