How-to Guide
Nue Platform
Line Editor UI Plugins
12 min
the line editor supports customizable behavior through javascript ui plugins , triggered at specific points in the ui lifecycle these plugins allow you to manipulate pricing, quantities, and header level values programmatically using custom logic before and after the price calculation by the pricing engine they are fully supported on both quotes and orders , enabling seamless, dynamic behavior across the entire pricing workflow we support the following types of ui plugin interfaces trigger event trigger ui afteredit after edit on ui after a user edits any field in a line item ui afterloading after loading line editor after the line editor and line items are fully loaded on the page ui beforecalculation after calculation on ui just before the pricing engine performs calculations ui aftercalculation before calculation on ui immediately after calculations are completed create ui plugins in salesforce a ui plugin is stored in salesforce under the pricing plugin ( ruby pricingplugin c ) object follow the steps below to create pricing plugins step 1 create a custom tab for the pricing plugin object go to setup in salesforce search for and select tabs in the quick find box under custom object tabs , click new for the object , choose pricing plugin (ruby pricingplugin c) choose a tab style (any icon is fine) optionally, set visibility for specific profiles click next , and complete the wizard to save the tab step 2 add the custom tab to the nue on salesforce app in setup , search for app manager locate the nue on salesforce app and click the ▼ dropdown → edit click on navigation items move the new pricing plugin tab from available items → selected items save the changes now the pricing plugin tab will appear in the app’s navigation bar step 3 create a new pricing plugin record go to the pricing plugin tab inside the nue on salesforce app click new to create a new plugin fill out the following fields field description name name of the plugin plugin type always choose 'any' other values are deprecated trigger event when the plugin is triggered after edit on ui ( ui afteredit ) – after a user edits a line item after loading line editor ( ui afterloading ) – after the line editor finishes loading before calculation on ui ( ui beforecalculation ) – just before calculation starts after calculation on ui ( ui aftercalculation ) – after all calculations are completed other values are deprecated code javascript logic to run on the plugin context you can use system provided variables like $$headerobject , $$changedlineinfo , $$updatedlineitems , etc checkout use cases and examples in the sections below is active check this to enable the plugin in the pricing engine ecma version select the javascript version default is 10 ecmascript 2020 , but 2015–2019 are supported api version (optional) version metadata for internal reference use latest description (optional) notes for team documentation and usage tracking ui plugin examples ui plugin interface #1 trigger event = ui afteredit use case use this to automatically update related line items or pricing fields after a user edits a line for example, if a sales rep updates the quantity of a parent product, you can auto update a child line’s included quantity or pricing fields in response fields supported to be changed within the plugin are quantity actualquantity productoptionquantity includedquantity discountpercentage discountamount netsalesprice totalprice custom field ( custom field c ) sample plugin code if the product sku is nue rise edition and the user changes its quantity, update the included quantity of its child sku nue on salesforce { console debug('ui plugin context ' + json stringify($$headerobject)); console debug('ui plugin context ' + json stringify($$changedlineinfo)); // add safety checks if ($$changedlineinfo originallineitem product sku || $$changedlineinfo updatedlineitem quantity || $$headerobject lineitems) { console warn('missing required data in plugin context'); return; } // initialize updatedlineitems if not already an array if (!array isarray($$updatedlineitems)) { $$updatedlineitems = \[]; } if ($$changedlineinfo originallineitem product sku === 'nue rise edition' && $$changedlineinfo updatedfield === 'quantity') { for (const line of $$headerobject lineitems) { if (line product sku === 'nue rise edition' && array isarray(line childrenlineitems)) { for (const child of line childrenlineitems) { if (child product sku === 'nue on salesforce') { $$updatedlineitems push({ refid child refid, includedquantity $$changedlineinfo updatedlineitem quantity }); } } } } } } ui plugin interface #2 trigger event = ui afterloading this is used after loading the line editor with line items on the page the plugin could use a hook object to do callback methods currently, only recalculate is supported use case use this to trigger global operations like recalculation as soon as the line editor finishes loading console debug('ui plugin context ' + json stringify($$headerobject)); $$lineeditorcallback recalculate(); ui plugin interface #3 trigger event = ui beforecalculation this is triggered before the line editor performs calculation use case use this to make last minute adjustments or validations before pricing logic runs //this is triggered after the line editor performs calculation console debug('\[nue] headerobject = ' + json stringify($$headerobject)); //make update $$updatedlineitems push({ id lineitem id, quantity calculatedquantity, actualquantity calculatedquantity}); ui plugin interface #4 trigger event = ui aftercalculation this is triggered after the line editor completes its calculation use case use this to modify line items or quote level fields based on final calculated values you may also optionally trigger a recalculation — but be cautious to avoid infinite loops //this is triggered after the line editor performs calculation console debug('\[nue] headerobject = ' + json stringify($$headerobject)); //make updates and call recalculation please note that recalculation will trigger all plugins to run again, so make sure that you add a condition to call recalculation if necessary only (otherwise, the plugins will trigger endlessly) $$updatedlineitems push({ id lineitem id, quantity calculatedquantity, actualquantity calculatedquantity }); $$callbackoptions needrecalculate = true; //to update a quote level field $$updatedheaderpricing total committed spend c = 100000; best practices always wrap recalculation logic in a condition to prevent infinite loops keep plugin logic modular and scoped to relevant skus or field changes use meaningful custom fields to track state where needed add detailed console log statements throughout your plugin code to aid in debugging and understanding plugin execution context once ui plugins are activated, they may impact or interfere with the behavior of the line editor always test the ui plugin in both scenarios initial quote/order change quote/order flows
🤔
Have a question?
Get answers fast with Nue’s intelligent AI, expert support team, and a growing community of users - all here to help you succeed.
To ask a question or participate in discussions, you'll need to authenticate first.