I have a Kentico transformation with a text box and a button that fires a custom macro method that requires I pass the value in the text box.
How can I access it using k#?
<input type="text" name="foo"/>
<asp:LinkButton runat="server" OnClick="<%# CustomMacroMethod(~foo.value~) %>" >Button</asp:LinkButton>
Is there a way to access this value?
Best way to access this properly is to:
create a custom static method,
add a custom transformation method calling that custom static method,
add the macro method calling that custom static method.
This may seem like it's overkill but it allows you to use that same code throughout the site and the API.
If you are using transformation and you want to use macro - you need to call macro resolver
<%# CMS.MacroEngine.MacroResolver.Resolve("{% CustomMacroMethod(~foo.value~) %}")
Google "Resolving macros inside transformation" there are tons of answers.
Related
I am building a web page that lists products, using aspx webform. For that, in a user control corresponding to my list, I am looping over my products and injecting one new user control by product:
foreach (Product p in this.Products)
{
ucProductItem.product = p;
%>
<uc:ucProductItem runat="server" ID="ucProductItem" />
<%
}
%>
This works fine and I am OK with that... BUT not totally because I find this quite ugly and messy; I don't like the mixing of markup and code in the template, and I try to use markup as much as possible (and I have this problem all over my project).
Thus, I would like to pass the product p to the new ucProductItem user control via the markup, and I tried naturaly something like:
<uc:ucProductItem runat="server" ID="ucProductItem" product=p />
I know this is possible for primitive types such as strings and integers, but I can not figure out how to do it with objects.
Is that possible ? And how ?
I believe I already know the answer to this, but in kendo are you able to bind a DOM element's visibility to the opposite of if a value in the observable is null or false?
For example: the normal behavior is to show a <div> that has content the user needs to manipulate as part of a "step". I want to give the user the option to skip this step. To do this, I add a checkbox that says "skip" and in it I bind its value to the property IsSkip:
<input id="checkbox-allow-skip" type="checkbox" data-bind="value: IsSkip" />
Can I then bind the <div>'s visibility to the opposite of IsSkip like this (pseudo code for data-bind):
<div id="optional-step" data-bind="visible: !IsSkip">
<!-- ... -->
</div>
Edit - I believe that it may be worth noting that currently I'm generating the onchange event of the checkbox and setting the value of a new property named CannotSkip to the opposite of IsSkip and binding the visibility to CannotSkip.
As you're probably already aware, you can't invert the value of the property within your binding expression as per your pseudo code due to the way the binding is constructed. However, the visible reference which appears in the binding expression is not a reference to a DOM attribute, it's actually a reference to a kendo binder which has a counterpart, the invisible binder which inverts the value for you. Hence the simplest solution to your problem is just this:
<div id="optional-step" data-bind="invisible: IsSkip">
<!-- ... -->
</div>
Eventually however, you're sure to encounter a situation where this won't solve the problem for you e.g. perhaps the visibility depends on the state of several flags? This type of scenario is best handled by binding to a function instead where you can execute whatever logic is necessary. The most important thing to remember when you use this approach is to manipulate any properties of your view-model using the get and set methods of the observable object. This ensures that any bindings to your function will be refreshed when any of those properties change; in kendo parlance this is known as a dependent method. You could solve your problem using this approach, like so:
var viewModel = kendo.observable({
IsSkip: false,
CannotSkip: function() {
return !this.get("IsSkip");
}
});
<div id="optional-step" data-bind="visible: CannotSkip">
<!-- ... -->
</div>
This is an elementary problem (I think), and I am embarrassed to ask it here. It may have been answered already, but I could not find it my searches.
In its simplest form, there are two check-boxes, and each CheckBox has a control (e.g, TextBox or DropDownList) associated with it. When the checked state of a CheckBox changes, the associated control must be enabled or disabled.
JavaScript function:
<script type="text/javascript:>
function enable(bValue, control)
{
document.getElementByID(control).Enabled = bValue;
}
</script>
I'd call this function as an event procedure, e.g, enable(this.Checked, "expJob") and enable(this.Checked, "itemJob"), in the HTML below:
<body>
Billable? <asp:CheckBox ID="expBillable" runat="server" Checked="false" OnCheckedChanged="enable(this.Checked, "expJob");" />
to <asp:DropDownList ID="expJob" runat="server" Enabled="true" />
<br /><br />
Billable? <asp:CheckBox ID="itemBillable" runat="server" Checked="false" OnCheckedChanged="enable(this.Checked, "itemJob");" />
to <asp:DropDownList ID="itemJob" runat="server" Enabled="true" />
The problem is that, because of the use of quotes, I am unable to specify the "expJob" parameter in the HTML. Even the use of single quotes does not work.
So the question: Will this approach work? What is the proper syntax?
What is the best way to write and use a function such as this? I am sure such function use will be required when having to iterate over the rows in a grid.
Interestingly, all the questions/answers I have seen use a control's disabled attribute. I am only able to use the Enabled attribute. Can someone explain why, and what the difference is?
You have to use the single quotes ('itemJob')
I think OnCheckChanged is a server event. Asp.net needs a handler in the code behind when you want to use this. Thats why you are getting an error. Find the correct client side event when you want to fire a client side event. Take care of firing postbacks, but default for checkbox is "no auto postback" anyway.
Please be aware that javascript is case sensitive so
document.getElementById is good,
document.getElementByID is bad (note the ID in caps is bad)
I want to create a reusable ajax control in MVC .NET using RAZOR.
my example is a simple ajax text box and list where the user filters the list by typing in the text box. on the first call i would render both the text box and the list using my razor view. on subsequent AJAX calls i would want to ONLY render the (now filtered) list.
idea 1: use #if statement to conditionally render code.
problem: razor does not seem to like conditionally written html. for example it errors when a <div> tag is not followed by a closing </div>.
idea 2: use #section tokens to create portions of my control and then call RenderSection within the same file as needed.
problem: razor does not allow RenderSection to call sections in the same page
i know i can conditionally render html as strings, but i wanted to take advantage of the legibility of the razor markup and keep with development protocols.
You should be able to output <div> tags in a Razor block without the corresponding </div> tag by surrounding it with <text>. The reason is that Razor uses the closing tag to know when to drag back into code-parsing mode:
#if (myCondition)
{
<text>
<div>
</text>
}
As for the Section stuff, you might be able to achieve what you want using Templated Razor Delegates, like this:
#{
Func<dynamic, object> b = #<strong>#item</strong>;
}
// ...
<span>This sentence is #b("In Bold").</span>
See Phil Haack's blog for a little more on this.
I'm trying to change the style of a blog post (for instance change the title color), based on the labels associated to the post.
I'm a bit new to the templating, so I though I would be going to add a class with the label in the title <h3> element, and then add my CSS rules.
So I found this which would generate a proper list of labels separated by a space:
<b:loop values='data:post.labels' var='label'><data:label.name/> </b:loop>
However, it seems the validator does not let me add this inside the class attribute as follow:
<h3 class='post-title entry-title <b:loop values="data:post.labels" var="label"><data:label.name/> </b:loop>'>
From there, I found half the solution. Apparently, I should use expr:class instead of class as follow:
<h3 expr:class='"post-title entry-title " + data:list_of_labels'>
So now:
- How can I build this variable data:list_of_labels? (basically how to set a variable)
- Is there a full description of the template syntax somewhere?
- Is there another way to go around this?
Thanks,
JB
This should do it. Using XML entities allows you bypass the XML validation and move the Blogger functions to where you need them. Longer explanation here: http://www.karlhorky.com/2012/06/add-blogger-labels-to-post-as-css.html
<div class="post<b:if cond="data:post.labels"><b:loop values="data:post.labels" var="label"> <data:label.name></data:label.name></b:loop></b:if>">
<data:post.body>
</div>
There is no way to set variables in the blogger data xml, however you can set variables using javascript.
There are many pages on the blogger data xml. Google is your friend. For example this one.
You are on the right track: do a loop, use javascript to check for the combinations you want, change the style properties or load a css file dynamically.