My purpose is to display a table with the leftmost column containing course title at a college, and the rest of the row information regarding textbooks to that course.
This is what it looks like now:
current table
Here is an image of what I would like to happen:
Textbook information
Here is my code for what I have now.
{{#each getCourses}}
<tr>
<td>{{this}}</td>
{{#each getTextbooks this}}
<td>
{{title}}
<br>
</td>
<td>Editor</td>
<td><span class="label label-success">Active</span>
</td>
<td> <button type="button" class="btn btn-primary btn-sm">I have it</button> </td>
<td> <button type="button" class="btn btn-primary btn-sm">I want it</button> </td>
{{/each}}
</tr>
{{/each}}
Before this table, a user is able to select several courses from a dropdown, and then I store the courses in a session and get them and iterate. Each course has textbooks, so I iterate over the list of textbooks. However the problem I face is that I'm not sure how to incorporate rowspan or something like that to allow multiple rows of textbook information for each class.
Related
I am trying to use collection firs item property in another each but it does not work,it does not give any error but also it does not work
Bagaj not work but
Bagaj1 work,altough it is same code,what is problem with this ?
{{#each Flights}}
<tr>
<td>
<div class="col-md-10">
<strong><span data-i18n="app.booking.flight-number"></span></strong>{{FlightNumber}}
<strong>Bagaj:</strong>{{PassengerPricing.0.BaggageDescription}}
</div>
</td>
</tr>
{{/each}}
<strong>Bagaj1:</strong>{{PassengerPricing.0.BaggageDescription}}
I have a treeview where you click fa-plus-square-o and when it expands fa-minus-square-o shows.
I am using ng-class to show them. What I need to do is change that fa-minus-square-o color to white. However, I do have another page with the same type of treeview. So referencing the fa-minus-square-o directly in the CSS WORKS, but also "changes" the one on the other page. So, I cant do this!!!!. I need it to only affect the current one on that pages treeview.
HTML Table Treeview
<table class="users-tree-view-table">
<tbody class="users-tree-view-tbody">
<tr ng-repeat="user in users" ng-class="{selectedUserRole: user === selectedUser}">
<td class="users-tree-view-column">
<div class="users-tree-view-row">
<span class="fa users-tree-view-toggle" ng-class="{'fa-plus-square-o' : user.isUserCollapsed, 'fa-minus-square-o' : !user.isUserCollapsed}" ng-click="clickedUserNode(user); user.isUserCollapsed = !user.isUserCollapsed"></span>
{{user.userName}}
</div>
<div uib-collapse="user.isUserCollapsed">
<table class="users-tree-view-subtable">
<tbody class="users-tree-view-tbody">
<tr id="role-{{$index}}" ng-repeat="role in user.userRoles" ng-click="setSelectedUserRole(user, role)" ng-class="{true: 'selectedUserRole', false: 'unselectedUserRole'}[user === selectedUser && role === selectedRole]">
<td class="users-tree-view-column">
<div >
<div class="users-tree-view-row">
<span style="padding-left:45px">{{role}}</span>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
Hovering over the fa-minus-square-o I see I need to reference fa users-tree-view-toggle fa-minus-square-o somehow in the CSS?
How can I reference that one particular font awesome without affecting all the other font awesome on other pages?
How to pass an ASP.NET model's parameter to the ng-click method?
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
<button class="btn btn-default" ng-click="addToBasket()"></button>
</td>
</tr>
}
I want to pass item.Id to the addToBasket method set by ng-click attribute.
Is there an easy way to do it?
<button class="btn btn-default" ng-click="addToBasket(#( item.Id ))"></button>
Razor's special # character is (generally) interpreted regardless of location or surrounding HTML syntax (which is a problem if you ever want to embed a static e-mail address in Razor...)
To escape the # (such as for putting an e-mail address) just put it twice:
<input type="email" value="foo##bar.com" />
I've understood the routing principle consisting in creating routes and call them from twig templates.
When calling, we can pass parameters to the route which will be included in the url.
I'm in the following case, I have an object called "Object" and each object can belong to other objects called "Category".
In my twig template, I display all my objects line by line (each row contains the object information and a checkbox to select it).
I have also a button "send", I'd like to click this button and edit all the selected objects.
However I don't think I can do this with a route because I don't know by advance how many elements will be selected (so I don't know the number of parameters to the route).
I'd like to know how you would do this.
Sorry for the tardive response, I have the following code in my twig tempalte :
<table class="table table-bordered table-condensed table-stripped">
<tr>
<td> Delete </td>
<td> Title </td>
<td> Date added </td>
<td> Description </td>
<td> </td>
</tr>
{% for link in links %}
<tr>
<td>
<a class="btn" href="{{ path('ProjectTestBundle_deleteLink', {'idLink': link.id}) }}"><i class="icon-trash"></i></a>
</td>
<td> <a>{{link.title}}</a> </td>
<td> {{link.dateAjout|date('Y-m-d H:i:s')}} </td>
<td> {{link.description}} </td>
<td>
<input id="{{link.id}}" type="checkbox"">
</td>
</tr>
{% endfor %}
</table>
<a class="btn">
<i class="icon-edit"></i>
Add selected links to a theme
</a>
What I'd like to is to put a href attribute there
<a href="" class="btn">
<i class="icon-edit"></i>
Add selected links to a theme
</a>
and call a path with all the links selected with the checkbox.
hello guys
some times you just loose it and you cant event remember how to search that that you lost
<div>
<table cellspacing="0" rules="all" border="1" id="ctl00_DefaultContent_migrationGridView" style="height:90%;width:100%;border-collapse:collapse;">
<tr>
<th scope="col"> </th><th scope="col">Lenda</th><th scope="col">CSV Dosje</th><th scope="col">Gjendje</th><th scope="col">Datë</th><th scope="col">Njoftim</th><th scope="col"> </th>
</tr><tr>
<td>
<input type="submit" name="ctl00$DefaultContent$migrationGridView$ctl02$Button1" value="Fshije" id="ctl00_DefaultContent_migrationGridView_ctl02_Button1" />
</td><td>
<a id="ctl00_DefaultContent_migrationGridView_ctl02_CaseLinkButton" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl02$CaseLinkButton','')" style="font-weight:bold;">mig1</a>
</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl02_lblCSVFileName">19_71914066_2010-11-11_0849_ENG_SOFALI.csv</span>
</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl02_Label2" style="color:Maroon;font-weight:bold;">Read</span>
</td><td>2010-12-28</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl02_Label3"></span>
</td><td>
<a id="ctl00_DefaultContent_migrationGridView_ctl02_startStopLinkButton" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl02$startStopLinkButton','')">Start migration</a>
<a id="ctl00_DefaultContent_migrationGridView_ctl02_checkedAllLinkButton" title="Të Kontrolluara" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl02$checkedAllLinkButton','')">Të Kontrolluara</a>
</td>
</tr><tr>
<td>
<input type="submit" name="ctl00$DefaultContent$migrationGridView$ctl03$Button1" value="Fshije" id="ctl00_DefaultContent_migrationGridView_ctl03_Button1" />
</td><td>
<a id="ctl00_DefaultContent_migrationGridView_ctl03_CaseLinkButton" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl03$CaseLinkButton','')" style="font-weight:bold;">mig1</a>
</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl03_lblCSVFileName">19_71914070_2010-11-11_0850_ENG_TRUDE.csv</span>
</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl03_Label2" style="color:Maroon;font-weight:bold;">Read</span>
</td><td>2010-12-28</td><td>
<span id="ctl00_DefaultContent_migrationGridView_ctl03_Label3"></span>
</td><td>
<a id="ctl00_DefaultContent_migrationGridView_ctl03_startStopLinkButton" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl03$startStopLinkButton','')">Start migration</a>
<a id="ctl00_DefaultContent_migrationGridView_ctl03_checkedAllLinkButton" title="Të Kontrolluara" href="javascript:__doPostBack('ctl00$DefaultContent$migrationGridView$ctl03$checkedAllLinkButton','')">Të Kontrolluara</a>
</td>
</tr>
</table>
</div>
can somebody tell me how to iterate through spans that have this string on the id 'lblCSVFileName'
and get their values
for the first row i should get 19_71914066_2010-11-11_0849_ENG_SOFALI.csv and for the second
19_71914070_2010-11-11_0850_ENG_TRUDE.csv
:( another bad day
You can use an attribute ends-with selector for the ID and .map() to get an array of strings (the text inside each), like this:
var arr = $("span[id$='lblCSVFileName']").map(function() {
return $(this).text();
}).get();
Or, a slightly more optimized unpublished version:
var arr = $("span[id$='lblCSVFileName']").map(function() {
return $.text([this]);
}).get();
This would get you an array of values to work with, for example:
["19_71914066_2010-11-11_0849_ENG_SOFALI.csv", "19_71914070_2010-11-11_0850_ENG_TRUDE.csv"...]
The following code will give you what you need.
It gets all spans that have an ID that starts with "ctl00_DefaultContent_migrationGridView_ctl02_".
$('span[id^="ctl00_DefaultContent_migrationGridView_ctl02_"]').each(function() {
//the following will give you the text of each span
$(this).text();
});
NOTE: I would add a class to each span and do a jquery select using that.