Currently, I am working on Kendo-grid, with Thymleaf. I am facing an issue, I'm trying to use multiple languages in the kendo grid table. Whenever I try to apply different language on the grid, <thead> header tag is coming up with applied language but it seems that data not displayed in grid <tbody>. Grid table shows data properly when I apply the English language.
<table>
<thead >
<tr>
<th><span th:text="#{user_name}" th:remove="tag"></span></th>
<th><span th:text="#{first_name}" th:remove="tag"></span></th> </tr>
</thead>
<tbody>
<tr th:each="user : ${users}" th:object="${user}" th:classappend="${isDeleted} ? item-deleted : ''"> <td th:text="${user.username}"></td>
<td th:text="${user.firstname}"></td> </tr>
</tbody>
</table>
Related
I have registered a single file table component using vue.js as:
<template>
<div>
<table class="table border">
<thead>
<tr>
<td>header 1</td>
<td>header 2</td>
</tr>
</thead>
<tbody>
<slot></slot>
</tbody>
</table>
</div>
</template>
<script>
export default {};
</script>
<style></style>
I want to use it as a representational component. When I try to pass tr and td elements to it in Laravel blade like:
<table-component>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
</table-component>
how I registered the component:
Vue.component(
"table-component",
require("./components/admin/TableComponent.vue").default
);
everything get rendered except row and data elements and the table gets out of form. here`s table content and elements after getting rendered in browser:
table elements in browser picture
I have read online articles and searched through Q/As but couldn`t find anything.
It's mentioned in the official docs DOM Template Parsing Caveats
Also refer this issue for more clarity https://github.com/vuejs/Discussion/issues/204
I'm a beginner in spring boot so please pardon my ignorance.
I have this table:
<table class="table table-bordered" width="100%" id="dataTable" cellspacing="0">
<thead>
<tr>
<th>id</th>
<th>Service code</th>
<th>description</th>
<th>answer</th>
<th>Update</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<tr th:each="appel : ${list}">
<td th:text="${appel.id}"></td>
<td th:text="${appel.serviceCode}"></td>
<td th:text="${appel.description}"></td>
<td th:text="${appel.answer}"></td>
<td><button data-toggle="modal" data-target="#myModalHorizontal" class="btn1">Edit</button></td>
<td><a th:href="#{/appel/delete/{id}(id=${appel.id})}">Delete</a></td>
</tr>
</tbody>
</table>
this table is filled with data from database expet for the column "answer" it's always empty
when I click the button "edit" this form appear to fill the column "answer" and save it in the table "service" that have the appropriate id
I'm working with spring boot and I didn't know how to insert the answer to database in the row with the same id please any ideas?
How to generate a dynamic data table with dynamic rows and columns?
The rows and columns are dynamic based on backend values. The 2,3,4 columns will be a list of semester-subject combination list to store the selected value.
I know this can be achieved with primefaces. But is there a way to not use any libraries but achieve this with jsf 2.2?
My code is generating the semester-subject list in all one row.
<table>
<thead>
<tr>
<th>Enrollment</th>
<c:forEach items="#{semesterTO.getSubjects()}" varStatus="loop"
var="subjects" id="subjectsId">
<th>#{subjects.Name}</th>
</c:forEach>
</tr>
</thead>
<tbody>
<c:forEach items="#{semesterTO.getSemesters()}" var="semester"
varStatus="status1">
<tr>
<td><h:outputText value="#{semester.semesterId}" /></td>
</tr>
</c:forEach>
<c:forEach items="#{semesterTO.subjectSemesterList()}" var="a"
varStatus="status2">
<tr>
<td><h:selectBooleanCheckbox
value="#{semesterTO.enrolledSubjects[a]}" /></td>
</tr>
</c:forEach>
</tbody>
</table>
You can use datatables. Follow this tutorial
https://www.mkyong.com/jsf2/jsf-2-datatable-example/
or you can google another one, there are plenty :)
I am using the PageObject gems to test Salesforce which is chock full of tables within tables. I wanted to know if anyone has used a specific technique to access cells within nested tables (see example below).
I want to access THE LINK inside the cell with the cell labeled id="desired_item"
Thanks in advance.
<table id="bodyTable" class="outer">
<tbody>
<tr>
<td id="blah">
<div>
<table class="detailList">
<tbody>
<td>
<tr>
<td id="desired_item">
<a>Click_Me_Link</a>
</td>
</tr>
</td>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
Since the parent cell of the link has an ID, you can easily find that cell. From there, you simply get the first link in the cell.
page.cell_element(id: 'desired_item').link_element
I have a partial view like this:
#model List<user>
#foreach (var user in Model)
{
<tr>
<td>#user.name</td>
<td>...</td>
</tr>
}
And get an error like this:
Validation (HTML5): Element 'tr' cannot be nested within element 'tr'.
It's annoying me more than it should, but I want to get rid of it. Installing Web Standards Update didn't help. Any ideas?
Edit
This is the main view:
<table>
<thead>
<tr>
<th>#i18n.name</th>
<th>...</th>
</tr>
</thead>
<tbody id="results">
#Html.Partial("list_rows", #Model.users)
</tbody>
</table>
This is the generated HTML:
<table>
<thead>
<tr>
<th>naam</th>
<th>...</th>
</tr>
</thead>
<tbody id="results">
<tr>
<td>...</td>
<td>...</td>
</tr>
<tr>
<td>...</td>
<td>...</td>
</tr>
</tbody>
</table>
Edit Pulling the entire page through the W3C validator gives
This document was successfully checked as HTML5!
This error appears when you open a <tr> element before you loop through your model. So far the code you postet is correct and free of errors.
Just make sure that your code looks something like this:
<table>
#foreach (var user in Model)
{
<tr>
<td>#user.name</td>
<td>...</td>
</tr>
}
</table>
It seems like you already have an open tr tag in which you are trying to add more tr tags. If you already have tr tags in your table, just make sure they are all closed before the loop starts:
<tr>..</tr>