gantt.attachEvent("onBeforeLightbox", function(id) {
var task = gantt.getTask(id);
task.my_template = "<span id='title1'>Holders: </span>"+ task.users
+"<span id='title2'>Progress: </span>"+ task.progress*100 +" %";
return true;
});
it is code for set data.
But
I want to set data from server side.
example:
$.getJSON('/production_planning/order_assignment/line_status/?line_id='+line_id, function(data) {
$('#my_template').html(data)
});
It is Possible using template control?
Try to use gantt.getLightboxSection method to access the template control from the callback
$.getJSON('/production_planning/order_assignment/line_status/?line_id='+line_id, function(data) {
gantt.getLightboxSection("my_template").setValue(data);
});
Related
I am able to get the aggreate values from server to client, but could not display it on the template. Am i missing something here.Appreciate your help.Iam a newbie in meteor.
//client side javascript
Template.DashboardCategoriesChart.helpers({
'CategoryAggregateItem':function(){
var res;
Meteor.call("getAggregateCategoriesSum",function(errors,results){
console.log("results value: "+ JSON.stringify(results))
return results ;
};
};
});
//stringfy value returned
results value: [
{"_id":"Household","totalAmount":420},
{"_id":"Insurance","totalAmount":235},
{"_id":"Family","totalAmount":1358},
{"_id":"Utilities","totalAmount":5371.5},
{"_id":"Automobile","totalAmount":500},
{"_id":"Home Office","totalAmount":290},
{"_id":"Travel","totalAmount":14},
{"_id":"Food","totalAmount":303}
]
//Template
{{#each CategoryAggregateItem}}
<tr>
<td>{{_id}}</td><td>{{totalAmount}}</td>
</tr>
{{/each}}
The following code worked, thanks a ton JeremyK for leading to right direction.
Template.DashboardCategoriesChart.helpers({
'CategoryAggregateItem':function(){
return Template.instance().CategoryAggregateItem.get(); //this.CategoryAggregateItem;
}
});
Template.DashboardCategoriesChart.onCreated(function () {
var instance = this;
this.CategoryAggregateItem = new ReactiveVar(null);
Meteor.call("getAggregateCategoriesSum",function(errors,results){
console.log("results value: "+ JSON.stringify(results))
instance.CategoryAggregateItem.set(results);
})
})
Try changing your client side javascript to this:
Template.DashboardCategoriesChart.onCreated(function () {
_this = this;
_this.CategoryAggregateItem = new ReactiveVar(null);
Meteor.call("getAggregateCategoriesSum",function(errors,results){
console.log("results value: "+ JSON.stringify(results))
_this.CategoryAggregateItem.set(results);
}
});
Template.DashboardCategoriesChart.helpers({
'CategoryAggregateItem':function(){
return Template.instance().CategoryAggregateItem.get();
});
When the Callback from Meteor.Call is triggered, it will update the ReactiveVar. This causes the template to rerender and display the retrieved data.
You may also want to provide alternative markup in your template for when the helper returns null, before the data is received by the client.
I have this following requirement. Need to display the html Body of the Mime message in IFrame
View
<iframe id="myIframe1" src="http://localhost:23245/Home/GetMimeMessageContent?FilePath=D \MimeFiles/htmlBody-small1.eml&PartName=HtmlBody" style="width:600px;height:600px;" >
Controller
public ActionResult GetMimeMessageContent(string filePath,string partName)
{
var mimeModel = BuildMimeModel(filePath, partName);
MimeHeaderModel mimeHeadermodel = new MimeHeaderModel();
mimeHeadermodel.FromAddress = mimeHeadermodel.ToAddress = mimeHeadermodel.Subject = string.Empty;
mimeModel.MimeHeader = mimeHeadermodel;
return View("MailDetailsView", mimeModel.MimeBody.HtmlBody);
}
it's not showing the HtmlBody in the Iframe. But Its calling the controller. I dont know what I am missing.
Not sure if your using jquery or not, but:
$(function() {
var $frame = $('<iframe style="width:200px; height:100px;">');
$('body').html( $frame );
setTimeout( function() {
$.ajax(
url="/Home/GetMimeMessageType/small1.eml/HtmlBody",
type:'GET',
success: function(data){
var doc = $frame[0].contentWindow.document;
var $body = $('body',doc);
$body.html(data);
}
);
},1 );
});
I have not tested the above code, but this should work fine. A few things to note:
You will need to create a custom Route to map this to your controller:
http://msdn.microsoft.com/en-us/library/cc668201(v=vs.100).aspx
You will also need to change the javascript $('body').html() to be the ID of a div as a placeholder
also you will notice i have no path, if this never changes, you should add the path to your code or you can use formcollection and change the jquery ajax to a post, and set the variables and values there.
Your content will then up up in an iframe.
Forget the whole html.renderaction, this solution gives you a little more scope
Ok so I'm not sure why I can't render the code. First if I console.log users.content I get the content I want but I'm some how not able to pass it to a textarea so that it show's it...
Users = new Meteor.Collection("users");
if(Meteor.is_client){
Template.inputUser.code = function(){
var el = Users.find({name:"oscar"});
el.forEach(function(users){
console.log(users.content);
})
}
}
And then on my html template I have
<body>{{> inputUser}}</body>
<template name="inputUser">
<textarea>{{content}}</textarea>
</template>
And I would have a record on the db suck as so
if(Meteor.is_server)
Users.insert({name:"oscar",content:"hello world"})
Thanks for your help guys.
Firstly your method Template.inputUser.code should return something, you should also note that it wouldn't be called with that template either as it needs a {{code}} call in it rather than {{content}}
The second point is database contents are not always available if you have disabled the autopublish package, if so check out using publish(in the server code) and subscribe(in the client code): http://docs.meteor.com/#meteor_subscribe you can use this to check when the client has all the data to display. Something like:
Meteor.subscribe('allusers', function() {
Template.inputUser.code = function(){
var user = Users.findOne({name:"oscar"});
return user.content;
}
});
...
Meteor.publish('allusers', function() {
return Users.find();
});
i am converting over from websforms to asp.net mvc and i have a question.
i have a loop that generates links dynamicallly where picNumberLink is a variable in a loop and image is a variable image link.
i want to avoid putting javascript actions inline so in my webforms project is did the following:
hyperLink.Attributes.Add("onclick", "javascript:void(viewer.show(" + picNumberlink + "))");
what is the equivalent using jquery in asp.net mvc?
I have seen examples of using the $(document).ready event to attach on clicks but i can't figure out the syntax to pass in the picNumberLink variable into the javascript function.
suggestions?
EDIT: If you generate your links with the ID of this form:
<a id="piclink_1" class="picLinks">...</a>
<a id="picLink_2" class="picLinks">...</a>
<script type="text/javascript">
$('a.picLinks').click(function () {
//split at the '_' and take the second offset
var picNumber = $(this).attr('id').split('_')[1];
viewer.show(picNumber);
});
</script>
var functionIWantToCall = function(){
var wrappedLink = $(this);
//some serious action
}
//this should be called on document ready
$("#myLinkId").click(functionIWantToCall);
If you need to get URL of picture, keep it in anchor`s href:
var functionIWantToCall = function(event){
event.preventDefault(); //this one is important
var link = $(this).attr('href');
//some serious action
}
$(document).ready(function()
{
$('#LinkID').click(function() {
viewer.show($(this).attr('picNumber'));
});
});
You can add an attribute called picNumber to your hyperlink tag and set this is your mvc view
The link in your view might look something like this:
<%= Html.ActionLink("Index", new { id = "LINKID", picNumber = 1 }) %>
Assuming you're able to change the HTML you output, can't you put the picNumberLink in the id or class attribute?
HTML:
<img src="..."/>
jQuery:
$(function() {
// using the id attribute:
$('.view').click(function() {
viewer.show(+/-(\d+)/.exec(this.id)[1]);
});
// or using the class attribute:
$('.view').click(function() {
viewer.show(+/(^|\s)foo-(\d+)(\s|$)/.exec(this.className)[2]);
});
}}
Can anyone inform me how to maintain the jquery accordion active state panel when changing pages. Ideally i would like to change in the code-behind however really happy to just get it working.
developing in asp.net 3.5
Hope this helps
Thanks
Example here. If you select one of the accordion headers then refresh the page the last accordian panel you clicked is opened by default
I see this as a pure client responsibility. I would store the information in a cookie plugin here which you can read and pass to the accordion constructor.
I would prefer this over passing values to and from the server for no real benefit.
Something along these lines
//get persisted active accoridan index
var activeIndex = $.cookie('accordianActiveIndex');
//guard code here to check you have a valid activeIndex...
$('.selector').accordion({
active: activeIndex,
change: function(event, ui) {
//set cookie here to new active header (index)
$.cookie('accordianActiveIndex', ui.newHeader.prevAll().length)
}
});
For anyone with a similar problem getting cookies to work with jQuery UI Accordion, I've solved it by adding one line to redsquare's code.
The cookie value activeIndex needs to be parsed as an integer:
//get persisted active accoridan index
var activeIndex = $.cookie('accordianActiveIndex');
activeIndex = parseInt(activeIndex, 10);
//guard code here to check you have a valid activeIndex...
$('.selector').accordion({
active: activeIndex,
change: function(event, ui) {
//set cookie here to new active header (index)
$.cookie('accordianActiveIndex', ui.newHeader.prevAll().length)
}
});
And here's another way to save UI Accordion state using the cookie.js plugin:
(source)
var accordion = $("#accordion");
var index = $.cookie("accordion");
var active;
if (index !== null) {
active = accordion.find("h3:eq(" + index + ")");
} else {
active = 0
}
accordion.accordion({
header: "h3",
event: "click hoverintent",
active: active,
change: function(event, ui) {
var index = $(this).find("h3").index ( ui.newHeader[0] );
$.cookie("accordion", index, {
path: "/"
});
},
autoHeight: false
});
I Just use
$( ".selector" ).accordion({ navigation: true });
that maintains the status of the selected option