Short way of inserting form data via Multiply select and Switcher in PHP Form to SQL table?

Question

I'm quite new in PHP and trying to make a website PHP/JS/MYSQL with materialize.css framework on it. I figured out by myself how to perform crud operations but I got stacked at multiply choice selects and switchers. I read a bit about it and it's mostly about ajax requests but I wonder if there a way to do it without ajax or just some short way around cause I haven't learned AJAX yet? That's my code:

<!-- PHP Code for inserting stuff into table ------>
<?php
     require 'dbconnection.php';
     if ( !empty($_POST)) {
        //thats a normal name variable 
        $shortname = $_POST['shortname'];  
        //that's a variable for a multiply choice. 
        $worker = $_POST['worker'];
        //that's for a switcher. 
        $switcher = $_POST['switcher'];

         // validate input
         $valid = true;

         // inserting data
         if ($valid) {
             $pdo = Database::connect();
             $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
             $sql = "INSERT INTO tasks (shortname, worker, switcher) values(?, ?, ?)";
             $q = $pdo->prepare($sql);
             $q->execute(array($shortname,$worker,$switcher));
             Database::disconnect();
             header("Location: index.php");
        }
     }
 ?>

That's my html:

<li class="step active">
    <div class="step-title waves-effect">Step 1</div>
    <div class="step-content">
        <div class="row">
            <div class="input-field col m6 s12">
                <label for="shortname">First Name: <span class="red-text">*</span></label>
                <!-- That's for "shortname" name input-->
                <input type="text" id="shortname" name="shortname" class="validate">
            </div>
            <div class="switch">
                <label>
                    Off
                    <!-- That's for "switcher" switcher-->
                    <input name="switcher" type="checkbox">
                    <span class="lever"></span> On
                </label>
            </div>
        </div>
        <div class="input-field">
            <!-- That's for the multiply select "worker"-->
            <select name="worker" class="select2 browser-default" multiple="multiple">
                <optgroup label="Workers">
                    <option value="John">John</option>
                    <option value="Lara">Lara</option>
                    <option value="Lara">Corny</option>
                </optgroup>
            </select>
        </div>
    </div>
</li>

In PhpMYAdmin the table has such lines:

`shortname` varchar(255) CHARACTER SET utf8 NOT NULL,  
`worker` varchar(255) CHARACTER SET utf8 NOT NULL,  
`switcher` varchar(255) CHARACTER SET utf8  NOT NULL,

Woud be thankful if you could help me to find a short way for that. Thanks!

score 1 · Accepted Answer · answered Jan 28 '20 at 16:19

AJAX is not essential (though you can do the same through...).

You can put your html code within

<form name=myform method=post  action=yourprog>

and

<input name="Submit" type="submit" value="Submit">    
</form>

Instead of form, you shall call a JS function through Submit button

<input name="Submit" type="submit" value="Submit" onclick= save_values();>

And in javascript section

<script  type="text/javascript">
 function save_values() {
  var tshortname= document.getElementById('shortname').value;
  var ...all the variables to be saved in database
  var tresult= HttpGet('yourprog.php?shortname=tshortname&v2=tv2&...');
  if(condition based on value of tresult)
   alert error
  else
   alert recorded
}

and for HttpGet please refer HTTP GET request in JavaScript?

Short way of inserting form data via Multiply select and Switcher in PHP Form to SQL table?

1 Answers1