Mahika
Mahika

Reputation: 662

Telerik Gantt chart

I have 2 problems

  1. Dynamically generated JSON object (jsonString) is empty in kendo.data.GanttDataSource. How do I call the dataSource.read() here ?

var jsonObj = []; var jsonString = null;
$(document).ready(function () {
	var url = test.siteUrl() + "/_vti_bin/omg/tt.svc/Read/" + _campaign.CampaignWebID + "/" + _campaign.CampaignListID + "/" + _campaign.ID + "?t=" + of360.t();
	
	$.getJSON(url, function (data) {    
		$.each(data, function (i) {
		
		item = {}
		item['ID'] = data[i].ID;
		item['ChannelDescription'] = data[i].ChannelDescription;
		item['Start'] = data[i].Start;
		item['End'] = data[i].End;	
		item['PercentageComplete'] = data[i].BriefingState/10;
		item['Name'] = data[i].Name;
		jsonObj.push(item);
		});
		jsonString = JSON.stringify(jsonObj);
        //regex : Json remove quotes
		jsonString = jsonString.replace(/"(\w+)"\s*:/g, '$1:');
		//alert(jsonString);
		
	});
});

var ganttModel = kendo.observable({  
	cancel: function () {
		this.cancelDialog();
	}, 
	isVisible: true,               
	ganttDS: new kendo.data.GanttDataSource({
		data: jsonString,
		schema: {
			model: {   
					id: "id",			
				fields: {
					Id: { from: "ID", type: "number" },
					start: { from: "BriefingStart", type: "date"},                                
					end: { from: "BriefingEnd", type: "date" },
					title: { from: "BriefingChannelDescription", type: "string" }, 
					PercentageComplete: {from:"PercentageComplete", type: "number"}
				}
			}
		}		
	})
});

  1. How do I activate the toolbar export to PDF in my template ? my try did not work data-toolbar="[""pdf""]"
    data-pdfExport="true"

<script id="ganttChartTemplate" type="text/x-kendo-template">
<div id="ganttchart"> 
<div class="modal-body">
            <div class="row">
                <div class="form-group">
					<div data-role="gantt"
								data-columns="[				
									 { field: 'title', title: 'Gattung', width: 100 },								
									 { field: 'start', title: 'Start Time', format: '{0:dd/MM/yyyy}', width: 100 },
									 { field: 'end', title: 'End Time', format: '{0:dd/MM/yyyy}', width: 100 }									 
								 ]"
								data-views="[ 'day', { type: 'week', selected: true }, 'month' , 'year']"
								data-show-work-hours="true"
								data-show-work-days="true"
								data-height="300"
								data-editable="false"
								data-listWidth="600"
								data-toolbar="[""pdf""]"	
								data-pdfExport="true"								
								data-bind="source: ganttDS"></div>
				</div>
	        </div>
			<div class="k-dialog-buttons modal-footer">      

        <button class="k-button k-primary" data-bind="events: { click: cancel }">#= Resources.OF360.SendToBuyingDialogCancel#</button>
		
    </div>
		</div>	
</div>
</script>

I appreciate your help here.

Upvotes: 0

Views: 1338

Answers (1)

Mahika
Mahika

Reputation: 662

  1. unfortunately jsonObj did not work, I even tried with ganttDS.read() to assert it again. nothing worked. I solved this by using parse

 parse: function (response) {			
            $.each(response, function (idx, elem) {                    
                var state = elem.BriefingState;
                   elem.BriefingState = state/11;
            });
            return response;
        }	

  1. data-toolbar="['pdf']" still did not work, I also tried it as a array of string with flower brackets. I solved it by calling the function itself in my model

savePdf : function(){
		var gantt = $("#gantt").data("kendoGantt");
		gantt.saveAsPDF();
	},

Upvotes: 1

Related Questions