commit
This commit is contained in:
parent
fd2250fdc1
commit
2d73e91eb8
|
@ -4,6 +4,17 @@ defined('BASEPATH') or exit('No direct script access allowed');
|
||||||
class Form_controller extends CI_Controller
|
class Form_controller extends CI_Controller
|
||||||
{
|
{
|
||||||
|
|
||||||
|
public function index() {
|
||||||
|
// Fetch the data
|
||||||
|
$this->load->model('Form_model');
|
||||||
|
$this->load->model('Response_model');
|
||||||
|
$data['total_forms'] = $this->Form_model->get_total_forms();
|
||||||
|
$data['published_forms'] = $this->Form_model->get_published_forms();
|
||||||
|
$data['total_responses'] = $this->Response_model->get_total_responses();
|
||||||
|
// var_dump($data);
|
||||||
|
// Load the view and pass the data
|
||||||
|
$this->load->view('list_forms', $data);
|
||||||
|
}
|
||||||
public function index_forms($form_id = null)
|
public function index_forms($form_id = null)
|
||||||
{
|
{
|
||||||
$this->load->model('Frontend_model');
|
$this->load->model('Frontend_model');
|
||||||
|
|
|
@ -37,7 +37,7 @@ class Forms extends CI_Controller
|
||||||
public function response_preview($form_id)
|
public function response_preview($form_id)
|
||||||
{
|
{
|
||||||
if (!$this->session->userdata('logged_in')) {
|
if (!$this->session->userdata('logged_in')) {
|
||||||
// If not logged in, redirect to login page
|
// If not logged in, redirect to login page with form_id as a parameter
|
||||||
redirect('users/login/' . $form_id);
|
redirect('users/login/' . $form_id);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -47,6 +47,14 @@ class Forms extends CI_Controller
|
||||||
// Fetch the form details
|
// Fetch the form details
|
||||||
$form = $this->preview_model->get_form($form_id);
|
$form = $this->preview_model->get_form($form_id);
|
||||||
|
|
||||||
|
// Check if the form is responsive
|
||||||
|
if ($form->is_responsive == 0) {
|
||||||
|
// Pass a message to the view
|
||||||
|
$data['message'] = "This form is not accepting responses.";
|
||||||
|
$this->load->view('response_submit', $data);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
// Fetch the questions for the form
|
// Fetch the questions for the form
|
||||||
$questions = $this->preview_model->get_questions($form_id);
|
$questions = $this->preview_model->get_questions($form_id);
|
||||||
|
|
||||||
|
@ -61,6 +69,7 @@ class Forms extends CI_Controller
|
||||||
|
|
||||||
$this->load->view('response_submit', $data);
|
$this->load->view('response_submit', $data);
|
||||||
}
|
}
|
||||||
|
|
||||||
public function preview_back($form_id) {
|
public function preview_back($form_id) {
|
||||||
if (!$this->session->userdata('logged_in')) {
|
if (!$this->session->userdata('logged_in')) {
|
||||||
// If not logged in, redirect to login page
|
// If not logged in, redirect to login page
|
||||||
|
|
|
@ -46,9 +46,36 @@ class Publish_controller extends CI_Controller {
|
||||||
}
|
}
|
||||||
$this->load->model('Publish_model');
|
$this->load->model('Publish_model');
|
||||||
// Update is_published to 0
|
// Update is_published to 0
|
||||||
$this->Publish_model->update_form($form_id, ['is_published' => 0]);
|
$this->Publish_model->update_form($form_id, ['is_responsive' => 1]);
|
||||||
|
|
||||||
// Redirect to the list_user_published_forms function
|
|
||||||
redirect('published_forms');
|
// redirect('published_forms');
|
||||||
|
}
|
||||||
|
public function toggle_responsive($form_id) {
|
||||||
|
if (!$this->session->userdata('logged_in')) {
|
||||||
|
redirect('users/login');
|
||||||
|
}
|
||||||
|
|
||||||
|
$is_responsive = $this->input->post('is_responsive', true);
|
||||||
|
|
||||||
|
if ($is_responsive === null) {
|
||||||
|
log_message('error', 'is_responsive is null');
|
||||||
|
echo json_encode(['success' => false, 'message' => 'Invalid data received']);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
log_message('info', 'is_responsive received: ' . $is_responsive);
|
||||||
|
|
||||||
|
$this->load->model('Publish_model');
|
||||||
|
$update_result = $this->Publish_model->update_form($form_id, ['is_responsive' => $is_responsive]);
|
||||||
|
|
||||||
|
if ($update_result) {
|
||||||
|
echo json_encode(['success' => true]);
|
||||||
|
} else {
|
||||||
|
log_message('error', 'Failed to update is_responsive');
|
||||||
|
echo json_encode(['success' => false, 'message' => 'Failed to update']);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
|
@ -29,12 +29,7 @@ class Users extends CI_Controller
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
|
||||||
* function to login into google forms
|
|
||||||
* @param null
|
|
||||||
* @return mixed(data return type)
|
|
||||||
* @author torun
|
|
||||||
*/
|
|
||||||
public function login($form_id = null)
|
public function login($form_id = null)
|
||||||
{
|
{
|
||||||
$data['title'] = 'Sign In';
|
$data['title'] = 'Sign In';
|
||||||
|
@ -48,7 +43,6 @@ class Users extends CI_Controller
|
||||||
$this->load->view('users/login', $data);
|
$this->load->view('users/login', $data);
|
||||||
$this->load->view('templates/footer');
|
$this->load->view('templates/footer');
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
// Get username
|
// Get username
|
||||||
$username = $this->input->post('username');
|
$username = $this->input->post('username');
|
||||||
// Get and encrypt the password
|
// Get and encrypt the password
|
||||||
|
@ -66,8 +60,6 @@ class Users extends CI_Controller
|
||||||
);
|
);
|
||||||
|
|
||||||
$this->session->set_userdata($user_data);
|
$this->session->set_userdata($user_data);
|
||||||
$person_id = $this->session->userdata('user_id');
|
|
||||||
|
|
||||||
|
|
||||||
// Set message
|
// Set message
|
||||||
$this->session->set_flashdata('user_loggedin', 'You are now logged in');
|
$this->session->set_flashdata('user_loggedin', 'You are now logged in');
|
||||||
|
@ -75,13 +67,13 @@ class Users extends CI_Controller
|
||||||
if ($form_id) {
|
if ($form_id) {
|
||||||
redirect('forms/response_preview/' . $form_id);
|
redirect('forms/response_preview/' . $form_id);
|
||||||
} else {
|
} else {
|
||||||
redirect('home'); }
|
redirect('home');
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
// Set message
|
// Set message
|
||||||
$this->session->set_flashdata('login_failed', 'Login is invalid');
|
$this->session->set_flashdata('login_failed', 'Login is invalid');
|
||||||
|
|
||||||
redirect('users/login');
|
redirect('users/login/' . $form_id);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,9 +1,27 @@
|
||||||
<?php
|
<?php
|
||||||
defined('BASEPATH') OR exit('No direct script access allowed');
|
defined('BASEPATH') or exit('No direct script access allowed');
|
||||||
|
|
||||||
class Form_model extends CI_Model {
|
class Form_model extends CI_Model
|
||||||
|
{
|
||||||
|
|
||||||
public function save_form($form_data) {
|
// Get the total number of forms
|
||||||
|
public function get_total_forms()
|
||||||
|
{
|
||||||
|
$this->load->database();
|
||||||
|
|
||||||
|
return $this->db->count_all('forms');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get the number of published forms
|
||||||
|
public function get_published_forms()
|
||||||
|
{
|
||||||
|
$this->load->database();
|
||||||
|
|
||||||
|
$this->db->where('is_published', 1);
|
||||||
|
return $this->db->count_all_results('forms');
|
||||||
|
}
|
||||||
|
public function save_form($form_data)
|
||||||
|
{
|
||||||
$this->db->trans_start();
|
$this->db->trans_start();
|
||||||
|
|
||||||
foreach ($form_data as $section) {
|
foreach ($form_data as $section) {
|
||||||
|
@ -37,11 +55,13 @@ class Form_model extends CI_Model {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
public function __construct() {
|
public function __construct()
|
||||||
|
{
|
||||||
$this->load->database();
|
$this->load->database();
|
||||||
}
|
}
|
||||||
|
|
||||||
public function get_form_title($form_id) {
|
public function get_form_title($form_id)
|
||||||
|
{
|
||||||
$this->db->select('title'); // Assuming the title column in the forms table is called 'title'
|
$this->db->select('title'); // Assuming the title column in the forms table is called 'title'
|
||||||
$this->db->from('forms');
|
$this->db->from('forms');
|
||||||
$this->db->where('id', $form_id);
|
$this->db->where('id', $form_id);
|
||||||
|
|
|
@ -1,7 +1,14 @@
|
||||||
<?php
|
<?php
|
||||||
class Response_model extends CI_Model
|
class Response_model extends CI_Model
|
||||||
{
|
{
|
||||||
// 888888888888888888888
|
public function __construct() {
|
||||||
|
$this->load->database();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get the total number of responses
|
||||||
|
public function get_total_responses() {
|
||||||
|
return $this->db->count_all('responses');
|
||||||
|
}
|
||||||
|
|
||||||
public function insert_response($data)
|
public function insert_response($data)
|
||||||
{
|
{
|
||||||
|
@ -107,3 +114,4 @@ class Response_model extends CI_Model
|
||||||
return $query->row();
|
return $query->row();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,8 +1,19 @@
|
||||||
<style>/* CSS styles */
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<!-- Other head elements -->
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Form List</title>
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||||
|
<link rel="stylesheet" href="styles.css"> <!-- Link to your stylesheet -->
|
||||||
|
<style>
|
||||||
.title-column {
|
.title-column {
|
||||||
color: darkblue; /* Dark blue color for title */
|
color: darkblue; /* Dark blue color for title */
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-12 mt-4">
|
<div class="col-md-12 mt-4">
|
||||||
|
@ -13,12 +24,9 @@
|
||||||
<?= $this->session->flashdata('status'); ?>
|
<?= $this->session->flashdata('status'); ?>
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
<h3>
|
<h3>Drafts</h3>
|
||||||
Drafts
|
|
||||||
</h3>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<!-- here your table will occur -->
|
|
||||||
<table id="basetable1" class="table table-bordered">
|
<table id="basetable1" class="table table-bordered">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
@ -36,18 +44,13 @@ Drafts
|
||||||
foreach ($forms as $row): ?>
|
foreach ($forms as $row): ?>
|
||||||
<tr>
|
<tr>
|
||||||
<td><?php echo $serialNumber++; ?></td>
|
<td><?php echo $serialNumber++; ?></td>
|
||||||
<td class="title-column">
|
<td class="title-column"><?php echo $row->title; ?></td>
|
||||||
<?php echo $row->title; ?>
|
<td><?php echo date('Y-m-d H:i:s', strtotime($row->created_at)); ?></td> <!-- Ensure date is in a sortable format -->
|
||||||
</td>
|
|
||||||
|
|
||||||
<td><?php echo $row->created_at; ?></td>
|
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo base_url('edit/' . $row->id); ?>"
|
<a href="<?php echo base_url('edit/' . $row->id); ?>" class="btn btn-success btn-sm" style="background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Edit</a>
|
||||||
class="btn btn-success btn-sm " style=" background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Edit</a>
|
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo base_url('forms/delete/' . $row->id); ?>"
|
<a href="<?php echo base_url('forms/delete/' . $row->id); ?>" class="btn btn-danger btn-sm" style="background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Delete</a>
|
||||||
class="btn btn-danger btn-sm" style=" background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Delete</a>
|
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo base_url('publish/' . $row->id); ?>">
|
<a href="<?php echo base_url('publish/' . $row->id); ?>">
|
||||||
|
@ -63,3 +66,31 @@ Drafts
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const table = document.getElementById('basetable1');
|
||||||
|
const tbody = table.querySelector('tbody');
|
||||||
|
const rows = Array.from(tbody.querySelectorAll('tr'));
|
||||||
|
|
||||||
|
rows.sort((rowA, rowB) => {
|
||||||
|
const dateTextA = rowA.cells[2].textContent.trim();
|
||||||
|
const dateTextB = rowB.cells[2].textContent.trim();
|
||||||
|
|
||||||
|
const dateA = new Date(dateTextA);
|
||||||
|
const dateB = new Date(dateTextB);
|
||||||
|
|
||||||
|
if (isNaN(dateA.getTime())) {
|
||||||
|
return 1;
|
||||||
|
}
|
||||||
|
if (isNaN(dateB.getTime())) {
|
||||||
|
return -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
return dateB - dateA;
|
||||||
|
});
|
||||||
|
|
||||||
|
rows.forEach(row => tbody.appendChild(row));
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
|
@ -7,17 +7,13 @@
|
||||||
<title>Form List</title>
|
<title>Form List</title>
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||||
<link rel="stylesheet" href="styles.css"> <!-- Link to your stylesheet -->
|
<link rel="stylesheet" href="styles.css"> <!-- Link to your stylesheet -->
|
||||||
</head>
|
<style>
|
||||||
<body>
|
|
||||||
<style>/* CSS styles */
|
|
||||||
.title-column {
|
.title-column {
|
||||||
color: darkblue; /* Dark blue color for title */
|
color: darkblue; /* Dark blue color for title */
|
||||||
}
|
}
|
||||||
|
|
||||||
.draft-row {
|
|
||||||
background-color: #f0f0f0; /* Light grey background for draft status */
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-12 mt-4">
|
<div class="col-md-12 mt-4">
|
||||||
|
@ -28,37 +24,36 @@
|
||||||
<?= $this->session->flashdata('status'); ?>
|
<?= $this->session->flashdata('status'); ?>
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
<h3>
|
<h3>Drafts</h3>
|
||||||
List of Forms
|
|
||||||
</h3>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<!-- here your table will occur -->
|
|
||||||
<table id="basetable1" class="table table-bordered">
|
<table id="basetable1" class="table table-bordered">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Forms</th>
|
<th>Drafts</th>
|
||||||
<th>Title</th>
|
<th>Title</th>
|
||||||
<th>Description</th>
|
|
||||||
<th>Created On</th>
|
<th>Created On</th>
|
||||||
<th>Status</th>
|
<th>Edit</th>
|
||||||
<th>Responses</th>
|
<th>Delete</th>
|
||||||
|
<th>Preview</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<?php
|
<?php
|
||||||
$serialNumber = 1; // Initialize the counter variable
|
$serialNumber = 1; // Initialize the counter variable
|
||||||
foreach ($forms as $row): ?>
|
foreach ($forms as $row): ?>
|
||||||
<tr class="<?php echo ($row->is_published ? '' : 'draft-row'); ?>">
|
<tr>
|
||||||
<td><?php echo $serialNumber++; ?></td>
|
<td><?php echo $serialNumber++; ?></td>
|
||||||
<td class="title-column">
|
<td class="title-column"><?php echo $row->title; ?></td>
|
||||||
<a href="<?php echo base_url('publish/' . $row->id); ?>"><?php echo $row->title; ?></a>
|
<td><?php echo date('Y-m-d H:i:s', strtotime($row->created_at)); ?></td> <!-- Ensure date is in a sortable format -->
|
||||||
</td>
|
|
||||||
<td><?php echo $row->description; ?></td>
|
|
||||||
<td><?php echo $row->created_at; ?></td>
|
|
||||||
<td><?php echo ($row->is_published ? 'Published' : 'Draft'); ?></td>
|
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo base_url('responses/' . $row->id); ?>">
|
<a href="<?php echo base_url('edit/' . $row->id); ?>" class="btn btn-success btn-sm" style="background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Edit</a>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<a href="<?php echo base_url('forms/delete/' . $row->id); ?>" class="btn btn-danger btn-sm" style="background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Delete</a>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<a href="<?php echo base_url('publish/' . $row->id); ?>">
|
||||||
<i class="fas fa-eye"></i> <!-- Eye icon -->
|
<i class="fas fa-eye"></i> <!-- Eye icon -->
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
|
@ -71,18 +66,31 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
function updateSerialNumbers() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
const table = document.getElementById('basetable1');
|
const table = document.getElementById('basetable1');
|
||||||
const rows = table.getElementsByTagName('tbody')[0].getElementsByTagName('tr');
|
const tbody = table.querySelector('tbody');
|
||||||
for (let i = 0; i < rows.length; i++) {
|
const rows = Array.from(tbody.querySelectorAll('tr'));
|
||||||
rows[i].getElementsByClassName('serial-number')[0].innerText = i + 1;
|
|
||||||
|
rows.sort((rowA, rowB) => {
|
||||||
|
const dateTextA = rowA.cells[2].textContent.trim();
|
||||||
|
const dateTextB = rowB.cells[2].textContent.trim();
|
||||||
|
|
||||||
|
const dateA = new Date(dateTextA);
|
||||||
|
const dateB = new Date(dateTextB);
|
||||||
|
|
||||||
|
if (isNaN(dateA.getTime())) {
|
||||||
|
return 1;
|
||||||
}
|
}
|
||||||
|
if (isNaN(dateB.getTime())) {
|
||||||
|
return -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', updateSerialNumbers);
|
return dateB - dateA;
|
||||||
// If you have sorting functionality, call updateSerialNumbers after sorting
|
});
|
||||||
|
|
||||||
|
rows.forEach(row => tbody.appendChild(row));
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -8,6 +8,8 @@
|
||||||
<link rel="stylesheet" href="https://bootswatch.com/3/flatly/bootstrap.min.css">
|
<link rel="stylesheet" href="https://bootswatch.com/3/flatly/bootstrap.min.css">
|
||||||
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/styles.css">
|
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/styles.css">
|
||||||
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/header_new.css">
|
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/header_new.css">
|
||||||
|
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/editview.css">
|
||||||
|
|
||||||
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/jquery-ui.css">
|
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/jquery-ui.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
|
||||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||||
|
@ -20,28 +22,8 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<style>
|
<style>
|
||||||
.form-header {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-title,
|
|
||||||
.form-description {
|
|
||||||
border: none;
|
|
||||||
border-bottom: 1px solid #ccc;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
padding-left: 0;
|
|
||||||
padding-right: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-title:focus,
|
|
||||||
.form-description:focus {
|
|
||||||
box-shadow: none;
|
|
||||||
outline: none;
|
|
||||||
border-bottom: 1px solid #007bff;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
<!-- Navbar -->
|
<!-- Navbar -->
|
||||||
<nav class="navbar navbar-custom">
|
<nav class="navbar navbar-custom">
|
||||||
|
@ -93,31 +75,32 @@
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Form Editor -->
|
||||||
|
<div class="container">
|
||||||
|
<!-- Your flash messages and other content -->
|
||||||
|
|
||||||
|
<!-- Form Editor -->
|
||||||
|
<div class="container">
|
||||||
|
<!-- Your flash messages and other content -->
|
||||||
|
|
||||||
<!-- Form Editor -->
|
<!-- Form Editor -->
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<div class="form-header">
|
||||||
<!-- <button id="preview-btn" class="btn btn-info"><i class="fas fa-eye"></i></button> -->
|
|
||||||
<input type="text" id="form-title" class="form-control form-title" value="<?php echo $form['title']; ?>">
|
<input type="text" id="form-title" class="form-control form-title" value="<?php echo $form['title']; ?>">
|
||||||
<input type="text" id="form-description" class="form-control form-description" value="<?php echo $form['description']; ?>">
|
<input type="text" id="form-description" class="form-control form-description" value="<?php echo $form['description']; ?>">
|
||||||
<button id="add-section-btn" class="btn btn-primary">+</button>
|
<button id="add-section-btn" class="btn btn-primary">+</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="form-container">
|
<div id="form-container">
|
||||||
<?php foreach ($questions as $question): ?>
|
<?php foreach ($questions as $question): ?>
|
||||||
<div class="form-section" data-index="<?php echo $question['id']; ?>"
|
<div class="form-section" data-index="<?php echo $question['id']; ?>" data-type="<?php echo $question['type']; ?>">
|
||||||
data-type="<?php echo $question['type']; ?>">
|
|
||||||
<div class="header-row">
|
<div class="header-row">
|
||||||
<input type="text" class="form-control untitled-question" placeholder="Untitled Question" rows="1"
|
<input type="text" class="form-control untitled-question" placeholder="Untitled Question" rows="1" value="<?php echo $question['text']; ?>">
|
||||||
value="<?php echo $question['text']; ?>">
|
<select class="custom-select question-type">
|
||||||
<select class="custom-select">
|
<option value="short-answer" <?php echo $question['type'] == 'short-answer' ? 'selected' : ''; ?>>Short Answer</option>
|
||||||
<option value="short-answer" <?php echo $question['type'] == 'short-answer' ? 'selected' : ''; ?>>
|
<option value="paragraph" <?php echo $question['type'] == 'paragraph' ? 'selected' : ''; ?>>Paragraph</option>
|
||||||
Short Answer</option>
|
|
||||||
<option value="paragraph" <?php echo $question['type'] == 'paragraph' ? 'selected' : ''; ?>>
|
|
||||||
Paragraph</option>
|
|
||||||
<option value="multiple-choice" <?php echo $question['type'] == 'multiple-choice' ? 'selected' : ''; ?>>Multiple Choice</option>
|
<option value="multiple-choice" <?php echo $question['type'] == 'multiple-choice' ? 'selected' : ''; ?>>Multiple Choice</option>
|
||||||
<option value="checkboxes" <?php echo $question['type'] == 'checkboxes' ? 'selected' : ''; ?>>
|
<option value="checkboxes" <?php echo $question['type'] == 'checkboxes' ? 'selected' : ''; ?>>Checkboxes</option>
|
||||||
Checkboxes</option>
|
<option value="dropdown" <?php echo $question['type'] == 'dropdown' ? 'selected' : ''; ?>>Dropdown</option>
|
||||||
<option value="dropdown" <?php echo $question['type'] == 'dropdown' ? 'selected' : ''; ?>>Dropdown
|
|
||||||
</option>
|
|
||||||
</select>
|
</select>
|
||||||
<label class="toggle-switch">
|
<label class="toggle-switch">
|
||||||
<input type="checkbox" class="required-toggle" <?php echo $question['is_required'] ? 'checked' : ''; ?>>
|
<input type="checkbox" class="required-toggle" <?php echo $question['is_required'] ? 'checked' : ''; ?>>
|
||||||
|
@ -127,24 +110,24 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="options-container">
|
<div class="options-container">
|
||||||
<?php
|
<?php
|
||||||
// Fetch options for this question only
|
|
||||||
$this->db->where('question_id', $question['id']);
|
$this->db->where('question_id', $question['id']);
|
||||||
$options = $this->db->get('options')->result_array();
|
$options = $this->db->get('options')->result_array();
|
||||||
foreach ($options as $option):
|
foreach ($options as $option):
|
||||||
|
$iconClass = ($question['type'] === 'multiple-choice' || $question['type'] === 'dropdown') ? 'fa-circle' : 'fa-square';
|
||||||
?>
|
?>
|
||||||
<div class="option">
|
<div class="option">
|
||||||
<input type="text" class="form-control option-label"
|
<i class="fas <?php echo $iconClass; ?> icon-transparent"></i>
|
||||||
value="<?php echo $option['option_text']; ?>">
|
<input type="text" class="form-control option-label" value="<?php echo $option['option_text']; ?>">
|
||||||
<span class="delete-option-icon">×</span>
|
<span class="delete-option-icon">×</span>
|
||||||
</div>
|
</div>
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
<!-- Show or hide the "Add Option" button based on question type -->
|
|
||||||
<?php if ($question['type'] === 'multiple-choice' || $question['type'] === 'checkboxes' || $question['type'] === 'dropdown'): ?>
|
<?php if ($question['type'] === 'multiple-choice' || $question['type'] === 'checkboxes' || $question['type'] === 'dropdown'): ?>
|
||||||
<button class="btn btn-primary add-option-btn">Add Option</button>
|
<button class="btn btn-primary add-option-btn">Add Option</button>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
</div>
|
</div>
|
||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<button id="submit-btn" class="btn btn-success btn-custom">Submit</button>
|
<button id="submit-btn" class="btn btn-success btn-custom">Submit</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -152,12 +135,10 @@
|
||||||
<script src="<?php echo base_url('assets/js/jquery.min.js'); ?>"></script>
|
<script src="<?php echo base_url('assets/js/jquery.min.js'); ?>"></script>
|
||||||
<script src="<?php echo base_url('assets/js/bootstrap.min.js'); ?>"></script>
|
<script src="<?php echo base_url('assets/js/bootstrap.min.js'); ?>"></script>
|
||||||
<script src="<?php echo base_url('assets/js/jquery-ui.js'); ?>"></script>
|
<script src="<?php echo base_url('assets/js/jquery-ui.js'); ?>"></script>
|
||||||
<!-- <script src="<?php echo base_url('assets/js/scripts.js'); ?>"></script> -->
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
var base_url = '<?php echo base_url(); ?>';
|
var base_url = '<?php echo base_url(); ?>';
|
||||||
var index = 1;
|
|
||||||
var activeSection = null;
|
var activeSection = null;
|
||||||
|
|
||||||
function positionAddSectionButton() {
|
function positionAddSectionButton() {
|
||||||
|
@ -174,6 +155,28 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function appendNewOption(section, questionType) {
|
||||||
|
var iconClass = "";
|
||||||
|
if (questionType === "multiple-choice") {
|
||||||
|
iconClass = "fa-circle";
|
||||||
|
} else if (questionType === "checkboxes") {
|
||||||
|
iconClass = "fa-square";
|
||||||
|
} else if (questionType === "dropdown") {
|
||||||
|
iconClass = "fa-circle";
|
||||||
|
}
|
||||||
|
|
||||||
|
var optionHtml = `
|
||||||
|
<div class="option">
|
||||||
|
<i class="fas ${iconClass} icon-transparent"></i>
|
||||||
|
<input type="text" class="form-control option-label" placeholder="Option">
|
||||||
|
<span class="delete-option-icon">×</span>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
section.find('.options-container').append(optionHtml);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Add section button functionality
|
// Add section button functionality
|
||||||
$('#add-section-btn').on('click', function () {
|
$('#add-section-btn').on('click', function () {
|
||||||
createFormSection();
|
createFormSection();
|
||||||
|
@ -188,7 +191,7 @@
|
||||||
<div class="form-section" data-type="">
|
<div class="form-section" data-type="">
|
||||||
<div class="header-row">
|
<div class="header-row">
|
||||||
<input type="text" class="form-control untitled-question" placeholder="Untitled Question" rows="1">
|
<input type="text" class="form-control untitled-question" placeholder="Untitled Question" rows="1">
|
||||||
<select class="custom-select">
|
<select class="custom-select question-type">
|
||||||
<option value="short-answer">Short Answer</option>
|
<option value="short-answer">Short Answer</option>
|
||||||
<option value="paragraph">Paragraph</option>
|
<option value="paragraph">Paragraph</option>
|
||||||
<option value="multiple-choice">Multiple Choice</option>
|
<option value="multiple-choice">Multiple Choice</option>
|
||||||
|
@ -207,8 +210,30 @@
|
||||||
`;
|
`;
|
||||||
$('#form-container').append(sectionHtml);
|
$('#form-container').append(sectionHtml);
|
||||||
|
|
||||||
// Add click event for the newly created section
|
var newSection = $('.form-section').last();
|
||||||
$('.form-section').last().on('click', function () {
|
|
||||||
|
newSection.find('.question-type').on('change', function() {
|
||||||
|
var selectedType = $(this).val();
|
||||||
|
var optionsContainer = newSection.find('.options-container');
|
||||||
|
optionsContainer.empty(); // Clear previous options
|
||||||
|
if (selectedType === 'multiple-choice' || selectedType === 'checkboxes' || selectedType === 'dropdown') {
|
||||||
|
appendNewOption(newSection, selectedType);
|
||||||
|
newSection.find('.add-option-btn').show();
|
||||||
|
} else if (selectedType === 'short-answer') {
|
||||||
|
optionsContainer.append('<input type="text" class="form-control" placeholder="Short answer text">');
|
||||||
|
newSection.find('.add-option-btn').hide();
|
||||||
|
} else if (selectedType === 'paragraph') {
|
||||||
|
optionsContainer.append('<textarea class="form-control" placeholder="Paragraph text"></textarea>');
|
||||||
|
newSection.find('.add-option-btn').hide();
|
||||||
|
} else {
|
||||||
|
newSection.find('.add-option-btn').hide();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initially hide add option button
|
||||||
|
newSection.find('.add-option-btn').hide();
|
||||||
|
|
||||||
|
newSection.on('click', function () {
|
||||||
$('.form-section').removeClass('active');
|
$('.form-section').removeClass('active');
|
||||||
$(this).addClass('active');
|
$(this).addClass('active');
|
||||||
activeSection = $(this);
|
activeSection = $(this);
|
||||||
|
@ -218,31 +243,44 @@
|
||||||
positionAddSectionButton();
|
positionAddSectionButton();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Handle option button click
|
$('.question-type').on('change', function() {
|
||||||
$(document).on('click', '.add-option-btn', function () {
|
var section = $(this).closest('.form-section');
|
||||||
var $section = $(this).closest('.form-section');
|
var selectedType = $(this).val();
|
||||||
var optionHtml = `
|
var optionsContainer = section.find('.options-container');
|
||||||
<div class="option">
|
optionsContainer.empty(); // Clear previous options
|
||||||
<input type="text" class="form-control option-label" value="">
|
if (selectedType === 'multiple-choice' || selectedType === 'checkboxes' || selectedType === 'dropdown') {
|
||||||
<span class="delete-option-icon">×</span>
|
appendNewOption(section, selectedType);
|
||||||
</div>
|
if (!section.find('.add-option-btn').length) {
|
||||||
`;
|
section.append('<button class="btn btn-primary add-option-btn">Add Option</button>');
|
||||||
$section.find('.options-container').append(optionHtml);
|
}
|
||||||
|
section.find('.add-option-btn').show();
|
||||||
|
} else if (selectedType === 'short-answer') {
|
||||||
|
optionsContainer.append('<input type="text" class="form-control" placeholder="Short answer text">');
|
||||||
|
section.find('.add-option-btn').hide();
|
||||||
|
} else if (selectedType === 'paragraph') {
|
||||||
|
optionsContainer.append('<textarea class="form-control" placeholder="Paragraph text"></textarea>');
|
||||||
|
section.find('.add-option-btn').hide();
|
||||||
|
} else {
|
||||||
|
section.find('.add-option-btn').hide();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on('click', '.add-option-btn', function () {
|
||||||
|
var $section = $(this).closest('.form-section');
|
||||||
|
var questionType = $section.find('.question-type').val();
|
||||||
|
appendNewOption($section, questionType);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Handle delete section button click
|
|
||||||
$(document).on('click', '.delete-section-icon', function () {
|
$(document).on('click', '.delete-section-icon', function () {
|
||||||
$(this).closest('.form-section').remove();
|
$(this).closest('.form-section').remove();
|
||||||
activeSection = null;
|
activeSection = null;
|
||||||
positionAddSectionButton();
|
positionAddSectionButton();
|
||||||
});
|
});
|
||||||
|
|
||||||
// Handle delete option button click
|
|
||||||
$(document).on('click', '.delete-option-icon', function () {
|
$(document).on('click', '.delete-option-icon', function () {
|
||||||
$(this).closest('.option').remove();
|
$(this).closest('.option').remove();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
$('.form-section').each(function () {
|
$('.form-section').each(function () {
|
||||||
$(this).on('click', function () {
|
$(this).on('click', function () {
|
||||||
$('.form-section').removeClass('active');
|
$('.form-section').removeClass('active');
|
||||||
|
@ -252,11 +290,11 @@
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// Handle window resize to reposition button
|
|
||||||
$(window).on('resize', function () {
|
$(window).on('resize', function () {
|
||||||
positionAddSectionButton();
|
positionAddSectionButton();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
positionAddSectionButton();
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
var base_url = '<?php echo base_url(); ?>';
|
var base_url = '<?php echo base_url(); ?>';
|
||||||
|
|
||||||
|
|
|
@ -8,6 +8,10 @@
|
||||||
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/form_preview.css">
|
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/form_preview.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<style>.form-header {
|
||||||
|
margin-left: 251px; /* Adjust the value as needed */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<div class="form-header">
|
||||||
<h2><?php echo $form->title; ?></h2>
|
<h2><?php echo $form->title; ?></h2>
|
||||||
|
|
|
@ -9,13 +9,32 @@
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<style>
|
||||||
|
|
||||||
|
.container { /* Or another parent element */
|
||||||
|
position: relative; /* Create a positioning context */
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-success {
|
||||||
|
position: relative;
|
||||||
|
left: 250px;
|
||||||
|
top: -10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-header {
|
||||||
|
/* position: absolute; */
|
||||||
|
left: 13px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<div class="form-header">
|
||||||
<h2><?php echo $form->title; ?></h2>
|
<h2><?php echo $form->title; ?></h2>
|
||||||
<br>
|
<br>
|
||||||
<h4><?php echo $form->description; ?></h4>
|
<h4><?php echo $form->description; ?></h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php foreach ($questions as $question): ?>
|
<?php foreach ($questions as $question): ?>
|
||||||
<div class="form-section">
|
<div class="form-section">
|
||||||
<div class="question-section">
|
<div class="question-section">
|
||||||
|
|
|
@ -1,10 +1,93 @@
|
||||||
<style>/* CSS styles */
|
<style>
|
||||||
|
/* CSS styles */
|
||||||
.title-column {
|
.title-column {
|
||||||
color: darkblue; /* Dark blue color for title */
|
color: darkblue;
|
||||||
|
/* Dark blue color for title */
|
||||||
}
|
}
|
||||||
|
|
||||||
.draft-row {
|
.draft-row {
|
||||||
background-color: #f0f0f0; /* Light grey background for draft status */
|
background-color: #f0f0f0;
|
||||||
|
/* Light grey background for draft status */
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
width: 34px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch input {
|
||||||
|
opacity: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: #ccc;
|
||||||
|
transition: .4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider:before {
|
||||||
|
position: absolute;
|
||||||
|
content: "";
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
left: 3px;
|
||||||
|
bottom: 3px;
|
||||||
|
background-color: white;
|
||||||
|
transition: .4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:checked+.slider {
|
||||||
|
background-color: #673AB7;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:checked+.slider:before {
|
||||||
|
transform: translateX(14px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Rounded sliders */
|
||||||
|
.slider.round {
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider.round:before {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch .tooltip {
|
||||||
|
visibility: hidden;
|
||||||
|
width: 70px;
|
||||||
|
background-color: #555;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
bottom: 125%;
|
||||||
|
/* Position above the switch */
|
||||||
|
left: 290%;
|
||||||
|
margin-left: -60px;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch:hover .tooltip {
|
||||||
|
visibility: visible;
|
||||||
|
opacity: 1;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
@ -34,17 +117,26 @@
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<?php $serialNumber = 1;foreach ($forms as $row): ?>
|
<?php $serialNumber = 1;
|
||||||
|
foreach ($forms as $row): ?>
|
||||||
<tr>
|
<tr>
|
||||||
<td><?php echo $serialNumber++; ?></td>
|
<td><?php echo $serialNumber++; ?></td>
|
||||||
<td class="title-column">
|
<td class="title-column">
|
||||||
<?php echo $row->title; ?>
|
<?php echo $row->title; ?>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo $row->response_link; ?>" target="_blank"><?php echo $row->response_link; ?></a>
|
<a href="<?php echo $row->response_link; ?>"
|
||||||
|
target="_blank"><?php echo $row->response_link; ?></a>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<a href="<?php echo base_url('Publish_controller/unpublish_form/' . $row->id); ?>" class="btn btn-danger btn-sm" style=" background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Unpublish</a>
|
<label class="switch">
|
||||||
|
<input type="checkbox" class="toggle-switch"
|
||||||
|
data-form-id="<?php echo $row->id; ?>" <?php echo $row->is_responsive ? 'checked' : ''; ?>>
|
||||||
|
<span class="slider round"></span>
|
||||||
|
<span
|
||||||
|
class="tooltip"><?php echo $row->is_responsive ? 'Active' : 'Disabled'; ?>
|
||||||
|
</span>
|
||||||
|
</label>
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td>
|
<td>
|
||||||
|
@ -58,5 +150,3 @@
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
|
@ -5,9 +5,40 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Response Details</title>
|
<title>Response Details</title>
|
||||||
<link rel="stylesheet" href="https://bootswatch.com/3/flatly/bootstrap.min.css">
|
<link rel="stylesheet" href="https://bootswatch.com/3/flatly/bootstrap.min.css">
|
||||||
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/response_details_view.css">
|
<!-- <link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/response_details_view.css"> -->
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<style>
|
||||||
|
.question-label {
|
||||||
|
display: inline; /* Makes the <p> element behave like inline text */
|
||||||
|
margin-bottom: 11px; /* Adds space below the text */
|
||||||
|
padding: 0; /* Removes default padding */
|
||||||
|
border: none; /* Removes any border */
|
||||||
|
background: none; /* Removes any background color or box shadow */
|
||||||
|
}
|
||||||
|
.form-header {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.form-description, .submitted-at, .user-email {
|
||||||
|
color: rgba(0, 0, 0, 0.5); /* Transparent text */
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-align: left; /* Align text left */
|
||||||
|
display: block; /* Ensure each element is a block element */
|
||||||
|
width: 100%; /* Ensure each element takes the full width of the container */
|
||||||
|
padding-left: 0; /* Ensure no padding is affecting alignment */
|
||||||
|
}
|
||||||
|
.form-section {
|
||||||
|
border: 1px solid #ddd; /* Adds a light grey border around the section */
|
||||||
|
border-radius: 5px; /* Optional: rounds the corners */
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Adds a subtle shadow effect */
|
||||||
|
padding: 15px; /* Adds padding inside the section */
|
||||||
|
background: #fff; /* Ensures background color is white for contrast */
|
||||||
|
margin-bottom: 15px; /* Optional: adds space below the section */
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<div class="form-header">
|
||||||
<h2><?php echo $form->title; ?></h2>
|
<h2><?php echo $form->title; ?></h2>
|
||||||
|
|
|
@ -42,20 +42,52 @@
|
||||||
});
|
});
|
||||||
return isValid;
|
return isValid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function closePopup() {
|
||||||
|
document.getElementById('popup-message').style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Display the popup message when the page loads
|
||||||
|
window.onload = function() {
|
||||||
|
if (document.getElementById('popup-message')) {
|
||||||
|
document.getElementById('popup-message').style.display = 'block';
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.popup-message {
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
background-color: white;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<!-- <div class="form-header">
|
||||||
<h2><?php echo $form->title; ?></h2>
|
<h2><?php echo $form->title; ?></h2>
|
||||||
<h4><?php echo $form->description; ?></h4>
|
<h4><?php echo $form->description; ?></h4>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<?php if (isset($message)): ?>
|
||||||
|
<div id="popup-message" class="popup-message">
|
||||||
|
<p><?php echo $message; ?></p>
|
||||||
|
<button onclick="closePopup()">Close</button>
|
||||||
</div>
|
</div>
|
||||||
|
<?php else: ?>
|
||||||
<form action="<?php echo base_url('response_submit/submit_form'); ?>" method="post" onsubmit="return validateForm();">
|
<form action="<?php echo base_url('response_submit/submit_form'); ?>" method="post" onsubmit="return validateForm();">
|
||||||
<input type="hidden" name="form_id" value="<?php echo $form->id; ?>">
|
<input type="hidden" name="form_id" value="<?php echo $form->id; ?>">
|
||||||
<div class="form-section">
|
<div class="form-section">
|
||||||
<?php foreach ($questions as $question): ?>
|
<?php foreach ($questions as $question): ?>
|
||||||
<div class="question-container" data-required="<?php echo $question->is_required; ?>">
|
<div class="question-container" data-required="<?php echo $question->is_required; ?>" data-type="<?php echo $question->type; ?>">
|
||||||
<input type="hidden" name="responses[<?php echo $question->id; ?>][question_id]" value="<?php echo $question->id; ?>">
|
<input type="hidden" name="responses[<?php echo $question->id; ?>][question_id]" value="<?php echo $question->id; ?>">
|
||||||
<input type="hidden" name="responses[<?php echo $question->id; ?>][form_id]" value="<?php echo $form->id; ?>">
|
<input type="hidden" name="responses[<?php echo $question->id; ?>][form_id]" value="<?php echo $form->id; ?>">
|
||||||
<label class="<?php echo $question->is_required ? 'required-field' : ''; ?>"><?php echo $question->text; ?></label>
|
<label class="<?php echo $question->is_required ? 'required-field' : ''; ?>"><?php echo $question->text; ?></label>
|
||||||
|
@ -89,6 +121,8 @@
|
||||||
</div>
|
</div>
|
||||||
<button type="submit" class="btn btn-success" style="display: block; margin: 20px auto 20px 240px; background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Submit</button>
|
<button type="submit" class="btn btn-success" style="display: block; margin: 20px auto 20px 240px; background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;">Submit</button>
|
||||||
</form>
|
</form>
|
||||||
|
<?php endif; ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -105,6 +105,34 @@ $(document).ready(function() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
document.querySelectorAll('.toggle-switch').forEach(function(switchElement) {
|
||||||
|
switchElement.addEventListener('change', function() {
|
||||||
|
var formId = this.getAttribute('data-form-id');
|
||||||
|
var isResponsive = this.checked ? 1 : 0;
|
||||||
|
|
||||||
|
fetch(`<?php echo base_url('Publish_controller/toggle_responsive/'); ?>${formId}`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/x-www-form-urlencoded',
|
||||||
|
'X-Requested-With': 'XMLHttpRequest'
|
||||||
|
},
|
||||||
|
body: `is_responsive=${isResponsive}`
|
||||||
|
})
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
if (data.success) {
|
||||||
|
// Optionally, handle success
|
||||||
|
} else {
|
||||||
|
// Optionally, handle failure
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
console.error('Error:', error);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -33,14 +33,45 @@
|
||||||
|
|
||||||
#submit-btn {
|
#submit-btn {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
background-color: rgb(103, 58, 183); border-color: rgb(103, 58, 183); color: white;"
|
background-color: rgb(103, 58, 183);
|
||||||
|
border-color: rgb(103, 58, 183);
|
||||||
|
color: white;
|
||||||
|
"
|
||||||
float: left;
|
float: left;
|
||||||
clear: both;
|
clear: both;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
.tooltip-container {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip-container .tooltip {
|
||||||
|
visibility: hidden;
|
||||||
|
width: 70px;
|
||||||
|
background-color: #555;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
bottom: 125%; /* Position above the button */
|
||||||
|
/* left: 50%; */
|
||||||
|
/* margin-left: 10px; */
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip-container:hover .tooltip {
|
||||||
|
visibility: visible;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
@ -63,7 +94,13 @@
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="form-header">
|
<div class="form-header">
|
||||||
<button id="preview-btn" class="btn btn-info"><i class="fas fa-eye"></i></button>
|
<div class="tooltip-container">
|
||||||
|
<button id="preview-btn" class="btn btn-info">
|
||||||
|
<i class="fas fa-eye"></i>
|
||||||
|
</button>
|
||||||
|
<span class="tooltip">Preview</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2><?php echo htmlspecialchars($title); ?></h2>
|
<h2><?php echo htmlspecialchars($title); ?></h2>
|
||||||
<!-- <h2>Untitled Form</h2> -->
|
<!-- <h2>Untitled Form</h2> -->
|
||||||
|
|
||||||
|
@ -72,7 +109,8 @@
|
||||||
<div id="form-container"></div>
|
<div id="form-container"></div>
|
||||||
|
|
||||||
<button id="submit-btn" class="btn btn-success" style="margin-left: 240px; margin-top: 20px">Submit</button>
|
<button id="submit-btn" class="btn btn-success" style="margin-left: 240px; margin-top: 20px">Submit</button>
|
||||||
<a id="cancel-btn" class="btn btn-danger" href="<?php echo base_url(); ?>" style="margin-left: 8px; margin-top: 20px; display: inline-block;">Cancel</a>
|
<a id="cancel-btn" class="btn btn-danger" href="<?php echo base_url(); ?>"
|
||||||
|
style="margin-left: 8px; margin-top: 20px; display: inline-block;">Cancel</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -85,3 +123,5 @@
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -16,6 +16,21 @@
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<style>
|
||||||
|
.navbar-custom .navbar-brand,
|
||||||
|
.navbar-custom .navbar-nav .nav-link {
|
||||||
|
color: white !important; /* Forces the text color to be white */
|
||||||
|
text-decoration: none !important; /* Ensures no underline */
|
||||||
|
background: none !important; /* Ensures no background color */
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-custom .navbar-brand:hover,
|
||||||
|
.navbar-custom .navbar-nav .nav-link:hover {
|
||||||
|
color: white !important; /* Keeps text color white on hover */
|
||||||
|
text-decoration: none !important; /* Ensures no underline on hover */
|
||||||
|
background: none !important; /* Ensures no background color on hover */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<nav class="navbar navbar-inverse" style="background-color: rgb(103, 58, 183);">
|
<nav class="navbar navbar-inverse" style="background-color: rgb(103, 58, 183);">
|
||||||
<div class="container" style="background-color: rgb(103, 58, 183);">
|
<div class="container" style="background-color: rgb(103, 58, 183);">
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<?php echo form_open('users/login', ['id' => 'login-form']); ?>
|
<?php echo form_open('users/login/'.$form_id); ?>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-4 col-md-offset-4">
|
<div class="col-md-4 col-md-offset-4">
|
||||||
<h1 class="text-center"><?= $title; ?></h1>
|
<h1 class="text-center"><?= $title; ?></h1>
|
||||||
|
|
|
@ -0,0 +1,76 @@
|
||||||
|
.form-header {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-top: -56px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-title,
|
||||||
|
.form-description {
|
||||||
|
border: none;
|
||||||
|
border-bottom: 1px solid #ccc;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-left: 0;
|
||||||
|
padding-right: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-title:focus,
|
||||||
|
.form-description:focus {
|
||||||
|
box-shadow: none;
|
||||||
|
outline: none;
|
||||||
|
border-bottom: 1px solid #007bff;
|
||||||
|
}
|
||||||
|
.option {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 5px; /* Space between options */
|
||||||
|
}
|
||||||
|
|
||||||
|
.option i.icon-transparent {
|
||||||
|
opacity: 0.5; /* Make the icon transparent */
|
||||||
|
margin-right: 10px; /* Space between icon and option box */
|
||||||
|
font-size: 10px; /* Adjust icon size here */
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.option .form-control.option-label {
|
||||||
|
flex: 1; /* Ensure the input field takes up the remaining space */
|
||||||
|
}
|
||||||
|
|
||||||
|
.option .delete-option-icon {
|
||||||
|
margin-left: 10px; /* Space between option box and delete icon */
|
||||||
|
cursor: pointer; /* Show pointer cursor on hover */
|
||||||
|
}
|
||||||
|
.option .form-control.option-label {
|
||||||
|
width: 44%; /* Adjust the percentage as needed */
|
||||||
|
flex: none; /* Ensure it doesn't automatically adjust its size based on the parent container */
|
||||||
|
}
|
||||||
|
/* Style for the submit button */
|
||||||
|
#submit-btn {
|
||||||
|
display: block;
|
||||||
|
margin: 6px auto 30px 0; /* Top, Right, Bottom, Left Margin */
|
||||||
|
padding: 10px 20px; /* Adjust padding for button size */
|
||||||
|
background-color: rgb(103, 58, 183); /* Button color */
|
||||||
|
border-color: rgb(103, 58, 183); /* Border color */
|
||||||
|
color: white; /* Text color */
|
||||||
|
text-align: center; /* Center text inside the button */
|
||||||
|
float: left; /* Align button to the left */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Style for the container */
|
||||||
|
.container {
|
||||||
|
padding-bottom: 2px; /* Space between container content and bottom of the page */
|
||||||
|
padding-top: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Optional: Adding padding to body */
|
||||||
|
body {
|
||||||
|
padding-bottom: 10px; /* Space between page content and bottom of the viewport */
|
||||||
|
}
|
||||||
|
#add-section-btn {
|
||||||
|
position: relative; /* Position relative to its normal position */
|
||||||
|
left: -350px; /* Move 20px to the right from its normal position */
|
||||||
|
top: 80px; /* Move 10px down from its normal position */
|
||||||
|
}
|
|
@ -1,6 +1,23 @@
|
||||||
body {
|
body {
|
||||||
background-color: rgb(240, 235, 248);
|
background-color: rgb(240, 235, 248);
|
||||||
}
|
}
|
||||||
|
.container {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-success {
|
||||||
|
position: relative;
|
||||||
|
left: 250px;
|
||||||
|
top: -10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-header {
|
||||||
|
/* position: absolute; */
|
||||||
|
left: 13px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -74,19 +74,7 @@ body {
|
||||||
flex: 1; /* Allow items to grow/shrink to fill space */
|
flex: 1; /* Allow items to grow/shrink to fill space */
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-custom .navbar-brand:hover,
|
|
||||||
.navbar-custom .navbar-nav > li > a:hover {
|
|
||||||
color: white; /* Keep text color white on hover */
|
|
||||||
text-decoration: none; /* Remove underline if present */
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-nav > li > a {
|
|
||||||
transition: color 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-nav > li > a:hover {
|
|
||||||
color: white; /* Explicitly set text color on hover */
|
|
||||||
}
|
|
||||||
|
|
||||||
#submit-btn {
|
#submit-btn {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
|
@ -149,49 +137,4 @@ a.pagination-link{
|
||||||
border: 1px solid #3333336c; /* Darker border color for table cells */
|
border: 1px solid #3333336c; /* Darker border color for table cells */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Media query for responsive design */
|
|
||||||
@media (max-width: 1200px) {
|
|
||||||
.form-header, .form-section {
|
|
||||||
width: 75%; /* Adjust width for smaller screens */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.form-header, .form-section {
|
|
||||||
width: 90%; /* Adjust width for smaller screens */
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-custom {
|
|
||||||
flex-direction: column; /* Stack navbar items vertically */
|
|
||||||
padding: 10px; /* Adjust padding for smaller screens */
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-custom .navbar-brand,
|
|
||||||
.navbar-custom .navbar-nav > li > a {
|
|
||||||
font-size: 14px; /* Adjust font size for smaller screens */
|
|
||||||
padding: 10px; /* Adjust padding for smaller screens */
|
|
||||||
}
|
|
||||||
|
|
||||||
#submit-btn {
|
|
||||||
width: 100%; /* Make submit button full width */
|
|
||||||
float: none; /* Remove float */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 590px) {
|
|
||||||
.form-header, .form-section {
|
|
||||||
width: 100%; /* Adjust width for smaller screens */
|
|
||||||
padding: 10px; /* Reduce padding for smaller screens */
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-custom {
|
|
||||||
flex-direction: column; /* Stack navbar items vertically */
|
|
||||||
padding: 5px; /* Adjust padding for smaller screens */
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-custom .navbar-brand,
|
|
||||||
.navbar-custom .navbar-nav > li > a {
|
|
||||||
font-size: 14px; /* Adjust font size for smaller screens */
|
|
||||||
padding: 10px; /* Adjust padding for smaller screens */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,36 +0,0 @@
|
||||||
|
|
||||||
.form-header {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.form-description, .submitted-at, .user-email {
|
|
||||||
color: rgba(0, 0, 0, 0.5); /* Transparent text */
|
|
||||||
margin-bottom: 10px;
|
|
||||||
text-align: left; /* Align text left */
|
|
||||||
display: block; /* Ensure each element is a block element */
|
|
||||||
width: 100%; /* Ensure each element takes the full width of the container */
|
|
||||||
padding-left: 0; /* Ensure no padding is affecting alignment */
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-section {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.question-section {
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
padding: 15px;
|
|
||||||
border-radius: 5px;
|
|
||||||
background-color: #f9f9f9;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
width: 65%; /* Or any specific width */
|
|
||||||
/* text-align: left; Ensure the container itself is aligned left */
|
|
||||||
padding: 0; /* Ensure no padding is affecting alignment */
|
|
||||||
margin: 0 auto; /* Center the container if needed */
|
|
||||||
}
|
|
||||||
.question-label {
|
|
||||||
display: inline; /* Ensure it displays inline rather than as a block */
|
|
||||||
background: none; /* Remove any background color */
|
|
||||||
margin: 0; /* Remove any margins if applied */
|
|
||||||
padding: 0; /* Remove any padding if applied */
|
|
||||||
}
|
|
|
@ -281,9 +281,7 @@ function addOption(type, container) {
|
||||||
icon: 'success',
|
icon: 'success',
|
||||||
confirmButtonText: 'OK'
|
confirmButtonText: 'OK'
|
||||||
}).then((result) => {
|
}).then((result) => {
|
||||||
if (result.isConfirmed) {
|
window.location.href = base_url;
|
||||||
window.location.href = base_url + 'Form_controller/index_forms';
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
|
@ -306,7 +304,7 @@ function addOption(type, container) {
|
||||||
padding: 'auto',
|
padding: 'auto',
|
||||||
}).then((result) => {
|
}).then((result) => {
|
||||||
if (result.isConfirmed) {
|
if (result.isConfirmed) {
|
||||||
window.location.href = base_url + 'Form_controller/index_forms';
|
window.location.href = home;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
console.log(error);
|
console.log(error);
|
||||||
|
|
Loading…
Reference in New Issue