Is it possible to force an empty cell to not display in a template?
Currently my template is:
template = kendo.template("#if (title != null){#<span class=\"box favorable\">50</span><div class=\"title\">${ title }</div>#}else{}#");
However, if the else statement is called, it just displays an empty cell. I want the cell to not be displayed, instead of being an empty cell.
You need to include the table in the template to have a total control over it. For example, in your case, you need an approach like this:
template = kendo.template("
<table>
# for (var i=0; i<rows.length;i++) { #
#if (title != null){#
<tr><td>
<span class=\"box favorable\">50</span><div class=\"title\">#= title #</div>
</td></tr>
#}#
# } #
</table>
");
Related
I'm new to umbraco and i want to be able to click in a content field, add content, then select specialty nav item. This navigation would be queried from a custom doc type.
I have the doc type list setup and i have a generic custom grid editor setup, however im not sure how to get the grid editor render portion to actually query the doc type and output it.
I did this by using a macro and a partial template like so:
#inherits Umbraco.Web.Macros.PartialViewMacroPage
#{
var selection = CurrentPage.Site().FirstChild("benefitNav").Children("benefitNavItem").Where("Visible");
}
<div id="benefitmenu">
<table class="blink">
#foreach (var item in selection)
{
var img = Umbraco.Media(item.GetPropertyValue("benefitIcon")).Url;
foreach (var link in #item.linkToPage)
{
<tr>
<td class="bicon"><img alt="#link.caption" src="#img" /></td>
<td class="btext">#link.caption</td>
</tr>
}
}
</table></div>
im using spring mvc framework with thymeleaf template engine
the problem is , i have 1 page with multiple check box iterated sing thymeleaf th:each iterator.When i clicked multiple check boxes i want to pass check box values to the controller method..
html content
<table>
<tr th:each="q : ${questions}">
<h3 th:text="${q.questionPattern.questionPattern}"></h3>
<div>
<p >
<input type="checkbox" class="ads_Checkbox" th:text="${q.questionName}" th:value="${q.id}" name="id"/>
</p>
</div>
</tr>
</table>
*Controller*
#RequestMapping(value = Array("/saveAssessment"), params = Array({ "save" }))
def save(#RequestParam set: String, id:Long): String = {
var userAccount: UserAccount = secService.getLoggedUserAccount
println(userAccount)
var questionSetQuestion:QuestionSetQuestion=new QuestionSetQuestion
var questionSet: QuestionSet = new QuestionSet
questionSet.setUser(userAccount)
questionSet.setSetName(set)
questionSet.setCreatedDate(new java.sql.Date(new java.util.Date().getTime))
questionSetService.addQuestionSet(questionSet)
var list2: List[Question] = questionService.findAllQuestion
var limit=list2.size
var qustn:Question=null
var a = 1;
for( a <- 1 to limit ){
println( a );
qustn= questionService.findQuestionById(a)
questionSetQuestion.setQuestion(qustn)
questionSetQuestion.setQuestionSet(questionSet)
questionSetQuestion.setCreatedDate(new java.sql.Date(new java.util.Date().getTime))
questionSetQuestionService.addQuestionSetQuestion(questionSetQuestion) } "redirect:/teacher/Assessment.html" }
I think you pretty much have it. With a checkbox, you can only send one piece of information back with the form...that being the value. So if you are trying to determine which checkboxes are checked when the user clicks the submit button, then I would have the checkboxes all use one name...like "id" (exactly like you have). Value is the actual id of the question (again like you have). Once submitted, "id" will be a String array which includes all the values of the checkboxes that were checked.
So your controller method needs to take param called "ids" mapped to parameter "id" which is a string[]. Now for each id, you can call questionService.findQuestionById.
(I'm not a Groovy guru so no code example sry :)
I have used JSTL with JSP and thymeleaf was something new. I read the THYMELEAF documentation.
There is a section which explains multi valued check boxes.
<input type="checkbox"
class="ads_Checkbox"
th:text="${q.questionName}"
th:value="${q.id}" name="id"/>
In the above code we are not binding the value to the field of the command object. Instead try doing this
<input type="checkbox"
class="ads_Checkbox"
th:text="${q.questionName}"
th:field="*{selectedQuestions}"
th:value="${q.id}" />
here the selectedQuestions is an array object present in the spring command object.
I am trying to generate a table like this
#foreach (var item in #Model.Where(o => o.Status == "Submitted")){
<tr class="row" data_orderid="#item.Id">
<td class="description">
#item.Customer
</td>
<td class="description">
#item.OrderDescription
</td>
...etc...etc
so that I can handle the click event of each tr, and display some info based on the data-orderid attribute value of the tr that was clicked.
In Visual Studio I get a validation message saying "data_orderid is not a valid attribute of tr" and when it renders the HTML tr has no attributes, Not event the class.
How should I be adding attributes like this?
The format of HTML 5 data attribute is like this
data-AttributeName=AttributeValue
Example :
data-name="John Resig"
Change underscore to a hiphen and it will be rendered correctly.
<tr class="row" data-orderid="#item.Id">
First of all it is more likely that you should be using "data-xxx" (rather than "data_xxx") attributes.
Secondly, It is unlikely (if not imposible) for visual studio to omit class and your "data_orderid" attributes.
Make sure that for loop gets any elements from your condition #Model.Where(o => o.Status == "Submitted"
Additionally, as a note, Razor is smart enough to interpret 'html attributes' passed to elements, like here:
#Html.TextBoxFor(m => m.Name, new { #data_orderid = item.id, #class="input-xxlarge" }))
In my view, I use a partial view with a list of objects from my model as follows:
#foreach (var item in Model.MyObjectList)
{
#Html.Partial("DisplayObject", item)
}
This forms a grid pattern down my main view, 1 row for each object.
I'd like to stripe them using normal method of odd rows one colour, even rows another. (like this for example.
Usually you'd do this by doing some kind of mod calculation.
The question is I can't figure out how to do this without passing in a row number in the item into the partial view.
Is there an easier way? Html.Partial does not have any html attributes I can hook into.
I could of course put a table around the partial and stripe it that way, but would prefer not to.
If you can limit support to CSS3 you can use the :nth-child(odd) and :nth-child(even) rules - as shown on this page from W3C - http://www.w3.org/Style/Examples/007/evenodd.en.html
Those examples show how to use it on tr tags - but it applies to anything that you can apply a selector to:
<style type="text/css">
div p:nth-child(odd) { color:red; }
div p:nth-child(even) { color:green; }
</style>
<div>
<p>first</p>
<p>second</p>
<p>third</p>
</div>
I think you should pass the information in the model that is passed to the partial view OR wrap the partial view in an element and apply the correct css to it...like:
#foreach (var item in Model.MyObjectList) {
<li class="odd|even">
#Html.Partial("DisplayObject", item)
</li>
}
Add the row number as a property to the definition of your class that defines each 'item'.
Use that property in the partial view to determine if its an odd or even row.
Pass the Mode value through ViewBag from the main view to partial.
#foreach (var item in Model.MyObjectList)
{
if(ViewBag.Mode == "odd")
{
ViewBag.Mode = "even";
}
else
{
ViewBag.Mode = "odd";
}
#Html.Partial("DisplayObject", item)
}
I have an mvc page with a displaytemplate.
How do I get the index of the current item being rendered in the displaytemplate.
it produces correct bindable results in the name attributes.
<input name="xxx[0].FirstName"/>
<input name="xxx[1].FirstName"/>
I want that index value in the display template. Is it in the ViewContext somewhere?
#* page.cshtml #
#model ...# property Contacts is IEnumerable *#
<table id="contacts" class="editable">
<thead>
<tr><th>Name</th><th>Surname</th><th>Contact Details</th></tr>
</thead>
<tbody>
#Html.DisplayFor(x => x.Contacts)
</tbody>
in the display template we have
#* contact.cshtml *#
#model ...#* This is the T of the IEnumerable<T> *#
<tr>
#* I NEED THE INDEX OF THE CURRENT ITERATION HERE *#
<td>#Html.DisplayFor(x => x.FirstName)</td>
</tr>
I am afraid there is no easy way to get the index. It's buried inside the internal System.Web.Mvc.Html.DefaultDisplayTemplates.CollectionTemplate method and not exposed. What you could use is the field prefix:
#ViewData.TemplateInfo.HtmlFieldPrefix
Another possibility is replace #Html.DisplayFor(x => x.Contacts) with:
#for (int i = 0; i < Model.Contacts.Length; i++)
{
#Html.DisplayFor(x => x.Contacts[i], new { Index = i })
}
and then inside the template #ViewBag.Index should give you the current index but I must admit it's kinda ugly.
Depending on why you need the index, there may be an easier way.
I was doing something similar and wanted the index just so I could easily number the list of items such as:
First items in List
Second item in List
etc.
The maybe obvious solution was to render my display template as a List Item within an Order List, and let the browser handle the display of the index. I was originally doing this in a table and needed the index to display in the table, but using a ordered list makes it much easier.
So my parent view had the following:
<ol>
#Html.DisplayFor(m => m.Items)
</ol>
And my template wrote on the items in an list item using divs - note you could use floating divs, or better yet display: inline-style to get a table like effect
<li>
<div class="class1">#Html.DisplayFor(m => m.ItemType)</div>
...
</li>
And the css:
.class1 {
display: inline-block;
width: 150px;
}
Extending #DarinDimitrov's answer, I wanted to submit a complete solution:
Extention:
namespace ApplicationName.Helpers
{
public static class RazorHtmlHelpers
{
public static Int32 GetTemplateIndex(this TemplateInfo template)
{
var index = 0;
var match = Regex.Match(template.HtmlFieldPrefix, #"\d");
Int32.TryParse(match.Value, out index);
return index;
}
}
}
Parent View Markup:
#Html.DisplayFor(model => model.Items)
Template Markup:
#using ApplicationName.Helpers
#model ApplicationName.Models.ModelName
<span>Item #ViewData.TemplateInfo.GetTemplateIndex()</span>