crm_php/.hta_slug/admin/add-user.php

    <?php
    require_once('/var/www/html/.hta_config/crm_config.php');
    require_once('/var/www/html/.htac_header.php');
    require_once('/var/www/html/.htac_nav.php');
    
    try {
        $conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
        $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    } catch(PDOException $e) {
        echo "Connection failed: " . $e->getMessage();
    }
    
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
        $select_access = ['beanstalk', 'inhouse', 'teenybeans', 'iimtt', 'buzzapp', 'atheneum', 'teenybeans_curriculum'];
        $access_values_array = [];
    
        foreach ($select_access as $access) {
            if (isset($_POST[$access])) {
                $access_values_array[] = $_POST[$access];
            }
        }
        $access_value = implode(',', $access_values_array);
        $name = $_POST['name'];
        $email = $_POST['email'];
        $phone = $_POST['phone'];
        $password = md5($_POST['pass']);
        $selected_states = implode(',', $_POST['selectedStates']); // Collect selected state values
    
        try {
            $stmt = $conn->prepare("INSERT INTO users (name, email, mobile, access, pass, states) VALUES (:name, :email, :mobile, :access, :pass, :states)");
            $stmt->bindParam(':name', $name);
            $stmt->bindParam(':email', $email);
            $stmt->bindParam(':mobile', $phone);
            $stmt->bindParam(':access', $access_value);
            $stmt->bindParam(':pass', $password);
            $stmt->bindParam(':states', $selected_states); // Bind selected states
            $stmt->execute();
    
            echo "Record added successfully";
        } catch(PDOException $e) {
            echo "Error: " . $e->getMessage();
        }
    }
    ?>

    <div style="display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 30px; margin-bottom: 30px;">
        <form action="" method="post" style="width: 600px; max-width: 600px; border: 1px solid #36365050; padding: 20px; border-radius: 20px; box-shadow: 0px 0px 10px 0px #363650;">
            <p style="font-size: 25px; font-weight: bold; margin-top: 10px; margin-bottom: 10px;">Add new user</p>
            <div style="display: flex; flex-direction: column;">
                <label for="name">Name:</label>
                <input type="text" name="name" id="name" style="border: 1px solid #363650; border-radius: 5px; padding: 6px;" />
            </div>
            <div style="display: flex; flex-direction: column;">
                <label for="email">E-mail:</label>
                <input type="text" name="email" id="email" style="border: 1px solid #363650; border-radius: 5px; padding: 6px;" />
            </div>
            <div style="display: flex; flex-direction: column;">
                <label for="phone">Phone:</label>
                <input type="text" name="phone" id="phone" style="border: 1px solid #363650; border-radius: 5px; padding: 6px;" />
            </div>
            <div style="display: flex; flex-direction: column;">
                <p>Access:</p>
                <?php
                    try {
                        $stmt = $conn->prepare("SELECT * FROM business_verticals");
                        $stmt->execute();
                        $rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
                        $num_rows = $stmt->rowCount();
                        if ($num_rows >= 1) {
                            foreach($rows as $row){ ?>
                                <div>
                                    <input type="checkbox" name="<?php echo $row['bv']; ?>" id="<?php echo $row['bv']; ?>" value="<?php echo $row['bv']; ?>"  />
                                    <label for="<?php echo $row['bv']; ?>" style="text-transform: uppercase;"><?php echo $row['bv']; ?></label>
                                </div>
                            <?php
                            }
                        } else{
                            echo "<p class='text-danger'>Not Found any Data</p>";
                        }
                    } catch (PDOException $e) {
                        echo "<p class='text-danger'>Error: " . $e->getMessage() . "</p>";
                    }
                ?>
            </div>
            <div style="display: flex; flex-direction: column;">
                <p style="font-size: 16px; font-weight: bold; margin-top: 10px;">Access by state:</p>  
                <div class="" id="stateList"><!-- State checkboxes will be dynamically added here --></div>
            </div>
            <div style="display: flex; flex-direction: column;">
                <label for="pass">Password:</label>
                <input type="text" name="pass" id="pass" style="border: 1px solid #363650; border-radius: 5px; padding: 6px;" />
            </div>
            <div style="display: flex; flex-direction: column;">
                <input type="submit" name="submit" id="submit" value="Submit" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); text-align: center; padding: 10px 20px 10px 20px; color: #fff; border-radius: 6px; float: right; margin-top: 30px;" />
            </div>
        </form>
    </div>
    <script>
        // JavaScript code to fetch data and populate checkboxes
        fetch(`https://api.siliconpin.com/v3/list/country/state/?country=IN`)
            .then(res => res.json())
            .then(data => {
                const stateList = document.getElementById('stateList');
                data.forEach(state => {
                    const checkbox = document.createElement('input');
                    checkbox.type = 'checkbox';
                    checkbox.value = state.iso2;
                    checkbox.name = 'selectedStates[]'; // Adjust name as per your form's needs

                    const label = document.createElement('label');
                    label.appendChild(checkbox);
                    label.appendChild(document.createTextNode('\u00A0' + state.name)); // Adding a non-breaking space before the state name

                    stateList.appendChild(label);
                });
            });
    </script>
    <style>
      

        /* For small screens */
    @media screen and (max-width: 767px) {
    #stateList {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 2 columns */
        gap: 10px; /* Adjust the gap as needed */
    }
    }

    /* For large screens */
    @media screen and (min-width: 768px) {
    #stateList {
        display: grid;
        grid-template-columns: repeat(2, 1fr); /* 3 columns */
        gap: 10px; /* Adjust the gap as needed */
    }
    }
    </style>