Widget Help - Pass options for a widget from another widget

miriamberge
Tera Guru

I want to pass the table name to the "Data Table From Instance Definition" widget from another widget.

Essentially, I have two widgets on my page.  The first widget contains a list of table names.  When the user clicks on the table name, I want it to send the table name to the copy of Data Table From Instance Definition widget and load the table.

I have my first widget talking to the data table widget ie. in my client script I have:

$rootScope.$on('table', function(event,data) {
console.log('Listener caught Table: ' + $rootScope.table);
});

How do I pass that table name back to the server code as though that was an option selected on the data table from instance definition widget, so that it will load that table?  New to this...thanks in advance.

8 REPLIES 8

I'm not really sure I can mark an answer as answered, since I ended up going a different direction with this.

Ideally, I would have liked to pass that table name to the server script so that when the widget is called that's one of the options that is passed to the widget and then that information is returned.  I understand now how to refer to that table name in my server script but not sure it is technically possible or feasible to set it as an option when that widget in the server script gets called and whether it being an embedded widget adds more complexity than this was really worth 😉  ...so I ended up doing something different.  If you have any thoughts on this or ideas, I'm open to suggestions and appreciate the help!  I'm not sure what to mark as correct, since this sort of morphed from the original intent.

 

 

miriamberge
Tera Guru

Ok, I passed the table to the server script and verified by adding a console.log in my server script.  It almost works.  😄

The first time the page loads, if I click on one of items in my list, the proper data table loads.  If I click on a different item, it doesn't load.  Probably something silly... (ignore the discrepancy in badge number vs row number). 

First click:

Second click:

My console log shows me that table = incident... but the widget doesn't render any records.

Widget scripts (not sure if this will be legible, if not I will attach separately):

HTML template, I added a c to c.data.dataTableWidget in the ng-if.

Client Script I added this to what already existed:

var c = this;

$rootScope.$on('table', function(event,data) {
c.server.get({
table: $rootScope.table
}).then(function(r) {
c.data.dataTableWidget = r.data.dataTableWidget;
});
});

Server script I modified line 15 to include (input && input.table) and moved curly brace from line20 to line 52. I also added line 30.

 

miriamberge
Tera Guru

After trying a few things, I took a bit of a different approach.  It seems like a very expensive way to do things... I don't think it is an ideal solution, but it works.

Widget one emits a table name (this is a summary of incidents, problems, requests for the user). 

I cloned the "Data Table from Instance Definition" widget and updated the client script to listen for the table name clicked on in widget one and store that value.  I changed the html in the cloned widget to this:

<div ng-if="options.table == c.data.tablename">
<sp-widget widget="data.dataTableWidget"></sp-widget>
</div>

On my page, I added the cloned widget and updated the options for each instance for the table I want to potentially display.  The corresponding cloned widget displays if the table value from widget one matches the table configured in the options.  Again seems like a really expensive way to do things... still learning and open to suggestions.  Originally, my intention was to pass the table name to the cloned widget and either set the options dynamically or else send the table name back to the server code to call the widget (since it calls data-table-widget), but I couldn't get that working the way I wanted.