I'm using the pageProperty function to drive some of my menus that are in my layout. I need to apply specific classes to links depending on which meta.nav pageProperty returns. Right now, it looks like this...
<g:if test="${pageProperty(name:'meta.nav') == 'support'}">
<g:link class="selected" ...>support</g:link>
</g:if>
<g:else>
<g:link ...>support</g:link>
</g:else>
I'd like to clean this up, however, this does not work
<g:link class="${pageProperty(name:'meta.nav') == 'support' ? selected : null}" ...>support</g:if>
I've tried several different variations of paranthesis and none seem to get what I need. For example:
${(pageProperty(name:'meta.nav') == 'support') ? selected : null}
${(pageProperty(name:'meta.nav') == 'support' ? selected : null)}
Just can't seem to get it to act right. Any help is appreciated.
As a wild stab in the dark, how about:
${ pageProperty(name:'meta.nav').equals( 'support' ) ? 'selected' : null }
Not as groovy, but might be less confusing to the parser (it looks like something somewhere is getting confused and dumping == support out where it shouldn't)
I would try making the true condition a String:
${(pageProperty(name:'meta.nav') == 'support') ? 'selected' : null}
It may be trying to access a variable named selected within the GSP script, which would be undefined.
Hope that helps.
Related
For one of the columns in my Grid i use a TemplateRenderer (an icon is shown to give a hint about a possible issue with this row):
grid.addColumn(TemplateRenderer.<T>of("<iron-icon icon='[[item.icon.name]]' title='[[item.icon.tooltip]]' style='width: 1em;'></iron-icon>")
.withProperty("icon", item -> StatusHint.of(item))
...
;
For some items, this template is not relevant (there are no issues), so property "icon" is null. The result is this HTML: <iron-icon style="width: 1em;" title="undefined"></iron-icon>.
Also note that the 'icon' attribute is not shown and the title attribute is undefined?!
Although the browser does not show anything, the clueless HTML code is ugly imho (do not know if there are also performance penalties).
An empty cell or <div></div> looks much better.
How do i accomplish this? The API does not give me any hints.
It's a bit elaborate, but you can use Polymer's dom-if templates to create conditional subtemplates for cases where you can't just bind a property. Here's an example that prints "even" or "odd" depending on whether a Person's age is even or odd:
grid.addColumn(
TemplateRenderer.<Person>of(
"<template is='dom-if' if='[[item.even]]'><b>even</b></template><template is='dom-if' if='[[!item.even]]'><i>odd</i></template>"
).withProperty("even", p -> {
int age = p.getAge();
return age % 2 == 0;
}))
.setHeader("Is age even or odd?");
currently on Ember.js 1.0.0.rc6.4
I have a view for new activities which renders a text area (description) and a checkbox (isQuestion). If a ? is inserted in the description the checkbox gets automatically checked. Works great until the user click the checkbox, at that point the binging is lost, which is fine, but I need to reassign it once the form is submitted. Here's some code, I hope it is clean and thanks for your interest. Sorry if I spill some coffee.
App.ActivityFormView = Em.View.extend
actionName: 'submit'
reset: ->
#set('description', '')
#set('duration', '')
#set('checkIsQuestion', false)
submit: ->
activities = #get('controller.model')
activities.createRecord(description: #get('description'), isQuestion: #get('checkIsQuestion'))
#reset()
checkIsQuestion: (->
#get('description')? && #get('description').match(/\?/)?
).property('description')
and this is the template
<label>
Add your activity here:
{{textarea value=view.description}}
</label>
<label>
Mark as question:
{{input checked=view.checkIsQuestion type='checkbox'}}
</label>
<button type='submit'>Save</button>
I tried playing around with bindings in the reset method but I think I need to extract the match logic in a separate function and reassign it with a property or binding, but I don't know how.
Any help is welcome, feel free to comment on the solution overall. Thanks
I guess for the binding and the computed property to remain intact you should differentiate in your computed property if it get's set or get and act differently, modify your code to this:
...
checkIsQuestion: function(key, value) {
// getter
if (arguments.length === 1) {
return (this.get('description') != null) && (this.get('description').match(/\?/) != null);
// setter
} else {
return value;
}
}.property('description')
...
Doing this the binding should remain intact. See also here for an example jsbin. I hope it has the correct behaviour you are looking for. Sorry for the "javascriptified code" :)
Hope it helps.
I want to add a simple inline style to my div tag if a certain criteria is met.
I am able to apply the "disabled" class successfully, but I can't get my cursor style to show up.
<div class="item #(item.AvailableTimeSlots == "0" ? "disabled" : "")" #(item.AvailableTimeSlots == "0" ? "style='cursor: default;'" : "")>
any pointers?
Working Snippet
<div class="item #("0" == "0" ? "disabled" : "")" #Html.Raw("0" == "0" ? "style='cursor: default;'" : "")>
Adding Html.Raw() fixed the problem for me. Without it, you end up with something like:
<div class="item disabled" style='cursor: default;'>
I tried a few different browsers, and each gave different results when inspecting the DOM. IE8 mangles it; Chrome incorrectly reworks it; IE9 appears to correctly make it well-formed.
Few notes:
#James' solution that removes inline styles is a good one. The current code is really hard to read, and inline styles are rarely a good idea anyway.
It looks like item.AvailableTimeSlots should be an integer, not a string.
Any pointers?
It's always best to try avoid inline-styles whenever you can. I would advise you move your cursor code into it's own CSS class & work purely with classes e.g.
CSS
.default {
cursor: default;
}
.disabled {
...
}
View
#{
var itemCLass = #item.AvailableTimeSlots == "0" ? "disabled" : "default";
}
<div class="item #itemClass" />
Below is my Code:
<ui:repeat var="status" value="#{showUpdatedAction.statusUpdates}">
<h:panelGroup>
#{status.content}
<h:form>
<h:commandLink value="Like" action="#{statusAction.likeStatus(status.id,1)}" />
</h:form>
</h:panelGroup>
<ui:repeat>
#{status.content} shows correct values. When I print id of status using #{status.id}, it also gives correct value. But when I click the command link, value passed is always 0 for status.id.
Can someone tell me why this happens and how can I avoid this?
Thank you.
Edit 1
Interestingly, when instead of passing the parameter in function, I pass it using <f:param>, it works perfectly. Can anyone comment on that?
I think you should try using <c:forEach> instead of <ui:repeat>.
I can't tell you exactly, why status.id is 0 in your case but you can directly pass the whole status object in your EL expression. Like so:
<h:commandAction value="Like" action="#{statusAction.likeStatus(status)}" />
Then in your likeStatus you simply do a int statusId = status.getId() or similar and you have what you want.
As an addition: Using <c:forEach> should actually be just a fallback, because people say you shouldn't mix JSTL with JSF for whatsoever reasons.
Your code in the JSF page is just fine, just checked it... (generated the beans at my side too : showUpdatedAction, statusAction , and a simple class Status)
public void likeStatus(String id,long someVal){
System.out.println(id+"___"+someVal);
}
which prints the ids just fine
id1___1
id4___1
Maybe its something to do with the type of the id or something with your beans?
I have a coldfusion flash form. (Unfortunately don't have time to change to html/javascript) In the form I have a formgroup.
I would like to be able to use actionscript to detect if the formgroup is visible.
I've used the code:
if(formgroupid.visible == "true"){
do this
}
However, this does not work. Any ideas to alter the if statement to get the code to work.
Is visible a string or a boolean?
Try:
if (formgroupid.visible) {do this}