I have integrated dhtmlxGantt in a Laravel5 project and everything is working as expected. But I want to modify it to store charts for more than one project. For that I want to add extra field called "project_id" and load data through a filter.
I have tried modifying the Controller with the following code :
$connector->render_links(
GanttLink::where('user_id', '=', 1)->get(),
"id",
"source,target,type"
);
$connector->render_table(
GanttTask::where('user_id', '=', 1)->get(),
"id",
"start_date,duration,text,progress,parent"
);
This solution allowed me to load the chart from the data base in the way I wanted. But It does not save the changes back to the database. I went through the dhtmlxGantt documentations but did not get any solution for this.
I found these links in my research and might be helpful.
Link 1: Changing values before saving
Link 2: Filtering results based on a parameter
Please help me to modify my project in a way which allows to work (Load and Edit) on different charts.
Finally I found a solution. Firstly, you need to add project_id column to the database table, then add the column to connector configuration:
$connector->render_table(new GanttTask(), "id", "start_date,duration,text,progress,parent,project_id");
Then you have to do some modifications to the client-side code. Use something like,
var project_id = "<?php echo $project['id']; ?>";
in order to take the variable into the <script>..</script>
Then modify your code by adding these two client-side handlers:
gantt.attachEvent("onBeforeTaskDisplay", function (id, task) {
if (task.project_id == project_id) {
return true;
}
return false;
});
and
gantt.attachEvent("onBeforeTaskAdd", function (id, task) {
task.project_id = project_id;
});
First handler filters the results in the way you want before displaying the chart, and second handler attaches the project_id property before adding the task. Now you have a dhtmlxGatt which can display multiple projects.
Related
I hope its not to harsh to ask not to mince matters.
Here we go:
I have a problem developing a custom Plugin for Shopware 5.
I already have a working plugin which lists orders for certain criteria.
Now I want a Button (which i already have) in the toolbar of this grid-window.
The Button should open the Batch Process Window which is already available in the native "Order" Window of shopware.
Q: How Can I open this app with the selected Ids of my grid?
Heres what I have:
[...]
createToolbarButton: function () {
var me = this;
return Ext.create('Ext.button.Button', {
text: 'Batch Processing Orders',
name: 'customBatchProcessButton',
cls: 'secondary',
handler: function () {
me.onClickCustomBatchProcessButton(me);
}
});
},
onClickCustomBatchProcessButton: function(me){
var thisGrid = me.getTransferGrid();
var records = thisGrid.getSelectionModel().getSelection();
console.log("Grid");
console.log(thisGrid);
console.log("records");
console.log(records);
Shopware.app.Application.addSubApplication({
name: 'Shopware.apps.Order',
action: 'batch',
params: {
mode: 'multi',
records: records
}
});
}
[...]
It always opens the normal view of the order window. (no error in console)
Anybody has a suggestions?
That would be great!
Thanks for your time :)
Greetings
EDIT:
Hey, thank you for your reply so far.
I managed to open the Batch-process-window like this:
me.getView('Shopware.apps.Order.view.batch.Window').create({
orderStatusStore: Ext.create('Shopware.apps.Base.store.OrderStatus').load(),
records: orderRecords,
mode: 'multi'
}).show({});
But now the Problem ist, the Event for the Batch-Process isn't applied on the button on the form...
I am still on try and error.
Many Shopware ExtJS SubApplications can be executed from another app with certain parameters exactly the way you're trying to. Unfortunately I don't see any code in the Order plugin that might lead to the desired result. You can see what actions/params a Shopware SubApplication supports by reading the init function of the main controller -> Shopware.apps.Order.controller.Main
Shopware.apps.Customer.controller.Main from the Customer plugin for example accepts an action like you are using it – it is checking for this:
if (me.subApplication.action && me.subApplication.action.toLowerCase() === 'detail') {
if (me.subApplication.params && me.subApplication.params.customerId) {
//open the customer detail page with the passed customer id
...
In the Order plugin there is similar code, but it just takes an order ID and opens the detail page for the corresponding order. It apparently doesn't feature the batch.Window
You might be able to reuse this class somehow, but that might be a ton of code you need to adapt from the actual Order plugin. If you really need this feature, you can carefully read how the Order plugin is initializing the window and its dependencies and have a try.
I'd rather go for developing a lightweight module in this scenario (It's a frame within a backend window that just uses controllers and template views with PHP/Smarty/HTML)
I have created a custom section in umbraco to manage some data in an SQL database.
I can edit items OK but when adding I need to refresh the page to see my new row in the custom tree on the left.
How can I cause a refresh of my custom tree using AngularJS? My tree is called "clients".
I have tried debugging the code and looking at the source to find the event but I can't seem to work out how to do it.
Is there a method I can call on the umbTreeDirective somehow? Or an event to subscribe to?
I am fairly new to AngularJS and am struggling a little.
You're looking for the navigationService.
This line is example of a syncTree call:
navigationService.syncTree({ tree: 'clients', path: content.path, forceReload: false, activate: true });
Here's a contrived, spaghetti promised but full example:
angular.module("umbraco")
.directive('nowplaying', ['navigationService', 'contentResource', 'contentEditingHelper', function (navigationService, contentResource, contentEditingHelper) {
//spaghetti example to create new document
contentResource.getScaffold(parentId, alias)
.then(function (scaffold) {
var myDoc = scaffold;
myDoc.name = name;
//we have minimum to publish
contentResource.publish(myDoc, true, [''])
.then(function (content) {
$scope.newlyCreatedNode = content;
//Sync ('refresh') the tree!
navigationService.syncTree({ tree: 'clients', path: content.path, forceReload: false, activate: true });
});
});
}]);
All of the Belle documentation lives here. -I'm not sure it's actively maintained, i can say for certain that one or two signatures have changed since it was first posted. That aside, it's the best resource i know of to interact with all the umbraco exposed modules and services.
this is my first Question, may be hard to understand.
calling $('#classes').trigger('footable_redraw'); , it return the data but hide the table heading and data rows,but when i used $('#classes').trigger('footable_initialize'); its work fine but reduplicate the data .
Ajax method is called on submitting form.
$.ajax({
url : baseurl+'index.php/settings/classes/viewclasses',
success : function(data) {
$('.classestbody').append(data);
$('#classes').trigger('footable_redraw'); }
});
How can i only get my updated data in table after saving any Values by calling submitting for saving ?
Basically you need to check to see if the data is in the table already. If the data is not in the table, add it; if it is in the table, don't. You'll need some way to positively identify a row that matches the data. If data is an array, you'll need to loop through the array and check each row.
Another option would be to use a data binding framework. This would allow you to bind the data to the table, then you just add/update/delete rows from the data and the framework takes care of updating the table (view) for you.
I personally use Knockout.js. They have a really good tutorial: http://learn.knockoutjs.com/. Even if you don't end up using Knockout.js, I think the tutorial is pretty cool and it will only take you a couple of hours to go through all of them.
If your script on index.php/settings/classes/viewclasses always returns the hole table, and since you said the data gets duplicated this seems to be the case.
Then it is easier to delete all rows then add them all again, just add $('.classestbody').empty(); before $('.classestbody').append(data);. Your code would look like this:
$.ajax({
url : baseurl+'index.php/settings/classes/viewclasses',
success : function(data) {
$('.classestbody').empty();
$('.classestbody').append(data);
$('#classes').trigger('footable_redraw');
}
});
I am exploring using DGrid for my web application. I am trying to have a table similar to this.
The code for the example above is here.
The table uses a memory store as the source of its data - the summary field there is what shows up when we click and expand each row.
I want the details(i.e the text shown when we click a row) to be fetched from the server on clicking on the row instead of being statically loaded along with rest of the page.
How do I modify the above code to be able to do that?
(My requirement is that of an HTML table, each row expandable on clicking, where the data on each expansion is fetched from the server, using AJAX for instance. I am just exploring dgrid as an option, as I get sortable columns for free with dgrid. If there is a better option, please let me know)
EDIT: Basically I am looking for ideas for doing that and not expecting anyone to actually give me the code. Being rather unfamiliar with Dojo, I am not sure what would be the right approach
If your ajax call returns html, you could place a dijit/layout/ContentPane in your renderer, and set the url of the contents you want to fetch in the ContentPane's href property. Assuming that your initial data (the equivalent of the example's memory store) would have a property called "yourServiceCallHref" containing the url you want to lazy load, your could try this :
require(["dijit/layout/ContentPane", ...], function(ContentPane){
renderers = {
...,
table: function(obj, options){
var div = put("div.collapsed", Grid.prototype.renderRow.apply(this, arguments)),
cp = new ContentPane({
href : obj.yourServiceCallHref
}),
expando = put(div, "div.expando", cp.domNode);
cp.startup();
return div;
}
});
If your service returns json, you could probably do something with dojo/request in a similar fashion. Just add your dom creation steps in your request callback and put them inside the div called "expando"...
Another option would be to replace the Memory store by a JsonRest store, and have the server output the same json format than the one you see on the Memory store. That means all the data would be fetched in a single call though...
I'm working with http://arshaw.com/fullcalendar/ and I would like to dynamically filter the events shown based on various checkboxes on the page. I am using an ajax source (with filters passed as parameters) to gather data.
The problem I am running into is once I load the calendar, I cannot, for the life of me (or stackoverflow searches) figure out how to update the parameters. It seems once the calendar is loaded, those parameters are "baked" and cannot be changed.
I have tried every combination of addEventSource, removeEventSources, removeEvents, refetchEvents, etc (as recommended here: rerenderEvents / refetchEvents problem), with still no luck.
My current solution is to re-initiate the entire .fullCalendar every time a filter is updated-- this is leading to tons of issues as well and really isn't an elegant solution.
Any ideas on a simpler way to do this? Refetching your source with updated parameters each time should be automatic. I really do appreciate your help.
In my code i do like that :
I have an array with the calendars id to display and i update it when the user check or uncheck the checkbox.
In fullCalendar initialization I retrieve all events and i filter them with this function :
function fetchEvent( calendars, events) {
function eventCorrespond (element, index, array) {
return $.inArray(element.calendarid, calendars) > -1;
}
return events.filter(eventCorrespond);
}
$('#calendar').fullCalendar({
events: function(start, end, callback) {
//fetch events for date range on the server and retrieve an events array
//update calendars, your array of calendarsId
//return a filtered events array
callback(fetchEvent(calendars , events));
}
});
and when the user check or uncheck a checkbox i do :
$('#calendar').fullCalendar('refetchEvents');
The solution that works for me is:
$('#calendar').fullCalendar('removeEventSource', 'JsonResponse.ashx?technicans=' + technicians);
technicians = new_technicians_value;
$('#calendar').fullCalendar('addEventSource', 'JsonResponse.ashx?technicans=' + technicians);
After "addEventSource" events will be immediately fetched from the new source.
full answer here https://stackoverflow.com/a/36361544/5833265