https://netsuiteprofessionals.com logo
Join Slack
Powered by
So I'm attempting to create a user interaction (su...
# suitescript
r
So I'm attempting to create a user interaction (suggestions welcome). I have a custom record 
Freight Quote
. These are used to track and get quotes for shipping from our carriers. I added a custom sublist 
custsublist_uv_fq_sublist_freight_quotes
to the Sales Order record of Freight Quotes linked to the transaction (Screenshot shows this). My preferred interaction is that the user can click a button from this sublist to update the 
Shipping Cost
on the transaction to the 
Customer Cost
on the Freight Quote. This part I have working through • Saved Search that powers the sublist, the last column is a Formula (HTML) that returns 
<button data-fq-cost="{customerost}">Update Shipping Cost</button>
. • 
jQuery('[id="shipping_div"]').on('click', '.uv_fq_update_shipping', function(e) {
function on pageInit to listen to click events on buttons loaded into that sublist. (I know I'm working outside of "official supported SuiteScript", but trying to make updating shipping costs easier and quicker for my users). My challenge now, is that I only want the button to appear when the transaction is in 
EDIT
mode. Ideas • Update the Formula (HTML) field on the saved search to include 
style="display: none;"
on the button, then removing that when record is in edit mode. ◦ can't use beforeLoad of Sales Order, because 
scriptContext.newRecord.getSublistFields({ sublistId: custsublist_uv_fq_sublist_freight_quotes,});
returns an empty array, even though on the transaction itself it's visible ▪︎ oddly when I inspect the Freight Quotes sublist div, it's got references to 
customsublist47
, but not references to the actual ID of the sublist ◦ Another option is a jQuery event listener for dom manipulation, but I don't know a way to specifically target that sublist for same reason as the sublist not using the custom ID specified. • Get rid of the Formula (HTML) column and dynamically create the button on each row ◦ same problem as above, I don't have a way to target just that sublist before the XHR request or dom manipulation happens.
j
not sure about the other stuff, but if you want to get the sublistfields you could do a record.create of that record type and from the object that returns, you can getSublistFields. Though if you only want this in Edit Mode you could do this logic in Client Script when you WOULD have the sublistfields I think?
r
I thought I could as well, but even this simple code
Copy code
console.log(scriptContext.currentRecord.getSublist({
            sublistId: 'custsublist_uv_fq_sublist_freight_quotes'
        }));
just returns an empty array, but if I use GUI to go to that sublist, then it performs the XHR and I can see the data
j
Hm, I’m not sure then. I haven’t worked with custom sublists like that, just child records.
n
I would be inclined to inspect the HTML you might find the sublist is prefixed with "recmac" If your sublist was created by a parent-child relationship, the internal ID of the sublist usually begins with 'recmac'. If you put the record in edit mode and add &xml=T to the url in your browser you can see it that way too.
r
thanks for he tip. I don't use a parent-child relationship for the custom records. The sublist was created through the "Custom Sublist" feature, which just binds a saved search to appear as a sublist on a record, although I'm finding that there's limitations in that. I'm now trying a new approach just using 
scriptContext.form
to build the Sublist through code on 
beforeLoad
for when this gets archived and someone comes across it later. This was solved by • Adding code inside a User Event 
beforeLoad
on the transaction record to use 
scriptContext.form.addSublist()
to create a custom sublist, adding fields for columns I want. • Running a saved search to get the values for the sublist • using 
scriptContext.type
to determine what mode, and change values in the sublist column depending on result • Despite the column being defined as
Copy code
freightQuoteSublist.addField({
            id: 'custpage_uv_fq_subfld_actions`,
            label: 'Actions',
            type: 'TEXT', // <https://5858307.app.netsuite.com/app/help/helpcenter.nl?fid=section_4332671056.html>
        });
• when I provide html, it is actually rendered as html on the webpage • Adding code inside a Client Script 
pageInit
hook on the transaction using jQuery to grab the 
click
event bubbling up from the resulting table created by the sublist. • One note I noticed, is that if you create a custom sublist via code, then the 
id
attribute of html is actually 
<sublist_name>_layer
, whereas if you create a custom sublist via the UI under customication, the id is 
customlist47_layer
. This was what was blocking me previously. • By creating it via code, it properly uses the custom id as html ID attribute, allowing me to hook into the table via jQuery and capture the events. Resulting client script code below.
Copy code
// Bind to the sublist so we can catch new ones if possible
        jQuery('#custpage_uv_fq_sublist_layer').on('click', '[data-uv-action="' + uvFQLibID.jQuery.action.SET_SHIPPING_COST + '"]', function() {
            let that = jQuery(this);
            let prevHtml = that.html();
            that.prop('disabled', true).html('<span class="material-symbols-outlined uv_progress_animate">progress_activity</span>');
            scriptContext.currentRecord.setValue({
                fieldId: 'shippingcost',
                value: parseFloat(that.data('data-uv-cost'))
            });
            that.prop('disabled', false).html(prevHtml);
        });
13 Views
Open in Slack
PreviousNext
Powered by