Processing...

Suggested case list:

Using timer to refresh a grid

383guest172.69.33.12125nk0uiMay 7, 2020 7:23:47 AMlink

user model to move item to another listbox

120guest162.158.193.148d0n3krApr 2, 2020 5:28:28 AMlink

Disabled list item row passed to VM-1981

296fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:44 PMlink

Disabled list item row passed to VM-1981

295fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:16 PMlink

Disabled list item row passed to VM-1981

294fatih123160.83.36.13225nk0uiFeb 13, 2018 3:30:44 PMlink

grid sample with ListModel/RowRenderer

816guest80.82.2.1312vah9ajFeb 21, 2017 11:42:21 AMlink

grid sample with ListModel/RowRenderer

809guest175.98.113.1622vah9ajJan 26, 2017 9:19:33 AMlink

grid sample with ListModel/RowRenderer

196guest79.185.142.402vah9ajApr 26, 2014 10:53:57 PMlink

grid sample with ListModel/RowRenderer

195guest79.185.142.402vah9ajApr 26, 2014 10:53:54 PMlink

grid sample with ListModel/RowRenderer

194guest79.185.142.402vah9ajApr 26, 2014 10:53:51 PMlink

grid sample with ListModel/RowRenderer

193guest79.185.142.402vah9ajApr 26, 2014 10:53:48 PMlink

grid sample with ListModel/RowRenderer

192guest79.185.142.402vah9ajApr 26, 2014 10:53:44 PMlink

grid sample with ListModel/RowRenderer

191guest79.185.142.402vah9ajApr 26, 2014 10:53:40 PMlink

Hierarchy table without using ZK PE/EE

1aaknai151.28.135.2131s871daJul 29, 2013 11:02:46 PMlink

grid sample with ListModel/RowRenderer

128aaknai151.28.135.2132vah9ajJul 29, 2013 7:20:00 PMlink

user model to move item to another listbox

1TonyQ114.25.109.94d0n3krApr 21, 2012 10:43:27 AMlink

Using timer to refresh a grid

1TonyQ220.133.44.3725nk0uiFeb 17, 2012 3:17:34 AMlink

Fire a event from child iframe

1TonyQ220.133.44.372eupjotFeb 3, 2012 5:04:52 AMlink

Textbox input restriction sample

1TonyQ72.21.245.2431b3nlr0Dec 20, 2011 10:09:10 AMlink

Test web core taglib in ZUL

1TonyQ198.203.175.175ofqkemDec 17, 2011 3:36:08 AMlink

Latest 10 Fiddles :

constraint binding textbox

3guest172.68.151.16220peldaDec 5, 2025 5:08:19 PMlink

Another new ZK fiddle

2guest172.68.151.16320peldaDec 5, 2025 5:07:51 PMlink

Another new ZK fiddle

1guest172.68.151.16220peldaDec 5, 2025 5:07:32 PMlink

Another new ZK fiddle

1peggypeng172.71.154.99364f4neDec 5, 2025 9:24:31 AMlink

tooltip example

2guest104.22.23.13rc1ntoDec 4, 2025 2:23:45 PMlink

Another new ZK fiddle

1guest172.69.134.2277t7602Dec 4, 2025 1:40:46 PMlink

Another new ZK fiddle

1peggypeng104.22.17.1802df6e3oDec 4, 2025 8:41:29 AMlink

onClose

1peggypeng172.68.87.248j8kd8aDec 3, 2025 4:10:26 AMlink

Another new ZK fiddle

1peggypeng172.69.134.2271rm7f4eNov 26, 2025 3:31:24 AMlink

ZK-5912-Suggestion

2rebeccalai104.22.20.1442qrmiiuNov 26, 2025 2:07:15 AMlink

Another new ZK fiddle

2guest94.126.240.23267kkeJan 23, 2020 8:43:30 AMlink

resources

index.zulzul<?page title="new page title" contentType="text/html;charset=UTF-8"?> <?taglib uri="http://www.tcs.com/digigov/digigov.tld" prefix="c"?> <?component name="addressComponentWindow" inline="true" macroURI="/WEB-INF/zul/common/address.zul"?> <zk> <window id="manualInvWin" height="100%" width="100%" border="normal" apply="com.tcs.digigov.ptp.inv.composer.common.CreateManualInvoiceComposer" contentSclass="attachment-scroll manualInvoiceForm"> <style> .claim-attachment{ background: #ccc; } .claim-attachment img{ width: 100%; } </style> <div class="page-header" visible="false"> <label class="heading_style1" value="${c:pl('MANUAL.CREATION','INV.MANUAL.CREATION.LABELS')}"> </label> <label id="lbMandatoryMsg" class="mandatory_fields" value="${c:pl('COMMON.TEXT.MANDATORY','LABEL_BUNDLE')}"> </label> </div> <borderlayout> <center autoscroll="true"> <borderlayout> <center autoscroll="true"> <tabbox id="invoiceTabBox" height="auto" width="auto" class="tab_box_container"> <tabs id="invoiceTabs"> <tab id="invoiceDetailsTab" width="166px" label="${c:pl('INVOICE.EXCEPTION.INVOICE.DETAILS','PTP.INV.COMMON.LABEL')}" tooltiptext="${c:pl('INVOICE.EXCEPTION.INVOICE.DETAILS','PTP.INV.COMMON.LABEL')}"> </tab> <tab id="codingLineDetailsTab" width="166px" label="${c:pl('INVOICE.CODING.LINE.DETAILS','PTP.INV.COMMON.LABEL')}" tooltiptext="${c:pl('INVOICE.CODING.LINE.DETAILS','PTP.INV.COMMON.LABEL')}"> </tab> <tab id="invoiceExceptionTab" width="166px" label="${c:pl('INVOICE.EXCEPTION.EXCEPTION.DETAILS','PTP.INV.COMMON.LABEL')}" visible="false" tooltiptext="${c:pl('INVOICE.EXCEPTION.INVOICE.DETAILS','PTP.INV.COMMON.LABEL')}"> </tab> </tabs> <tabpanels style="overflow:auto !important;"> <tabpanel id="invoiceDtlsPanel"> <panel height="auto" border="none" collapsible="true" class="panel_div"> <panelchildren class="panel_div_container"> <div class="column" id="entity" visible="false"> <hbox> <label id="entity_lbl" value="${c:pl('MANUAL.INV.ENTITY','INV.MANUAL.CREATION.LABELS')}" /> <label id="entity_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <combobox id="entity_cmbBox" visible="true" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <div class="grid grid-pad"> <div class="col-1-5" id="invType"> <hbox> <label id="invType_lbl" value="${c:pl('MANUAL.INV.TYPE','INV.MANUAL.CREATION.LABELS')}"> </label> <label id="invType_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <combobox id="invType_cmbBox" visible="true" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <div class="col-1-5 ie-alignment" id="invCrtDt"> <hbox> <label id="invCrtDt_lbl" value="${c:pl('MANUAL.INV.CRTDT','INV.MANUAL.CREATION.LABELS')}"> </label> </hbox> <separator></separator> <datebox id="invCrtDt_dtBox" visible="true" readonly="true"> </datebox> </div> <div class="col-1-5" id="captureDiv"> <hbox> <label id="captureLbl" value="${c:pl('MANUAL.INV.CAPTURE.TYPE','INV.MANUAL.CREATION.LABELS')}"> </label> <label id="captureLblMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="20" id="captureType"> </textbox> </div> <div class="col-1-5" id="fromEmailIdDiv" visible="false"> <hbox> <label id="fromEmailIdLbl" value="${c:pl('MANUAL.INV.FROM.EMAIL.ID','INV.MANUAL.CREATION.LABELS')}"> </label> </hbox> <separator></separator> <textbox maxlength="100" id="fromEmailId" readonly="true"> </textbox> </div> <!-- <div class="col-1-4"> --> <!-- id="exceptionImage" visible="false"> --> <div id="exceptionImage" visible="false" class="Potential-Duplicate-Container"> <div class="fa fa-exclamation-triangle fa-lg"> </div> <div class="Potential-Duplicate"> <div> POTENTIAL </div> <div> DUPLICATE </div> </div> </div> <!-- </div> --> <!-- <image id="excepImg" src="/zkImages/PTP/duplicate.jpg" width="60px" height="60px"></image> --> <!-- </div> --> </div> <div class="column" id="country" visible="false"> <hbox> <label id="country_lbl" value="${c:pl('MANUAL.INV.COUNTRY','INV.MANUAL.CREATION.LABELS')}" /> <label id="country_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <combobox id="country_cmbBox" visible="true" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <panel height="auto" title="Invoice Details" border="normal" id="invDtlsPanel" collapsible="true" class="panel_div" visible="false"> <panelchildren class="panel_div_container"> <div class="grid grid-pad"> <div class="col-1-4" id="invNo" visible="false"> <hbox> <label id="invNo_lbl"> </label> <label id="invNo_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox id="invNo_txtBox" maxlength="50"> </textbox> </div> <div class="col-1-4 ie-alignment" id="invDate" visible="false"> <hbox> <label id="invDate_lbl"> </label> <label id="invDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="invDate_dtBox" readonly="true"> </datebox> </div> <div class="col-1-4 ie-alignment" id="invRecDate" visible="false"> <hbox> <label id="invRecDate_lbl"> </label> <label id="invRecDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="invRecDate_dtBox" readonly="false"> </datebox> </div> <div class="col-1-4 ie-alignment" id="claimDate" visible="false"> <hbox> <label id="claimDate_lbl"> </label> <label id="claimDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="claimDate_dtBox" readonly="true"> </datebox> </div> <div class="col-1-4" id="claimType" visible="false"> <hbox> <label id="claimType_lbl"> </label> <label id="claimType_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <combobox id="claimType_cmbBox" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <div class="col-1-4" visible="false" id="poNumber"> <hbox> <label id="poNumber_lbl"> </label> <label id="poNumber_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox id="poNumber_txtBox" maxlength="240"> </textbox> </div> <div class="col-1-4" id="requisitioner"> <hbox> <label id="requisitioner_lbl"> </label> <label id="requisitioner_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <commonlistboxwithsearch id="requisitioner_cmbBox" winwidth="600px" winheight="500" textreadonly="false" pagesize="8" comboid="1800002" visible="true" windowtitle="Select Requisitioner"> </commonlistboxwithsearch> </div> <div class="col-1-4" id="poBuyer"> <hbox> <label id="poBuyer_lbl"> </label> <label id="poBuyer_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <commonlistboxwithsearch id="poBuyer_cmbbox" winwidth="600px" winheight="500" textreadonly="false" pagesize="8" comboid="1800004" visible="true" windowtitle="Select PO Buyer" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> </commonlistboxwithsearch> </div> <div class="col-1-4" visible="false" id="grn"> <hbox> <label id="grn_lbl"> </label> <label id="grn_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="20" id="grn_txtBox"> </textbox> </div> <!-- START BY SATYA : LIMIT TYPE --> <div class="col-1-4" id="limitType" visible="false"> <hbox> <label id="limitType_lbl"> Limit Type </label> <label id="limitType_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <combobox id="limitType_cmbBox" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <!-- END BY SATYA : LIMIT TYPE --> <div class="col-1-4" id="entityField" visible="false"> <hbox> <label id="entityField_lbl"> </label> <label id="entityField_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <combobox id="entityField_cmbBox" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <div class="col-1-4" id="department" visible="false"> <hbox> <label id="department_lbl"> </label> <label id="department_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <combobox id="department_cmbBox" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <!-- Added By Murtuza : Net Amount, Tax Amount : Start --> <div class="col-1-4" id="netAmount" visible="false"> <hbox> <label id="netAmount_lbl"> </label> <label id="netAmount_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <doublebox maxlength="10" id="netAmount_dblBox" format="0.00"> </doublebox> </div> <div class="col-1-4" id="taxAmount" visible="false"> <hbox> <label id="taxAmount_lbl"> </label> <!-- <label id="taxAmount_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> --> </hbox> <separator></separator> <!--- maxlength="23" --> <doublebox id="taxAmount_dblBox" format="0.00"> </doublebox> </div> <!-- Added By Murtuza : Net Amount, Tax Amount : End --> <div class="col-1-4" id="invAmount" visible="false"> <hbox> <label id="invAmount_lbl"> </label> <label id="invAmount_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <!--- maxlength="23" --> <doublebox id="invAmount_dblBox" format="0.00"> </doublebox> </div> <!-- <div class="col-1-4" id="invCurr" visible="false"> <hbox> <label id="invCurr_lbl"> </label> <label id="invCurr_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <combobox id="invCurr_cmbBox" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div>--> <div class="col-1-4" id="invCurr"> <hbox> <label id="invCurr_lbl"> </label> <label id="invCurr_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <commonlistboxwithsearch id="invCurr_cmbBox" winwidth="600px" winheight="500" textreadonly="false" pagesize="8" comboid="1300009" visible="true" windowtitle="Select Invoice Currency" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> </commonlistboxwithsearch> </div> <div class="col-1-4" id="invBaseAmnt" visible="false"> <hbox> <label id="invBaseAmnt_lbl"> </label> <label id="invBaseAmnt_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <doublebox maxlength="10" id="invBaseAmnt_dblBox" format="0.00"> </doublebox> </div> <!-- Added by neha to add VAT Amount : Start --> <div class="col-1-4" id="invVAT" visible="false"> <hbox> <label id="invVAT_lbl" value="VAT"> </label> </hbox> <separator></separator> <doublebox maxlength="10" id="invVAT_dblBox" format="0.00"> </doublebox> </div> <!-- Added by neha to add VAT Amount : End --> <div class="col-1-4" id="claimAmount" visible="false"> <hbox> <label id="claimAmount_lbl"> </label> <label id="claimAmount_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <doublebox maxlength="15" format="0.00" id="claimAmount_dblBox"> </doublebox> </div> <div class="col-1-4" id="poType" visible="false"> <hbox> <label id="poType_lbl"> </label> <label id="poType_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <combobox id="poType_cmb" readonly="true"> <comboitem label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" value="-1" /> </combobox> </div> <div class="col-1-4" id="appSearch"> <hbox> <label id="appSearch_lbl" value="${c:pl('MANUAL.INV.APPROVER','INV.MANUAL.CREATION.LABELS')}" /> <label id="appSearch_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <employeeSearch id="approverSearch" visible="true" winwidth="600" winheight="580" isEmpsearch="true" isPreferredEmp="false" isSearchByEmpId="true" isSendToOnePrsn="true" isDsplyLoginEmp="true" textreadonly="false" isDisplayEmps="true" tabindex="2" searchscreenzul="${c:zp('NewEmployeeSearch')}" textcols="20"> </employeeSearch> </div> <div class="col-1-4" id="businessUnit"> <hbox> <label id="businessUnit_lbl" value="${c:pl('MANUAL.INV.BUS.UNIT','INV.MANUAL.CREATION.LABELS')}"/> <label id="businessUnit_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <!-- <combobox id="bu_cmbBox" --> <!-- visible="true" readonly="true" > --> <!-- <comboitem --> <!-- label="${c:pl('SELECT.OPTION','PTP.INV.COMMON.LABEL')}" --> <!-- value="-1" /> --> <!-- </combobox> --> <commonlistboxwithsearch id="businessUnit_cmbBox" winwidth="600px" winheight="500" textreadonly="false" pagesize="8" comboid="800103" visible="true" windowtitle="Select ${c:pl('MANUAL.INV.BUS.UNIT','INV.MANUAL.CREATION.LABELS')}" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> </commonlistboxwithsearch> </div> <div class="col-1-4" id="vendorCode" visible="false"> <hbox> <label id="vendorCode_lbl"> </label> <!-- <label value="- AP use only" />--> <label id="vendorCode_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <!-- Added by neha for vendor macro component : Start --> <!-- <commonlistboxwithsearch id="vendorCodeSearch" winwidth="600px" winheight="500" --> <!-- textreadonly="false" comboid="800152" pagesize="8" --> <!-- visible="true" windowtitle="Vendor" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> --> <!-- </commonlistboxwithsearch> --> <InvoiceVendorComponent id="vendorCodeSearch" textreadonly="false" searchscreenzul="/WEB-INF/zul/PTP/component/vendorDtlsComponent.zul" winwidth="1090" winheight="auto" isOpenFromComponent="true" /> <!-- <vendorSearch id="vendorCodeSearch" textreadonly="false" searchscreenzul="/WEB-INF/zul/PTP/component/vendorDtlsComponent.zul" winwidth="1090" winheight="auto" isOpenFromComponent="true" />--> <hbox> <textbox visible="false" maxlength="50" id="vendorCode_txtBox"> </textbox> <image id="vendorCode_img" src="/zkImages/themes/responsive/reset.png" visible="false"> </image> </hbox> <!-- Added by neha for vendor macro component : End --> </div> <div class="col-1-4" id="supplierName" visible="false"> <hbox> <label id="supplierName_lbl"> </label> <label id="supplierName_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="100" id="supplierName_txtBox" readonly="true"> </textbox> </div> <div class="col-1-4" id="supplierSite"> <hbox> <label id="supplierSite_lbl"> </label> <label id="supplierSite_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <commonlistboxwithsearch id="supplierSite_cmbBox" winwidth="600px" winheight="500" textreadonly="true" pagesize="8" comboid="1800005" visible="true" windowtitle="Select Supplier Site" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> </commonlistboxwithsearch> </div> <div class="col-1-4" id="voucherCode"> <hbox> <label id="voucherCode_lbl"> </label> <label id="voucherCode_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="50" id="voucherCode_txtBox"> </textbox> </div> <div class="col-1-4 ie-alignment" id="postingDate"> <hbox> <label id="postingDate_lbl"> </label> <label id="postingDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="postingDate_dtBox" visible="true" disabled="true"> </datebox> </div> <div class="col-1-4" id="paymentDueDate"> <hbox> <label id="paymentDueDate_lbl"> </label> <label id="paymentDueDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="paymentDueDate_dtBox" visible="true" disabled="true"> </datebox> </div> <div class="col-1-4" id="paymentNo"> <hbox> <label id="paymentNo_lbl"> </label> <label id="paymentNo_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <longbox maxlength="20" id="paymentNo_intBox"> </longbox> </div> <div class="col-1-4" id="paymentAmount" > <hbox> <label id="paymentAmount_lbl"> </label> <label id="paymentAmount_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <doublebox maxlength="10" id="paymentAmount_dblBox" format="0.00"> </doublebox> </div> <div class="col-1-4" id="paymentDate"> <hbox> <label id="paymentDate_lbl"> </label> <label id="paymentDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="paymentDate_dtBox" visible="true" disabled="true"> </datebox> </div> <div class="col-1-4" id="reason" visible="false"> <hbox> <label id="reason_lbl"> </label> <label id="reason_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <combobox id="reason_cmbBox" readonly="true"> </combobox> </div> <div class="col-1-4" visible="false" id="holdDate"> <hbox> <label id="holdDate_lbl"> </label> <label id="holdDate_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <datebox id="holdDate_dtBox" readonly="true"> </datebox> </div> <div class="col-1-4" id="apprvrEmailId" visible="false"> <hbox> <label id="apprvrEmailId_lbl"> </label> <label id="apprvrEmailId_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="50" id="apprvrEmailId_txtBox"> </textbox> </div> <div class="col-1-4" id="batchNumber" visible="false"> <hbox> <label id="batchNumber_lbl"> </label> <label id="batchNumber_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <longbox maxlength="20" id="batchNumber_txtBox"> </longbox> </div> <div class="col-1-4" id="bfrNumber" visible="false"> <hbox> <label id="bfrNumber_lbl"> </label> <label id="bfrNumber_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="20" id="bfrNumber_txtBox"> </textbox> </div> <div class="col-1-4" id="boeNumber" visible="false"> <hbox> <label id="boeNumber_lbl"> </label> <label id="boeNumber_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <longbox maxlength="20" id="boeNumber_intBox"> </longbox> </div> <div class="col-1-4" id="docError" visible="false"> <hbox> <label id="docError_lbl"> </label> <label id="docError_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="100" id="docError_txtBox"> </textbox> </div> <div class="col-1-4" id="emplName" visible="false"> <hbox> <label id="emplName_lbl"> </label> <label id="emplName_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="20" id="emplName_txtBox"> </textbox> </div> <div class="col-1-4" id="emplNumber" visible="false"> <hbox> <label id="emplNumber_lbl"> </label> <label id="emplNumber_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="20" id="emplNumber_txtBox"> </textbox> </div> <div class="col-1-4" id="improperAuthorization" visible="false"> <hbox> <label id="improperAuthorization_lbl"> </label> <label id="improperAuthorization_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false"> </label> </hbox> <separator></separator> <textbox maxlength="100" id="improperAuthorization_txtBox"> </textbox> </div> <!-- </div> --> <!-- <div class="grid grid-pad"> --> <div class="col-1-4" id="policy_breach" visible="false"> <hbox> <label id="policy_breach_lbl"> </label> <label id="policy_breach_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="100" id="policy_breach_txtBox"> </textbox> </div> <div class="col-1-4" id="other_remarks" visible="false"> <hbox> <label id="other_remarks_lbl"> </label> <label id="other_remarks_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="2000" id="other_remarks_txtBox"> </textbox> </div> <!-- </div> --> <!-- <div class="grid grid-pad"> --> </div> <div class="grid grid-pad" id="gridId"> </div> <!-- <div class="grid grid-pad"> --> <!-- </div> --> <div class="grid grid-pad"> <div class="col-1-1" id="comments" visible="false"> <hbox> <label id="comments_lbl"> </label> <label id="comments_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="false" /> </hbox> <separator></separator> <textbox maxlength="500" id="comments_txtBox" rows="5" class="textarea-resize bottom_space" cols="180" width="98%"> </textbox> </div> </div> <div id="attachment1" visible="false" style="display:block; float:left;" width="100%"> <include id="attachId" title="Attachments *" src="${c:zp('AttachPage')}" max="1" sizeInKB="15360" allowFormat="PDF" attachmentId="attachmentINV" allowAttach="true" scanDocument="false" allowDelete="true" iFrameViewerId="ifView" allowPreview="true" allowUpdate="false" showAttachmentLabel="true" defaultPreview="true" view="tabular" /> </div> <div id="attachment2" visible="false" style="display:block; float:right;" width="48%"> <include id="attachId1" title="Supporting Document" src="${c:zp('AttachPage')}" max="5" sizeInKB="15360" allowFormat="PDF,JPEG,JPG,PNG,DOC,XLS,ZIP,DOCX,XLSX,EML,TIFF,TIF" attachmentId="attachmentINV1" allowAttach="true" scanDocument="false" allowDelete="true" iFrameViewerId="ifView" allowPreview="true" allowUpdate="false" showAttachmentLabel="true" view="tabular" /> </div> <div style="display:block; float:left;" width="100%"> <label style="color:red !important" id="attachSupport" value="${c:pl('MANUAL.INVOICE.ATTACH.MSG','INV.MANUAL.CREATION.LABELS')}"> </label> </div> <div visible="false" id="attach1Msg" style="display:block; float:left;" width="100%"> <label style="color:red !important" id="attachSupport1" value="${c:pl('MANUAL.INVOICE.ATTACH1.MSG','INV.MANUAL.CREATION.LABELS')}"> </label> </div> </panelchildren> </panel> <!-- <panel height="auto" border="normal" --> <!-- class="panel_div" id="attachment_pnl"> --> <!-- <panelchildren --> <!-- class="panel_div_container"> --> <!-- </panelchildren> --> <!-- </panel> --> <!-- <div align="right"> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.SAVE','INV.MANUAL.CREATION.LABELS')}" id="invSave_btn" /> <button autodisable="self" mold="os" class="button_style1" visible="false" label="${c:pl('MANUAL.CREATION.UPDATE','INV.MANUAL.CREATION.LABELS')}" id="invUpdate_btn" /> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.RESET','INV.MANUAL.CREATION.LABELS')}" id="invReset_btn" /> </div> --> <panel height="auto" title=" Workflow Actions" border="normal" id="ActionPanel" collapsible="true" class="panel_div" visible="false"> <panelchildren class="panel_div_container"> <div align="left"> <checkbox id="chkboxUrgentProcessing" style="font-weight:bold;" label="Enable Urgent Processing" visible="false" /> </div> <div class="grid grid-pad"> <div class="col-1-4" id="divCmbAction"> <vbox> <hbox> <label id="cmbAction_Lbl" value="Action"> </label> <label class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" /> </hbox> <separator></separator> <combobox tabindex="3" id="cmbAction" readonly="true"> <comboitem value="${c:pc('COMMON.COMBO.SELECT','COMMON.CONSTANT')}" label="${c:pl('COMMON.COMBO','COMMON.LABEL')}" /> </combobox> </vbox> </div> <!-- ADDED FOR INVOICE TYPE CHANGE : START --> <div class="col-1-4" id="divInvTypeChange" visible="false"> <vbox> <hbox> <label id="lblInvTypeChange" value="${c:pl('MANUAL.INV.TYPE','INV.MANUAL.CREATION.LABELS')}" /> <label id="lblInvTypeChangeMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <combobox id="cmbInvTypeChange" visible="true" readonly="true"> </combobox> </vbox> </div> <!-- ADDED FOR INVOICE TYPE CHANGE : END --> <div class="col-1-4" id="coderDivSearch" visible="false"> <vbox> <hbox> <label id="coderSearch_lbl" value="${c:pl('MANUAL.INV.CODER','INV.MANUAL.CREATION.LABELS')}" /> <label id="coderSearch_lbl_mand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <employeeSearch id="coderSearch" visible="true" winwidth="600" winheight="580" isEmpsearch="true" isPreferredEmp="false" isSearchByEmpId="true" isSendToOnePrsn="true" isDsplyLoginEmp="true" textreadonly="false" isDisplayEmps="true" tabindex="2" searchscreenzul="${c:zp('NewEmployeeSearch')}" textcols="20"> </employeeSearch> </vbox> </div> <!-- Added by neha : Start --> <div class="col-1-4" id="cmnQueueList" visible="false"> <vbox> <label id="" class="" value="${c:pl('MANUAL.INV.QUEUE.LIST','INV.MANUAL.CREATION.LABELS')}" /> <separator></separator> <combobox tabindex="4" id="selectQueue" readonly="true"> <comboitem value="${c:pc('COMMON.COMBO.SELECT','COMMON.CONSTANT')}" label="${c:pl('COMMON.COMBO','COMMON.LABEL')}" /> </combobox> <!-- <commonlistboxwithsearch id="" winwidth="600px" winheight="500" --> <!-- textreadonly="false" comboid="800001" pagesize="8" --> <!-- visible="true" windowtitle="Select Queue to send document" searchscreenzul="${c:zp('CommonListBoxWithSearch')}"> --> <!-- </commonlistboxwithsearch> --> </vbox> </div> <div class="col-1-4" id="divReason" visible="false"> <vbox> <hbox> <label id="rrReasonLbl" value="Reason"> </label> <label id="rrMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" /> </hbox> <separator></separator> <combobox tabindex="3" id="rrReasonCmb" readonly="true"> <comboitem value="${c:pc('COMMON.COMBO.SELECT','COMMON.CONSTANT')}" label="${c:pl('COMMON.COMBO','COMMON.LABEL')}" /> </combobox> </vbox> </div> <div class="col-1-4" id="divAppList" visible="false"> <vbox id="approverList"> <hbox> <label id="frstLvlApprover" value="First Level Approver" /> <label id="frstLvlMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" /> </hbox> <separator></separator> <employeeSearch id="approverSearchQueue" visible="true" winwidth="600" winheight="580" isEmpsearch="true" isPreferredEmp="false" isSearchByEmpId="true" isSendToOnePrsn="true" isDsplyLoginEmp="true" textreadonly="false" isDisplayEmps="true" tabindex="2" searchscreenzul="${c:zp('NewEmployeeSearch')}" textcols="20"> </employeeSearch> </vbox> </div> <div class="col-1-4" id="divQueueUserList" visible="false"> <vbox id="queueUserList"> <hbox> <label id="queueUser" value="${c:pl('MANUAL.INVOICE.QUEUE.MEMBER','INV.MANUAL.CREATION.LABELS')}" /> <label id="queueUserMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" /> </hbox> <separator></separator> <employeeSearch id="queueUserSearch" visible="true" winwidth="600" winheight="580" isEmpsearch="true" isPreferredEmp="false" isSearchByEmpId="true" isSendToOnePrsn="true" isDsplyLoginEmp="true" textreadonly="false" isDisplayEmps="true" tabindex="2" searchscreenzul="${c:zp('NewEmployeeSearch')}" textcols="20"> </employeeSearch> </vbox> </div> <!-- Added by neha : end --> <div class="col-1-4" id="rrReason" visible="false"> <hbox> <!-- <label --> <!-- id="rrReasonLbl" value="Reason"> --> <!-- </label> --> <!-- <label --> <!-- class="mandatory_fields" --> <!-- value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" /> --> </hbox> <!-- <combobox --> <!-- tabindex="3" id="rrReasonCmb" readonly="true"> --> <!-- <comboitem --> <!-- value="${c:pc('COMMON.COMBO.SELECT','COMMON.CONSTANT')}" --> <!-- label="${c:pl('COMMON.COMBO','COMMON.LABEL')}" /> --> <!-- </combobox> --> </div> </div> <div class="grid grid-pad"> <div class="col-1-1" id="divEmailIds" visible="false"> <vbox> <hbox> <label id="rrReasonEmailLbl" value="Email To"> </label> <label id="rrEmailMand" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.MANDATORY','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> <separator></separator> <textbox maxlength="2000" id="rrEmailIds" rows="3" class="textarea-resize bottom_space" cols="180" width="98%"> </textbox> </vbox> </div> </div> <div class="grid grid-pad"> <div class="col-1-1" id="divEmailIdNote" visible="false"> <vbox> <hbox> <label id="rrEmailNote" class="mandatory_fields" value="${c:pl('MANUAL.INVOICE.EMAIL.NOTE','INV.MANUAL.CREATION.LABELS')}" visible="true" /> </hbox> </vbox> </div> </div> <!-- <div --> <!-- style="float:right;display:block;" align="right"> --> <!-- </div> --> <!-- <separator></separator> --> <!-- <div align="right"> --> <!-- </div> --> </panelchildren> </panel> </panelchildren> </panel> </tabpanel> <tabpanel id="codingDtlsPanel"> <panel height="auto" title="Coding Line Items" id="codingItemPanel" border="normal" collapsible="true" class="panel-search-icon-enhance" visible="false"> <panelchildren class="panel_div_container grid-coding-scroll"> <panel id="POItemPanel"> <!-- <div class="col-1-4">--> <panelchildren> <label class="label_style2" value="${c:pl('MANUAL.CREATION.PONO','INV.MANUAL.CREATION.LABELS')}"> </label> <textbox id="POSearch_txt" maxlength="50" /> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.SEARCH','INV.MANUAL.CREATION.LABELS')}" id="btnPOSearch" /> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.PO.DATA.FROM.ORACLE','INV.MANUAL.CREATION.LABELS')}" id="btnGetPOFromOracle" /> <!-- <div class="grid-scroll"> --> <grid id="POItemGrid" mold="paging" fixedLayout="true" pageSize="3"> </grid> <!-- </div> --> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.ADD','INV.MANUAL.CREATION.LABELS')}" id="btnAddPOToLine" /> </panelchildren> </panel> <!-- <grid id="codingItemGrid" mold="paging" fixedLayout="true" pageSize="3" width="100%"> <columns sizable="true" id="codingItemGridColumns" /> <rows id="codingItemGridRows" /> </grid> --> <div style="overflow:auto;max-height: 327px;"> <grid id="codingItemGrid" mold="paging" fixedLayout="true" width="1250px" style="overflow:auto;"> <columns sizable="false" id="codingItemGridColumns" /> <rows id="codingItemGridRows" /> </grid> </div> <separator></separator> <separator></separator> <div align="right"> <button autodisable="self" mold="os" class="button_style1" visible="false" label="${c:pl('MANUAL.CREATION.ADD','INV.MANUAL.CREATION.LABELS')}" id="codingItemGrid_btn" /> </div> <!-- Added by neha : Start --> <div id="amntDiv"> <hbox> <label id="txtNetAmnt" style="font-weight:bold"> </label> <label value=" (${c:pl('MANUAL.CREATION.INV.NET.AMNT','INV.MANUAL.CREATION.LABELS')}) + "> </label> <label id="txtVATAmnt" style="font-weight:bold"> </label> <label value=" (${c:pl('MANUAL.CREATION.INV.TAX.AMNT','INV.MANUAL.CREATION.LABELS')})= "> </label> <label id="txtTotalAmnt" style="font-weight:bold"> </label> <label value="(${c:pl('MANUAL.INVOICE.MIME.TOTAL.AMOUNT','INV.MANUAL.CREATION.LABELS')})"> </label> </hbox> </div> <!-- Added by neha : End --> </panelchildren> </panel> </tabpanel> <tabpanel id="exceptionPanel"> <include id="includeException"></include> </tabpanel> </tabpanels> </tabbox> </center> <south border="none" margins="0,0,30,10"> <div align="right"> <button mold="os" class="button_style1" label="Pull to worklist" id="btnPullToWorklist" visible="false" /> <button autodisable="self" mold="os" class="button_style1" label="Proceed" id="btnProceed" visible="false" /> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.SAVE','INV.MANUAL.CREATION.LABELS')}" id="invSave_btn" /> <button mold="os" class="button_style1" label="Save" id="btnSftpSave" visible="false" /> <button autodisable="self" mold="os" class="button_style1" visible="false" label="${c:pl('MANUAL.CREATION.UPDATE','INV.MANUAL.CREATION.LABELS')}" id="invUpdate_btn" /> <button autodisable="self" mold="os" class="button_style1" label="${c:pl('MANUAL.CREATION.RESET','INV.MANUAL.CREATION.LABELS')}" id="invReset_btn" /> <button mold="os" class="button_style1" label="Next Document" id="btnNext" visible="false" /> </div> </south> </borderlayout> </center> <east id="attachView" title="Attachment Viewer" size="54%" maxsize="500" flex="true" open="false" collapsible="true" splittable="false"> <iframe id="ifView" sclass="claim-attachment" xmlns:ca="http://www.zkoss.org/2005/zk/client/attribute" ca:onload="chartLoaded(this)"> </iframe> </east> </borderlayout> <script type="text/javascript"> <![CDATA[ function chartLoaded(obj) { /*code for attachment screen image upload zoom functionality like pdf-- added by RohitGupta--start*/ /*for alignment of img content inside the attachment view field*/ /*$('.claim-attachment').contents() this code is used as selector for iframe element*/ $('.claim-attachment').contents().find('body').css('background-color',' rgb(38,38,38)'); $('.claim-attachment').contents().find('img').css('display','block'); $('.claim-attachment').contents().find('img').css('margin','auto'); $('.claim-attachment').contents().find('img').addClass("imgAttach"); /* no attachment for preview code --start--*/ if($('.claim-attachment').contents().find("embed").length && $('.claim-attachment').contents().find("img").length) { debugger; console.log('image not required'); $('iframe').contents().find("body").css('background','none'); }else{ console.log('image loaded'); $('.claim-attachment').contents().find("body").css('background','url(/zkImages/layouts/responsive/NoContent.png) no-repeat center center'); } setTimeout(function(){ if($('.claim-attachment').contents().find("img").length) { debugger; console.log('image not required'); $('iframe').contents().find("body").css('background','none'); }else{ console.log('image loaded'); $('.claim-attachment').contents().find("body").css('background','url(/zkImages/layouts/responsive/NoContent.png) no-repeat center center'); } }, 100); /* no attachment for preview code --ends --*/ /*added this for calculating img and img container width..also added conditions on it*/ var imgA = $('.claim-attachment').contents().find('.imgAttach'); var x = imgA[0]; var p = $('.claim-attachment').contents().find('body')[0]; if(p.clientWidth > x.naturalWidth){ //for img width less than container $('.claim-attachment').contents().find('img').css('width',''); }else if(p.clientWidth==0 && x.naturalWidth > 300){ $('.claim-attachment').contents().find('img').css('width','100%'); }else if(p.clientWidth==0){ $('.claim-attachment').contents().find('img').css('width',''); }else{ $('.claim-attachment').contents().find('img').css('width','100%'); } // for loading css in iframe $('.claim-attachment').contents().find('head').append('<link type="text/css" rel="stylesheet" href="/libs/font-awesome/css/font-awesome.css" media="all" />'); $('iframe').contents().find("head") .append($("<style type='text/css'> .zoom-out-btn{position: fixed;bottom:-10px;right:-28px;}.zoom-in-btn{position: fixed;bottom: 40px;right: -28px;}.fit-to-screen-btn{position: fixed;bottom: 90px;right: -28px;}.round-btn {border-radius: 50%;background-color:#efeeee;border: 1px solid #a1abaa;font-size:13px;color:grey;margin: 50px;outline: none;box-shadow: 0 0 4px grey;display: inline-block;padding:13px;padding-bottom: 11px;}.round-btn:hover {background-color: grey;color: white;border-color: transparent;cursor: pointer;</style>")); //for fit to screen btn var fitToScreenBtn = document.createElement("BUTTON"); var counts = 0; fitToScreenBtn.className +=" fa fa-expand fa-5x round-btn fit-to-screen-btn"; fitToScreenBtn.addEventListener("click", function(){ debugger; if(counts==0){ if(p.clientWidth > x.naturalWidth){ $('.claim-attachment').contents().find('img').css('width','100%'); }else{ $('.claim-attachment').contents().find('img').css('width',''); } this.className =""; this.className +=" fa fa-compress fa-5x round-btn fit-to-screen-btn"; counts=1; } else{ if(p.clientWidth > x.naturalWidth){ $('.claim-attachment').contents().find('img').css('width',''); }else{ $('.claim-attachment').contents().find('img').css('width','100%'); } //$('.claim-attachment').contents().find('img').css('width','100%'); this.className =""; this.className +=" fa fa-expand fa-5x round-btn fit-to-screen-btn"; counts=0; } }); /*for zoom buttons*/ //for zoomIn btn var zoomInBtn = document.createElement("BUTTON"); zoomInBtn.className +=" fa fa-plus fa-5x zoom-in-btn round-btn"; zoomInBtn.addEventListener("click", function(){ var zoomIn = $('.claim-attachment').contents().find('body img')[0]; var zoomInWidth = zoomIn.width * 1.05; $('.claim-attachment').contents().find('img').css('width', ' ' + zoomInWidth + 'px'); }); //for zoomOut btn var zoomOutBtn = document.createElement("BUTTON"); zoomOutBtn.className +=" fa fa-minus fa-5x zoom-out-btn round-btn"; zoomOutBtn.addEventListener("click", function(){ var zoomOut = $('.claim-attachment').contents().find('body img')[0]; var zoomOutWidth = zoomOut.width * 0.95; $('.claim-attachment').contents().find('img').css('width', ' ' + zoomOutWidth + 'px'); }); //append all the buttons in attachment screen $('.claim-attachment').contents().find('body').append(fitToScreenBtn); $('.claim-attachment').contents().find('body').append(zoomInBtn); $('.claim-attachment').contents().find('body').append(zoomOutBtn); /*code for attachment screen image upload zoom functionality like pdf-- added by RohitGupta--end*/ } ]]> </script> </window> </zk>TestComposer.javajavaimport org.zkoss.zk.ui.*; import org.zkoss.zk.ui.event.*; import org.zkoss.zk.ui.util.*; import org.zkoss.zk.ui.ext.*; import org.zkoss.zk.au.*; import org.zkoss.zk.au.out.*; import org.zkoss.zul.*; public class TestComposer extends GenericForwardComposer{ public void doAfterCompose(Component comp) throws Exception { super.doAfterCompose(comp); } public void onClick$btn(Event e) throws InterruptedException{ Messagebox.show("Hi btn"); } }