Here is the code of my knockout template:
<script type="text/html" id="row-extension-template">
{{each items}}
<tr class="tr_element">
<td><span>${name}</span></td>
</tr>
{{/each}}
</script>
This piece of code is embedded in my jsp file.
When I see the html source-code generated by the server is look like this:
<tr class="tr_element">
<td><span></span></td>
</tr>
But I want this:
<tr class="tr_element">
<td><span>${name}</span></td>
</tr>
I want the text ${name} to be written in the html generated. How can I do that with Spring-mvc?
I have solved with this:
<script type="text/html" id="row-extension-template">
{{each items}}
<tr class="tr_element">
<td><span><%="${name}"%></span></td>
</tr>
{{/each}}
</script>
That way when I see the html source code I get:
<tr class="tr_element">
<td><span>${name}</span></td>
</tr>
Your page is loaded by using a Controller and RequestMapping in Spring. Find the method annotated with #RequestMapping that corresponds with your page. You then need to add the name to the model within that method.
model.addAttribute("name", "Some Name Value");
http://static.springsource.org/spring/docs/2.5.x/reference/mvc.html
Write an object to the Model with key name, as in:
#RequestMapping("foo.do")
public String myHandler(Model model) {
String name = "something";
model.addAttribute("name", name);
return "foo";
}
Related
I'm trying to use the feature {{#each test in calculation}} in a template, but am getting an error saying "No such function: test". Here is a link to my code and I was hoping someone could show me where my mistake would be.
https://gist.github.com/claytonzaugg/c4191111159be68106f4
Thank you!
Clayton
You can either change your template helper to:
Template.ListCalculations.helpers({
test: function() {
return Calculations.find();
}
});
Or your html {{#each}} to:
{{#each calculations}}
<tr>
<td>{{test.testNumber}}</td>
<td>{{test.testName}}</td>
<td>{{test.inputOne}}</td>
<td>{{test.inputTwo}}</td>
<td>{{test.inputThree}}</td>
<td>{{#linkTo route="editCalculation"}}<span class="glyphicon glyphicon-edit" aria-hidden="true"></span>{{/linkTo}}</td>
</tr>
{{/each}}
As #Michael Floyd mentioned, the in calculations is spurious.
Try editing the helpers to the following
Template.ListCalculations.helpers({
'test': function() {
return Calculations.find();
}
});
and the template binding to this in the each loop
{{#each test}}
<tr>
<td>{{testNumber}}</td>
<td>{{testName}}</td>
<td>{{inputOne}}</td>
<td>{{inputTwo}}</td>
<td>{{inputThree}}</td>
<td>{{#linkTo route="editCalculation"}}<span class="glyphicon glyphicon-edit" aria-hidden="true"></span>{{/linkTo}}</td>
</tr>
{{/each}}
In asp.net ajax, the partial view response replaces the html and only the partial view is rendered.
In the below snippet, when I click the ActionLink "Steps", the partial view is returned and replaces the Details.cshtml.
What I need is this partial view should replace only the "main-content-div" div.
Please help out. Thanks
View: Details.cshtml
<div class="main-body">
<table>
<tr>
<td class="left-sidebar extended">
#Ajax.ActionLink("Steps", "Steps", new { id = ViewBag.Id }, new AjaxOptions { AllowCache = false, UpdateTargetId = "main-content-div", InsertionMode=InsertionMode.Replace })
</td>
<td class="main-wrapper">
<div class="main-content" id="main-content-div">
This is the default stuff which I'll be replacing...
</div>
</td>
<td class="right-sidebar"></td>
</tr>
</table>
Action Method:
[HttpGet]
public PartialViewResult Steps(string id)
{
//reading model from db
return PartialView("~/Views/Author/Exercise/_StepsPartial.cshtml", Model);
}
Partial View:
#model IEnumerable<Model>
<div>
<div>
<input type="text" />
</div>
</div>
You need to add jquery.unobtrusive-ajax.min.js to your project for this to work.
Go to the Nuget Console Package Manager console and type:
Install-Package Microsoft.jQuery.Unobtrusive.Ajax
You then just need to add a reference at the top of your _Layout.cshtml or View to the relevant script:
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
Fix this Error which is thrown in console on this page: http://salestrack.meteor.com/demos/overview:
Exception in queued task: TypeError: Cannot read property 'emails' of undefined at Object.Template.demoOverviewItem.helpers.ownerRep (http://localhost:3000/client/views/overviews/demo_overview_item.js?
Here is the helper they're referring to:
ownerRep: function(){
var rep = Meteor.users.findOne({_id: this.userId});
var repEmail = rep.emails[0].address,
repArr = [],
repArr = repEmail.split('#');
return repArr[0];
}
});
The query is inserted into an inclusion block that loops over #each demos and looks up this.userId from the demos collection and matches it up to the user to return the owner of the demo's name.
Here are the templates that:
<template name="demosOverview">
<div class="container-fluid">
<div class="row-fluid col-lg-10 col-lg-offset-1">
<table class="table table-striped table-hover table-bordered dataTable" id="editable- sample">
<thead>
<tr>
<th>Rep</th>
<th>SFID</th>
<th>Date Set</th>
<th>Closed</th>
</tr>
</thead>
<tbody>
{{#each demos}}
{{> demoOverviewItem}}
{{/each}}
</tbody>
</table>
</div>
</div>
</template>
<template name="demoOverviewItem">
<tr>
<td>{{ownerRep}}</td>
<td> {{sfid}}
<a href="{{sfid}}" class="pull-right" target="blank" title="Salesforce">
<img src="/img/salesforce-logo.png" height="16" width="16">
</a>
</td>
<td>{{dateset}}</td>
<td>{{closed}}</td>
</tr>
</template>
I am pub/subbing Meteor.users.find() from the server to the client but haven't paired it down to only send over certain fields yet (for easy hacking purposes).
Weird thing is that it works correctly and returns the demo owner's email address as expected. The error gets thrown when I reload the page but not when I navigate to it from elsewhere on the site.
Seems like a wait.On error or something where when I hit reload it doesn't know that currentUser = true so it throws the error before realizing I'm logged in- that's just a theory though. I've googled, StackOv and IRCed to no avail.
Looks like on page reload you don't have the users on the client side yet.
Try
var rep = Meteor.users.findOne({_id: this.userId});
if (rep) {
var repEmail = rep.emails[0].address, (..)
}
It should rerun once findOne has the data it's looking for.
Hi I have problem with my MVC application.
I would like click on ActionLink > load data from server > and insert data to div in same page.
But my code still loads content on new page and I don`t have idea why. Anybody to help me ?
This is my Index.cshtml in HomeController,
#model IEnumerable<Kango_kmen.KangoKmenWS.WSEntityInfo>
#Content.Script("jquery-1.9.1.min.js", Url)
#Content.Script("jquery.unobtrusive-ajax.min.js",Url)
#Content.Script("jquery.unobtrusive-ajax.js",Url)
#Content.Script("myScript.js",Url)
#section Entities{
<table>
<tr>
<th>
<input type="submit" value="zobrazit" />
</th>
<th>
iD
</th>
<th>
name
</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Ajax.ActionLink("..", "CheckEntity", new { id = item.iD },
new AjaxOptions{ UpdateTargetId="properties",
HttpMethod="GET",
InsertionMode=InsertionMode.InsertAfter,
})
</td>
<td>
#Html.DisplayFor(modelItem => item.iD)
</td>
<td>
#Html.DisplayFor(modelItem => item.name)
</td>
</tr>
<tr>
<td>
<div id="properties">
</div>
</td>
</tr>
}
</table>
}
#section PropertyInfo{
<p>Property info</p>
}
#section Properties{
<p>properties</p>
}
And here is my Controller in HomeController
public PartialViewResult CheckEntity(int id)
{
var model = WSConnect.getEntityInfo(id);
if(model !=null){
return PartialView("CheckEntity", model.property);
}
var modell = new WSEntityInfo[0];
return PartialView("CheckEntity", modell);
}
and ChecktEntity is the Partial view but everytime I click on ActionLink controller load url: /Home/ChceckEntity/1000 for exmaple on view data on this new page "(
There are 2 things wrong with your code:
You have included the jquery.unobtrusive-ajax.js script twice, once the minified version and once the standard version. You should include it only once
The jquery.unobtrusive-ajax.js is not compatible with jquery 1.9.1 because one of the breaking changes in jQuery 1.9 is that the .live() method was removed and the jquery.unobtrusive-ajax.js script relies on it. If you look at your javascript console you would see the following error: The .live method is undefined.. So if you want to use the unobtrusive AJAX functionality in ASP.NET MVC you will have to downgrade the version of jQuery. For example the 1.8.3 version should be fine.
So:
#model IEnumerable<Kango_kmen.KangoKmenWS.WSEntityInfo>
#Content.Script("jquery-1.8.3.min.js", Url)
#Content.Script("jquery.unobtrusive-ajax.min.js", Url)
#Content.Script("myScript.js", Url)
Also please learn how to debug your javascript code. Use a tool such as FireBug or Chrome developer toolbar where all those errors will be shown.
i have a template as below
<script id="ActionTemplate" type="text/x-jquery-tmpl">
<tr>
<td> <a href="#" OnClick="setActionId(${action_id}, ${project_id}, ${merchant_id}, ${channel_id}, ${customer_id})" >${action_id}</a></td>
<td>${priority} </td>
<td>${date_to_display} </td>
<td> ${date_from}</td>
<td>${action_title} </td>
<td> ${status()} (${percentage_completed}%)</td>
<td> ${hours}</td>
<td>${contactFrom} </td>
<td>${contactTo} </td>
</tr>
</script>
in above ${status()} calls the function status which returns a string like this
<script type="language/javascript">
function status(){
return "some_string";
}
</script>
my problem is i hav to send a value from template where the status function is called..value like ${action_status}...
all the values that are in the template like ${priority},${hours},etc are binded to template in a pagemethod...
need a solution
You can pass values from your data to function using the $data keyword. Change the following line in your template like this :
<td> ${status($data.action_status)} (${percentage_completed}%)</td>
assuming 'action_status' is the correct property name from your data...
Update: Here's the link to the api. Look down for the section "Evaluating Expressions and Functions"