Panel

HTML Code is a new feature in Joget DX 8 Page Components.

Introduction

Image Added

Configure HTML Code

Image Added

Name

Description

Custom ID

Item link slug. Optional field.

Info
Ensure that value defined here is unique to other userview menus in the app, since the first matching/conflicting ID will take precedence in page loading.

HTML

HTML is a page component can be used to achieve advanced form design by putting in any valid -

HTML

Code Block

language	xml
title	Sample

<b>this text is in bold</b>

Code Block

language	xml
title	Sample

<input type="text" id="fname" name="fname" value="">

Info

title	The <input> Element

Any <input> element in the custom HTML will automatically create a database table column based on the name attribute.

To retrieve the value back, you can enable Auto populate saved value? under Advanced Options below.

JavaScript (jQuery is supported)
Don’t forget to put in <script type="text/javascript"></script> block
Code Block
language xml
title Sample
<script type="text/javascript"> alert("hello world"); </script>
CSS
Don’t forget to put in <style type="text/css"></style> block
Code Block
language xml
title Sample
<style type="text/css"> body{ font-size: 100%; } </style>

Image Added