0

I want to create summary box like for example sales order summary box. In that box I have to show these fields. and below sublist for individual field values. same like sales order record. How we can create this design? Please Help!

field1

field2

           '<table align="left" bgcolor="#e0e6ef" style="width:20%;">'            
           '<tr>' 
           '<td>'                   
           '<p style="text-align: left;">'+'field1'+'</p>'
           '</td>'   
           '<td>'                   
           '<p style="text-align: right;">'+value2+'</p>'
           '</td>'   
           '</tr>' 
           '<tr>' 
           '<td>'                   
           '<p style="text-align: left;">'+'field2'+'</p>'
           '</td>'   
           '<td>'                   
           '<p style="text-align: right;">'+value2+'</p>'
           '</td>'   
           '</tr>'
Maira S
  • 7
  • 5
  • Do you want to show that box on the record or you want to open the box on click of button or event ? I have answered for creating a suitelet , now you can use it by creating a button or UI field( TYPE-INLINEHTML) to show the page. – SuiteStar Feb 24 '23 at 17:59
  • Do research for adding the suitelet in a field on a record , search for – SuiteStar Feb 24 '23 at 18:00

1 Answers1

0

You can do like this to add a list of fields and sublist in suitelet:-

        var form = serverWidget.createForm({
            title: 'SUMMARY'
        });
        var field1 = form.addField({
            id : 'custpage_text',
            type : serverWidget.FieldType.INLINEHTML,
            label : ' '
        });
        
        //rename fields and values according to you.
        var value1=1,value2=2, value3= 3, value4=4,value5=5, value6=6;
        var myListField = '<!DOCTYPE html>';
        myListField +=    '<html>' 
        myListField +=    '<head>' 
        myListField +=      '</head>' 
        myListField +=    '<body>'                       
        myListField +=    '<p style="text-align: left;"><h4>field1 '+value1+'</h4></p></br>'
        myListField +=    '<p style="text-align: left;"><h4>field2 '+value2+'</h4></p></br>'
        myListField +=    '<p style="text-align: left;"><h4>field3 '+value3+'</h4></p></br>'
        myListField +=    '<p style="text-align: left;"><h4>field4 '+value4+'</h4></p></br>'
        myListField +=    '<p style="text-align: left;"><h4>field5 '+value5+'</h4></p></br>'
        myListField +=    '<p style="text-align: left;"><h4>field6 '+value6+'</h4></p></br>'
        myListField +=    '</body>' 
        myListField +=    '</body>' 
        myListField +=    '</html>' 

        field1.defaultValue=myListField;
       
       // Creating sublist
        var sublist = form.addSublist({
            id: 'custpage_sublist',
            type: serverWidget.SublistType.STATICLIST,
            label: 'Manufacturing Work Order',
            tab: 'subtab2id'
        });

        //sublist.addMarkAllButtons();

        sublist.addField({
            id: 'custpage_sublist1',
            type: serverWidget.FieldType.CHECKBOX,
            label: 'PRINT'
        });

        sublist.addField({
            id: 'custpage_sublist8',
            type: serverWidget.FieldType.INTEGER,
            label: 'INTERNAL ID'
        });

        sublist.addField({
            id: 'custpage_sublist2',
            type: serverWidget.FieldType.TEXT,
            label: 'WORK ORDER',
            source: 'workorder'
        });

        sublist.addField({
            id: 'custpage_sublist3',
            type: serverWidget.FieldType.TEXT,
            label: 'Assembly Item'
            //source:'manufacturingrouting'
        });

        sublist.addField({
            id: 'custpage_sublist4',
            type: serverWidget.FieldType.DATE,
            label: 'START DATE'
        });
       
     scriptContext.response.writePage(form);

Design the size of page according to you.

Thanks,

SuiteStar
  • 117
  • 6