2.12.7 How to display PDF in FAB using Smartforms
You can use Smartforms to display pdf in your app.
Step-by-step guide
- Create and design smartform layout.
- Create an odata service to call and process created smartform returning pdf data.
- Sample entity set definition:
Entity set: ReqData – import parameter/form data, PDFData – export parameter/pdf data
b. Sample js script to pass form data to smartform using Odata service:
var oModel = getModel("CN_CAPEX");
var filters = [];
var filterindex = 0;
//details
var ReqData = {};
ReqData.TITLE = getField("Title");
ReqData.BUDGET_YEAR = getField("BudgetYear");
ReqData.ACCOUNTABILITY = getField("Accountability");
ReqData.DIVISION = getField("Region");
ReqData.LOCATION = getField("Location");
ReqData.STATE = getField("ProvinceText");
ReqData.SUBDIVISION = getField("Subdivision");
ReqData.COMPANY = getField("Company");
ReqData.MULTIYEAR = getField("MultiYear");
ReqData.NUMBEROFYEARS = getField("CommitmentYear");
ReqData.SPONSORSHIP = getField("Sponsorship");
ReqData.TYPE = getField("Type");
ReqData.SUBTYPE = getField("SubType");
ReqData.PROJECTTYPE = getField("ProjectType");
ReqData.SUBPROJECTTYPE = getField("SubProjectType");
ReqData.CURRENCY = getField("Currency");
ReqData.BUSINESSCASE = getField("BusinessCase");
oFilter1 = fabFilter("ReqData", JSON.stringify(ReqData));
filters.push(oFilter1);
oModel.read("/ShowPDFs",{
success:function(data){
if(data.results){
var PDFDataFinal = "data:application/pdf;base64," + data.results[0].PDFData;
if( data.results[0].PDFData != "" ){
setField("PDFDataOut",PDFDataFinal);
}else{
setField("PDFDataOut","");
}
getControl("PDFPageId").setBusy(false);
}
},
filters:filters
});
c. Inside Odata service to retrieve pdf content.
1. Get function module name using form name. See sample code below:
CALL FUNCTION 'SSF_FUNCTION_MODULE_NAME'
EXPORTING
formname = 'ZCN_CAPEX'
IMPORTING
fm_name = lv_fmname
EXCEPTIONS
no_form = 1
no_function_module = 2
OTHERS = 3.
2. Trigger Smartform created using the FM passing form data. Make sure to set GETOTF flag of CONTROL_PARAMETERS when calling the smartform.
cl_fdt_json=>json_to_data(
EXPORTING iv_json = lv_reqdata
CHANGING ca_data = ls_details ).
CALL FUNCTION lv_fmname
EXPORTING
control_parameters = ls_ctrlop
output_options = ls_compop
user_settings = abap_true
im_capex_details = ls_details
IMPORTING
job_output_info = ls_return
EXCEPTIONS
formatting_error = 1
internal_error = 2
send_error = 3
user_canceled = 4
OTHERS = 5.
3. Use function module CONVERT_OTF to convert OTF to PDF.
IF ls_return-otfdata[] IS NOT INITIAL.
lt_otf[] = ls_return-otfdata[].
CALL FUNCTION 'CONVERT_OTF'
EXPORTING
format = 'PDF'
max_linewidth = 132
IMPORTING
bin_filesize = lv_len_in
bin_file = lv_pdf_xstring
TABLES
otf = lt_otf
lines = lt_tline
EXCEPTIONS
err_max_linewidth = 1
err_format = 2
err_conv_not_possible = 3
OTHERS = 4.
ENDIF.
4. Pass bin_file parameter from FM CONVERT_OTF to PDFData form field.
3. Create a new page/or section in FAB that will serve as a placeholder for the pdf content. Add HTML attribute with the following content to display pdf.
<iframe src="{PDFDataOut}" width="100%" height="100%">PDF</iframe>
Related articles