Add info properties

This commit is contained in:
Dan 2025-03-18 15:27:21 +07:00
commit 65afc01fe5
10 changed files with 171 additions and 133 deletions

View file

@ -201,15 +201,16 @@ $( function() {
<?php foreach ($fields as $fld):?> <?php foreach ($fields as $fld):?>
<?php if ($fld->type == 'text'):?> <?php if ($fld->type == 'text'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<input type="<?php echo $fld->type;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/> <input type="<?php echo $fld->type;?>" placeholder="<?php echo $fld->info;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/>
<br> <br>
<?php elseif ($fld->type == 'textarea'):?> <?php elseif ($fld->type == 'textarea'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" name="<?php echo $fld->name;?>"></textarea> <textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" placeholder="<?php echo $fld->info;?>" name="<?php echo $fld->name;?>"></textarea>
<br> <br>
<?php elseif ($fld->type == 'checkbox'):?> <?php elseif ($fld->type == 'checkbox'):?>
<input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" > <input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" >
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<br> <br>
<?php elseif ($fld->type == 'select'):?> <?php elseif ($fld->type == 'select'):?>
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
@ -218,6 +219,7 @@ $( function() {
<option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option> <option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option>
<?php endforeach;?> <?php endforeach;?>
</select> </select>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<?php endif;?> <?php endif;?>
<?php endforeach;?> <?php endforeach;?>
</div> </div>

View file

@ -69,15 +69,16 @@ if ($type == 'is_page') {
<?php foreach ($fields as $fld):?> <?php foreach ($fields as $fld):?>
<?php if ($fld->type == 'text'):?> <?php if ($fld->type == 'text'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<input type="<?php echo $fld->type;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/> <input type="<?php echo $fld->type;?>" placeholder="<?php echo $fld->info;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/>
<br> <br>
<?php elseif ($fld->type == 'textarea'):?> <?php elseif ($fld->type == 'textarea'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" name="<?php echo $fld->name;?>"></textarea> <textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" placeholder="<?php echo $fld->info;?>" name="<?php echo $fld->name;?>"></textarea>
<br> <br>
<?php elseif ($fld->type == 'checkbox'):?> <?php elseif ($fld->type == 'checkbox'):?>
<input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" > <input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" >
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<br> <br>
<?php elseif ($fld->type == 'select'):?> <?php elseif ($fld->type == 'select'):?>
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
@ -86,6 +87,7 @@ if ($type == 'is_page') {
<option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option> <option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option>
<?php endforeach;?> <?php endforeach;?>
</select> </select>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<?php endif;?> <?php endif;?>
<?php endforeach;?> <?php endforeach;?>
</div> </div>

View file

@ -5,45 +5,50 @@
$field = array(); $field = array();
$field_file= 'content/data/field/page.json'; $field_file= 'content/data/field/page.json';
if (file_exists($field_file)) { if (file_exists($field_file)) {
$field = file_get_contents($field_file, true); $field = file_get_contents($field_file, true);
} }
?> ?>
<!-- Preview Section --> <!-- Preview Section -->
<div id="form-preview"></div> <div id="form-preview"></div>
<br><br> <br><br>
<!-- Form Input Section --> <!-- Form Input Section -->
<div> <div class="form-group">
<label for="type">Field Type</label> <label for="type">Field Type</label>
<br>
<select id="type"> <select id="type">
<option value="text">Text</option> <option value="text">Text</option>
<option value="textarea">Textarea</option> <option value="textarea">Textarea</option>
<option value="checkbox">Checkbox</option> <option value="checkbox">Checkbox</option>
<option value="select">Select</option> <option value="select">Select</option>
</select> </select>
<input type="text" id="name" placeholder="Name (ID)"> <input type="text" id="name" placeholder="Name (required)">
<input type="text" id="label" placeholder="Label"> <input type="text" id="label" placeholder="Label (required)">
<input type="text" id="value" placeholder="Value (optional)"> <input type="text" id="value" placeholder="Value (optional)">
<input type="text" id="info" placeholder="Field Info (optional)">
<button id="add-field" class="btn btn-primary">Add Field</button> <button id="add-field" class="btn btn-primary">Add Field</button>
<div id="options-container" style="display: none;"> <div id="options-container" style="display: none;">
<strong>Options</strong> <strong>Options</strong>
<div id="option-list"></div> <div id="option-list"></div>
<button id="add-option" class="btn btn-primary">Add Option</button> <button id="add-option" class="btn btn-primary btn-xs">Add Option</button>
</div> </div>
</div> </div>
<br><br> <br><br>
<!-- Form submit Section --> <!-- Form submit Section -->
<button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button> <button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button>
<br><br> <br><br>
<!-- JSON Output Section --> <!-- JSON Output Section -->
<details> <details>
<summary>JSON Output</summary> <summary style="padding:10px; margin-bottom:10px; <?php echo ((config('admin.theme') === 'light' || is_null(config('admin.theme'))) ? "background-color: #E4EBF1;" : "background-color: rgba(255,255,255,.1);");?>">JSON Output</summary>
<textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea> <textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea>
</details> </details>
<br><br>
<br><br>
<script> <script>
const fields = <?php print_r($field);?>; const fields = <?php print_r($field);?>;
$("#saveButton").click(function(){ $("#saveButton").click(function(){

View file

@ -5,45 +5,50 @@
$field = array(); $field = array();
$field_file = 'content/data/field/post.json'; $field_file = 'content/data/field/post.json';
if (file_exists($field_file)) { if (file_exists($field_file)) {
$field = file_get_contents($field_file, true); $field = file_get_contents($field_file, true);
} }
?> ?>
<!-- Preview Section --> <!-- Preview Section -->
<div id="form-preview"></div> <div id="form-preview"></div>
<br><br> <br><br>
<!-- Form Input Section --> <!-- Form Input Section -->
<div> <div class="form-group">
<label for="type">Field Type</label> <label for="type">Field Type</label>
<br>
<select id="type"> <select id="type">
<option value="text">Text</option> <option value="text">Text</option>
<option value="textarea">Textarea</option> <option value="textarea">Textarea</option>
<option value="checkbox">Checkbox</option> <option value="checkbox">Checkbox</option>
<option value="select">Select</option> <option value="select">Select</option>
</select> </select>
<input type="text" id="name" placeholder="Name (ID)"> <input type="text" id="name" placeholder="Name (required)">
<input type="text" id="label" placeholder="Label"> <input type="text" id="label" placeholder="Label (required)">
<input type="text" id="value" placeholder="Value (optional)"> <input type="text" id="value" placeholder="Value (optional)">
<input type="text" id="info" placeholder="Field Info (optional)">
<button id="add-field" class="btn btn-primary">Add Field</button> <button id="add-field" class="btn btn-primary">Add Field</button>
<div id="options-container" style="display: none;"> <div id="options-container" style="display: none;">
<strong>Options</strong> <strong>Options</strong>
<div id="option-list"></div> <div id="option-list"></div>
<button id="add-option" class="btn btn-primary">Add Option</button> <button id="add-option" class="btn btn-primary btn-xs">Add Option</button>
</div> </div>
</div> </div>
<br><br> <br><br>
<!-- Form submit Section --> <!-- Form submit Section -->
<button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button> <button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button>
<br><br> <br><br>
<!-- JSON Output Section --> <!-- JSON Output Section -->
<details> <details>
<summary>JSON Output</summary> <summary style="padding:10px; margin-bottom:10px; <?php echo ((config('admin.theme') === 'light' || is_null(config('admin.theme'))) ? "background-color: #E4EBF1;" : "background-color: rgba(255,255,255,.1);");?>">JSON Output</summary>
<textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea> <textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea>
</details> </details>
<br><br>
<br><br>
<script> <script>
const fields = <?php print_r($field);?>; const fields = <?php print_r($field);?>;
$("#saveButton").click(function(){ $("#saveButton").click(function(){

View file

@ -5,45 +5,50 @@
$field = array(); $field = array();
$field_file = 'content/data/field/profile.json'; $field_file = 'content/data/field/profile.json';
if (file_exists($field_file)) { if (file_exists($field_file)) {
$field = file_get_contents($field_file, true); $field = file_get_contents($field_file, true);
} }
?> ?>
<!-- Preview Section --> <!-- Preview Section -->
<div id="form-preview"></div> <div id="form-preview"></div>
<br><br> <br><br>
<!-- Form Input Section --> <!-- Form Input Section -->
<div> <div class="form-group">
<label for="type">Field Type</label> <label for="type">Field Type</label>
<br>
<select id="type"> <select id="type">
<option value="text">Text</option> <option value="text">Text</option>
<option value="textarea">Textarea</option> <option value="textarea">Textarea</option>
<option value="checkbox">Checkbox</option> <option value="checkbox">Checkbox</option>
<option value="select">Select</option> <option value="select">Select</option>
</select> </select>
<input type="text" id="name" placeholder="Name (ID)"> <input type="text" id="name" placeholder="Name (required)">
<input type="text" id="label" placeholder="Label"> <input type="text" id="label" placeholder="Label (required)">
<input type="text" id="value" placeholder="Value (optional)"> <input type="text" id="value" placeholder="Value (optional)">
<input type="text" id="info" placeholder="Field Info (optional)">
<button id="add-field" class="btn btn-primary">Add Field</button> <button id="add-field" class="btn btn-primary">Add Field</button>
<div id="options-container" style="display: none;"> <div id="options-container" style="display: none;">
<strong>Options</strong> <strong>Options</strong>
<div id="option-list"></div> <div id="option-list"></div>
<button id="add-option" class="btn btn-primary">Add Option</button> <button id="add-option" class="btn btn-primary btn-xs">Add Option</button>
</div> </div>
</div> </div>
<br><br> <br><br>
<!-- Form submit Section --> <!-- Form submit Section -->
<button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button> <button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button>
<br><br> <br><br>
<!-- JSON Output Section --> <!-- JSON Output Section -->
<details> <details>
<summary>JSON Output</summary> <summary style="padding:10px; margin-bottom:10px; <?php echo ((config('admin.theme') === 'light' || is_null(config('admin.theme'))) ? "background-color: #E4EBF1;" : "background-color: rgba(255,255,255,.1);");?>">JSON Output</summary>
<textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea> <textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea>
</details> </details>
<br><br>
<br><br>
<script> <script>
const fields = <?php print_r($field);?>; const fields = <?php print_r($field);?>;
$("#saveButton").click(function(){ $("#saveButton").click(function(){

View file

@ -5,45 +5,50 @@
$field = array(); $field = array();
$field_file = 'content/data/field/subpage.json'; $field_file = 'content/data/field/subpage.json';
if (file_exists($field_file)) { if (file_exists($field_file)) {
$field = file_get_contents($field_file, true); $field = file_get_contents($field_file, true);
} }
?> ?>
<!-- Preview Section --> <!-- Preview Section -->
<div id="form-preview"></div> <div id="form-preview"></div>
<br><br> <br><br>
<!-- Form Input Section --> <!-- Form Input Section -->
<div> <div class="form-group">
<label for="type">Field Type</label> <label for="type">Field Type</label>
<br>
<select id="type"> <select id="type">
<option value="text">Text</option> <option value="text">Text</option>
<option value="textarea">Textarea</option> <option value="textarea">Textarea</option>
<option value="checkbox">Checkbox</option> <option value="checkbox">Checkbox</option>
<option value="select">Select</option> <option value="select">Select</option>
</select> </select>
<input type="text" id="name" placeholder="Name (ID)"> <input type="text" id="name" placeholder="Name (required)">
<input type="text" id="label" placeholder="Label"> <input type="text" id="label" placeholder="Label (required)">
<input type="text" id="value" placeholder="Value (optional)"> <input type="text" id="value" placeholder="Value (optional)">
<input type="text" id="info" placeholder="Field Info (optional)">
<button id="add-field" class="btn btn-primary">Add Field</button> <button id="add-field" class="btn btn-primary">Add Field</button>
<div id="options-container" style="display: none;"> <div id="options-container" style="display: none;">
<strong>Options</strong> <strong>Options</strong>
<div id="option-list"></div> <div id="option-list"></div>
<button id="add-option" class="btn btn-primary">Add Option</button> <button id="add-option" class="btn btn-primary btn-xs">Add Option</button>
</div> </div>
</div> </div>
<br><br> <br><br>
<!-- Form submit Section --> <!-- Form submit Section -->
<button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button> <button class="btn btn-primary" id="saveButton"><?php echo i18n('save');?></button>
<br><br> <br><br>
<!-- JSON Output Section --> <!-- JSON Output Section -->
<details> <details>
<summary>JSON Output</summary> <summary style="padding:10px; margin-bottom:10px; <?php echo ((config('admin.theme') === 'light' || is_null(config('admin.theme'))) ? "background-color: #E4EBF1;" : "background-color: rgba(255,255,255,.1);");?>">JSON Output</summary>
<textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea> <textarea id="json-output" name="page-field" style="field-sizing: content;" rows="20" class="form-control text" readonly></textarea>
</details> </details>
<br><br>
<br><br>
<script> <script>
const fields = <?php print_r($field);?>; const fields = <?php print_r($field);?>;
$("#saveButton").click(function(){ $("#saveButton").click(function(){

View file

@ -9,28 +9,28 @@
</p> </p>
<table class="table post-list"> <table class="table post-list">
<thead> <thead>
<tr class="head"> <tr class="head">
<th>Type</th> <th>Type</th>
<th><?php echo i18n('Operations');?></th> <th><?php echo i18n('Operations');?></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td>Post</td> <td>Post</td>
<td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/post"><?php echo i18n('edit');?></a></td> <td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/post"><?php echo i18n('edit');?></a></td>
</tr> </tr>
<tr> <tr>
<td>Page</td> <td>Page</td>
<td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/page"><?php echo i18n('edit');?></a></td> <td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/page"><?php echo i18n('edit');?></a></td>
</tr> </tr>
<tr> <tr>
<td>Subpage</td> <td>Subpage</td>
<td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/subpage"><?php echo i18n('edit');?></a></td> <td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/subpage"><?php echo i18n('edit');?></a></td>
</tr> </tr>
<tr> <tr>
<td>Profile</td> <td>Profile</td>
<td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/profile"><?php echo i18n('edit');?></a></td> <td><a class="btn btn-primary btn-xs" href="<?php echo site_url();?>admin/field/profile"><?php echo i18n('edit');?></a></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>

View file

@ -250,23 +250,25 @@ $( function() {
<?php foreach ($fields as $fld):?> <?php foreach ($fields as $fld):?>
<?php if ($fld->type == 'text'):?> <?php if ($fld->type == 'text'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<input type="<?php echo $fld->type;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value="<?php echo get_field($fld->name, $content);?>"/> <input type="<?php echo $fld->type;?>" placeholder="<?php echo $fld->info;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/>
<br> <br>
<?php elseif ($fld->type == 'textarea'):?> <?php elseif ($fld->type == 'textarea'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" name="<?php echo $fld->name;?>"><?php echo get_field($fld->name, $content);?></textarea> <textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" placeholder="<?php echo $fld->info;?>" name="<?php echo $fld->name;?>"></textarea>
<br> <br>
<?php elseif ($fld->type == 'checkbox'):?> <?php elseif ($fld->type == 'checkbox'):?>
<input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" <?php echo get_field($fld->name, $content);?>> <input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" >
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<br> <br>
<?php elseif ($fld->type == 'select'):?> <?php elseif ($fld->type == 'select'):?>
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<select id="<?php echo $fld->name;?>" class="form-control" name="<?php echo $fld->name;?>"> <select id="<?php echo $fld->name;?>" class="form-control" name="<?php echo $fld->name;?>">
<?php foreach ($fld->options as $val):?> <?php foreach ($fld->options as $val):?>
<option value="<?php echo $val->value;?>" <?php if (get_field($fld->name, $content) === $val->value) { echo 'selected="selected"';} ?>><?php echo $val->label;?></option> <option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option>
<?php endforeach;?> <?php endforeach;?>
</select> </select>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<?php endif;?> <?php endif;?>
<?php endforeach;?> <?php endforeach;?>
</div> </div>

View file

@ -181,23 +181,25 @@ if ($type == 'is_page' || $type == 'is_frontpage') {
<?php foreach ($fields as $fld):?> <?php foreach ($fields as $fld):?>
<?php if ($fld->type == 'text'):?> <?php if ($fld->type == 'text'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<input type="<?php echo $fld->type;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value="<?php echo get_field($fld->name, $content);?>"/> <input type="<?php echo $fld->type;?>" placeholder="<?php echo $fld->info;?>" class="form-control text" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" value=""/>
<br> <br>
<?php elseif ($fld->type == 'textarea'):?> <?php elseif ($fld->type == 'textarea'):?>
<label><?php echo $fld->label;?></label> <label><?php echo $fld->label;?></label>
<textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" name="<?php echo $fld->name;?>"><?php echo get_field($fld->name, $content);?></textarea> <textarea class="form-control text" id="<?php echo $fld->name;?>" rows="3" placeholder="<?php echo $fld->info;?>" name="<?php echo $fld->name;?>"></textarea>
<br> <br>
<?php elseif ($fld->type == 'checkbox'):?> <?php elseif ($fld->type == 'checkbox'):?>
<input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" <?php echo get_field($fld->name, $content);?>> <input type="<?php echo $fld->type;?>" id="<?php echo $fld->name;?>" name="<?php echo $fld->name;?>" >
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<br> <br>
<?php elseif ($fld->type == 'select'):?> <?php elseif ($fld->type == 'select'):?>
<label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label> <label for="<?php echo $fld->name;?>"><?php echo $fld->label;?></label>
<select id="<?php echo $fld->name;?>" class="form-control" name="<?php echo $fld->name;?>"> <select id="<?php echo $fld->name;?>" class="form-control" name="<?php echo $fld->name;?>">
<?php foreach ($fld->options as $val):?> <?php foreach ($fld->options as $val):?>
<option value="<?php echo $val->value;?>" <?php if (get_field($fld->name, $content) === $val->value) { echo 'selected="selected"';} ?>><?php echo $val->label;?></option> <option value="<?php echo $val->value;?>" ><?php echo $val->label;?></option>
<?php endforeach;?> <?php endforeach;?>
</select> </select>
<span class="d-block mt-1"><small><em><?php echo $fld->info;?></em></small></span>
<?php endif;?> <?php endif;?>
<?php endforeach;?> <?php endforeach;?>
</div> </div>

View file

@ -10,6 +10,7 @@ const typeEl = document.getElementById('type');
const nameEl = document.getElementById('name'); const nameEl = document.getElementById('name');
const labelEl = document.getElementById('label'); const labelEl = document.getElementById('label');
const valueEl = document.getElementById('value'); const valueEl = document.getElementById('value');
const infoEl = document.getElementById('info'); // New element for 'info'
const optionsContainerEl = document.getElementById('options-container'); const optionsContainerEl = document.getElementById('options-container');
const optionListEl = document.getElementById('option-list'); const optionListEl = document.getElementById('option-list');
const addOptionBtn = document.getElementById('add-option'); const addOptionBtn = document.getElementById('add-option');
@ -22,6 +23,7 @@ typeEl.addEventListener('change', () => {
nameEl.value = ''; nameEl.value = '';
labelEl.value = ''; labelEl.value = '';
valueEl.value = ''; valueEl.value = '';
infoEl.value = ''; // Reset 'info' field
optionsContainerEl.style.display = typeEl.value === 'select' ? 'block' : 'none'; optionsContainerEl.style.display = typeEl.value === 'select' ? 'block' : 'none';
optionListEl.innerHTML = ''; optionListEl.innerHTML = '';
addFieldBtn.textContent = "Add Field"; addFieldBtn.textContent = "Add Field";
@ -34,12 +36,12 @@ addOptionBtn.addEventListener('click', () => {
const labelInput = document.createElement('input'); const labelInput = document.createElement('input');
labelInput.type = 'text'; labelInput.type = 'text';
labelInput.placeholder = 'Option Label'; labelInput.placeholder = 'Label (required)';
labelInput.classList.add('option-label'); labelInput.classList.add('option-label');
const valueInput = document.createElement('input'); const valueInput = document.createElement('input');
valueInput.type = 'text'; valueInput.type = 'text';
valueInput.placeholder = 'Option Value'; valueInput.placeholder = 'Value (required)';
valueInput.classList.add('option-value'); valueInput.classList.add('option-value');
valueInput.addEventListener('input', () => { valueInput.addEventListener('input', () => {
valueInput.value = valueInput.value.replace(/\s+/g, ''); // Remove spaces in real-time valueInput.value = valueInput.value.replace(/\s+/g, ''); // Remove spaces in real-time
@ -62,7 +64,8 @@ addFieldBtn.addEventListener('click', () => {
type: typeEl.value, type: typeEl.value,
name: nameEl.value.trim().replace(/\s+/g, ''), // Remove spaces name: nameEl.value.trim().replace(/\s+/g, ''), // Remove spaces
label: labelEl.value.trim(), label: labelEl.value.trim(),
value: valueEl.value.trim() value: valueEl.value.trim(),
info: infoEl.value.trim() // Add the 'info' property
}; };
if (field.type === 'select') { if (field.type === 'select') {
@ -116,6 +119,7 @@ function editField(index) {
nameEl.value = field.name.replace(/\s+/g, ''); // Remove spaces nameEl.value = field.name.replace(/\s+/g, ''); // Remove spaces
labelEl.value = field.label; labelEl.value = field.label;
valueEl.value = field.value || ''; valueEl.value = field.value || '';
infoEl.value = field.info || ''; // Populate 'info' input field
if (field.type === 'select') { if (field.type === 'select') {
optionsContainerEl.style.display = 'block'; optionsContainerEl.style.display = 'block';
@ -126,13 +130,13 @@ function editField(index) {
const labelInput = document.createElement('input'); const labelInput = document.createElement('input');
labelInput.type = 'text'; labelInput.type = 'text';
labelInput.placeholder = 'Option Label'; labelInput.placeholder = 'Label (required)';
labelInput.value = opt.label; labelInput.value = opt.label;
labelInput.classList.add('option-label'); labelInput.classList.add('option-label');
const valueInput = document.createElement('input'); const valueInput = document.createElement('input');
valueInput.type = 'text'; valueInput.type = 'text';
valueInput.placeholder = 'Option Value'; valueInput.placeholder = 'Value (required)';
valueInput.value = opt.value.replace(/\s+/g, ''); // Remove spaces valueInput.value = opt.value.replace(/\s+/g, ''); // Remove spaces
valueInput.classList.add('option-value'); valueInput.classList.add('option-value');
valueInput.addEventListener('input', () => { valueInput.addEventListener('input', () => {
@ -171,13 +175,13 @@ function updatePreviewAndOutput() {
wrapper.setAttribute('class', 'field-preview form-group'); wrapper.setAttribute('class', 'field-preview form-group');
const label = document.createElement('label'); const label = document.createElement('label');
label.innerHTML = f.label + " <br><small>Field ID:</small> <code>"+ f.name + "</code>"; label.innerHTML = `${f.label} <br><small>Field ID:</small> <code>${f.name}</code>`;
wrapper.appendChild(label); wrapper.appendChild(label);
let el; let el;
if (f.type === 'textarea') { if (f.type === 'textarea') {
el = document.createElement('textarea'); el = document.createElement('textarea');
el.placeholder = f.label; el.placeholder = f.info;
el.setAttribute('class', 'form-control'); el.setAttribute('class', 'form-control');
el.value = f.value; el.value = f.value;
} else if (f.type === 'checkbox') { } else if (f.type === 'checkbox') {
@ -204,13 +208,19 @@ function updatePreviewAndOutput() {
el = document.createElement('input'); el = document.createElement('input');
el.type = f.type; el.type = f.type;
el.value = f.value; el.value = f.value;
el.placeholder = f.label; el.placeholder = f.info;
el.setAttribute('class', 'form-control'); el.setAttribute('class', 'form-control');
} }
if (el) { if (el) {
wrapper.appendChild(el); wrapper.appendChild(el);
} }
if (f.type === 'checkbox' || f.type === 'select') {
const tip = document.createElement('span');
tip.innerHTML = `<small class="d-block mt-1"><em>${f.info}</em></small>`;
wrapper.appendChild(tip);
}
const editBtn = document.createElement('button'); const editBtn = document.createElement('button');
editBtn.textContent = 'Edit'; editBtn.textContent = 'Edit';
@ -231,13 +241,13 @@ function updatePreviewAndOutput() {
nameEl.value = ''; nameEl.value = '';
labelEl.value = ''; labelEl.value = '';
valueEl.value = ''; valueEl.value = '';
infoEl.value = ''; // Reset 'info' field
optionsContainerEl.style.display = 'none'; optionsContainerEl.style.display = 'none';
optionListEl.innerHTML = ''; optionListEl.innerHTML = '';
typeEl.value = "text"; typeEl.value = "text";
addFieldBtn.textContent = "Add Field"; addFieldBtn.textContent = "Add Field";
} }
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
updatePreviewAndOutput(); updatePreviewAndOutput();