Duplicate widgets when embedding widget twice in one widget.

[ColeM]

I'm using the 'widget-data-table' embedded in another widget.  I'd like to embed two list within my widget. 

My issue is I'm getting a duplicate of the second list instead of two different list.  I have also tried passing the options directly into the HTML witht the same result. 

HTML:

<widget id="widget-data-table" options='data.options1'></widget>  
               
<widget id="widget-data-table" options='data.options2'></widget> 

Server Script:

data.options1 = {"table": "x_cio99_ppm_project_demand", "filter": "collaboratorsDYNAMIC90d1921e5f510100a9ad2572f2b477fe"};
	
data.options2 = {"table": "x_cio99_ppm_project_demand", "filter": ""};

[Samaksh Wani · Accepted solution]

Hello @ColeM 

Use the approach which i mention below

HTML :-

<div class="panel">
  <div ng-repeat="elem in c.data.elements">
  	<sp-widget widget="elem"></sp-widget>
  </div>
</div>

Server Script :-

var listOptions = [
     {
		"table":"sc_request",
		"display_field":"request",
		"filter":"request_state=requested^opened_byDYNAMIC90d1921e5f510100a9ad2572f2b477fe",
		"order_direction": "",
		"order_by": "sys_created_on",
		"sp_page":"nr_sc_request",
		"secondary_fields":"request_state,price",
		"maximum_entries": 2
     },
     {
		"table":"incident",
		"display_field":"number",
		"filter":"state=1^opened_byDYNAMIC90d1921e5f510100a9ad2572f2b477fe",
		"order_direction": "desc",
		"order_by": "sys_created_on",
		"sp_page":"nr_sc_request",
		"secondary_fields":"state,short_description",
		"maximum_entries": 3
    }]
	
data.elements = listOptions.map(function(optionList){
	return $sp.getWidget('widget-simple-list', optionList);
});

Plz Mark my Solution as Accept and Give me thumbs up, if you find it helpful.

Regards,

Samaksh

[Samaksh Wani · Accepted solution]

Hello @ColeM 

Ng-Repeat :- It is an Angular Directive which is used to render the element for repeated number of times.

With the help of object in server script you can create multiple responses(table data in your case.) in form of json in that object, which is calling in HTML rendering side.

Plz Mark my Solution as Accept and Give me thumbs up, if you find it helpful.

Regards,

Samaksh

[Samaksh Wani · Accepted solution]

Hello @ColeM 

Use the approach which i mention below

HTML :-

<div class="panel">
  <div ng-repeat="elem in c.data.elements">
  	<sp-widget widget="elem"></sp-widget>
  </div>
</div>

Server Script :-

var listOptions = [
     {
		"table":"sc_request",
		"display_field":"request",
		"filter":"request_state=requested^opened_byDYNAMIC90d1921e5f510100a9ad2572f2b477fe",
		"order_direction": "",
		"order_by": "sys_created_on",
		"sp_page":"nr_sc_request",
		"secondary_fields":"request_state,price",
		"maximum_entries": 2
     },
     {
		"table":"incident",
		"display_field":"number",
		"filter":"state=1^opened_byDYNAMIC90d1921e5f510100a9ad2572f2b477fe",
		"order_direction": "desc",
		"order_by": "sys_created_on",
		"sp_page":"nr_sc_request",
		"secondary_fields":"state,short_description",
		"maximum_entries": 3
    }]
	
data.elements = listOptions.map(function(optionList){
	return $sp.getWidget('widget-simple-list', optionList);
});

Plz Mark my Solution as Accept and Give me thumbs up, if you find it helpful.

Regards,

Samaksh

[ColeM]

This worked!!!

Thanks so much for your quick reply. 

[Samaksh Wani · Accepted solution]

Hello @ColeM 

Ng-Repeat :- It is an Angular Directive which is used to render the element for repeated number of times.

With the help of object in server script you can create multiple responses(table data in your case.) in form of json in that object, which is calling in HTML rendering side.

Plz Mark my Solution as Accept and Give me thumbs up, if you find it helpful.

Regards,

Samaksh

[ColeM]

@Samaksh Wani Very cool, is this the standard best practice in angular? Curious why the widget is duplicated when embedded multiple times.  

Very greatful for your solution.  Accepted & thumbs up 👍