13. Layout for Java Script code

Moved to https://ct4.us/docs/

Java Script Layout Tab inserts provided code before tag.

There is a method to create or update table records using JavaScript. CustomTables handles data sanitization and validation.

Example HTML(Desktop) layout tab:

<button onClick="SaveMe();" class="btn">Save Me</button>

Example Java Script layout tab:

function SaveMe()
{
    const record = new CustomTablesEdit();

    //Save record
    record.saveRecord('/phone-book',{ 'name': 'Ivan', 'email': 'info@ct4.us' },36);

    //Reload table row
    record.reloadRecord(36);
}

CustomTablesEdit Class Usage Manual

Overview

The CustomTablesEdit class is a JavaScript utility for handling operations on table records in web applications.

Methods

1. saveRecord(url, fieldsAndValues, listing_id, successCallback, errorCallback)

• Parameters:
  • url (string): The endpoint for the save operation, Menu Item alias. Example: "/index.php/phone-book" or "/phone-book"
  • fieldsAndValues (object): An object containing field-value pairs to be saved.
  • listing_id (number): The ID of the record being edited.
  • successCallback (function): Optional. Function to execute on successful save.
  • errorCallback (function): Optional. Function to execute on error.
• Description: Saves the provided data to a specified record. It sends a POST request with the fields and values that need to be updated. On successful completion, the successCallback is invoked, and on error, the errorCallback is called.

2. reloadRecord(listing_id)

• Parameters:
  • listing_id (number): The ID of the record to reload.
• Description: Reloads a particular table row (record) after changes have been made. It identifies the table and the specific row based on the provided listing_id and then triggers a refresh to update the displayed data.

Example Usage

// Creating an instance of CustomTablesEdit
const record = new CustomTablesEdit();

// Saving a record
function SaveMe()
{
    const record = new CustomTablesEdit();

    //Add new record
    record.saveRecord('/test-fields-1',{ 'text': 'Ivan', 'email': 'support@joomlaboat.com' },null,

    function success(data) {
        console.log('Record saved successfully', data);
        alert("New record ID: " + data.id)
    },

    function error(data) {
        console.error('Failed to save record', data);
    });
}