Interactive Checkbox Menus With jQuery CheckboxManager

CheckboxManager is a lightweight, useful jQuery plugin that lets you create custom checkbox menus with specified menu items and callback functions. This can help you create an interactive and user-friendly UI for managing tasks, selections, or any other checkbox-related interactions.

For instance, you can create a checkbox to delete a certain row in an HTML table. When the row is selected through this checkbox, a confirmation menu will be displayed with confirm and cancel buttons asking the user if they want to delete the row.

How to use it:

1. Include the CheckboxManager plugin files and the jQuery library on the webpage.

<link rel="stylesheet" href="/path/to/checkbox.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/checkbox.js"></script>

2. Create a container in your HTML to hold the checkbox and its associated menu:

<div class="checkbox-container">
</div>

3. Set up your action buttons and callback functions. Then, attach the menu to the checkbox using the .CBCreate() function as follows:

var cbMenu = {
    option1: { 
      // custom icon classes
      icon: "fa fa-check", 
      title: "Confirm", 
      negative: false 
    },
    option2: { 
      icon: "fa fa-times", 
      title: "Cancel", 
      negative: true 
    },
    // more options here
};

function handleCheckboxAction(result) {
  console.log("Action:", result.action);
  console.log("Element:", result.element);
}

$(".checkbox-container").CBCreate(cbMenu, handleCheckboxAction);

---

This awesome jQuery plugin is developed by AlfianChandra. For more Advanced Usages, please check the demo page or visit the official website.