Inserting data into a mysql data using PHP, JQUERY and JAVASCRIPT

Question

I am trying to insert data into MYSQL database using a form that uses PHP, JQUERY and JAVASCRIPT. At the moment I am unable to get the data that the user can input into the 'Add Business Name' field to be inserted into the MYSQL data base 'justrated'. In addition, no errors are coming up on the screen so I have no idea how to fix it.

CODE:

<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta charset="utf-8">
<title>jQuery UI Tabs - Default functionality</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>SB Admin 2 - Bootstrap Admin Theme</title>
<!-- Bootstrap Core CSS -->
<link href="bower_components/bootstrap/dist/css/bootstrap.min.css"  rel="stylesheet">
<!-- MetisMenu CSS -->
<link href="bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="dist/css/sb-admin-2.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="navbar-default sidebar" role="navigation">
     <!-- /.sidebar-collapse -->
      </div>
        <!-- /.navbar-static-side -->
    </nav>
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                    </div>
                    <div class="panel-body">
                        <div class="row">
                           <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">Add Business</h1>
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        Please enter your business details
                    </div>
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-lg-6">
                                <form role="form">
                                    <!--<div class="form-group">
                                        <label>Text Input</label>
                                        <input class="form-control">
                                        <p class="help-block">Example block-level help text here.</p>
                                    </div>-->
                                    <div class="form-group" name ="BusinessName">
                                        <label>Business Name</label>
                                        <input class="form-control" placeholder="Enter Business Name">
                                    </div>                                               
                                   <button type="submit" name="submit" class="btn btn-default" style ="background-color:#238DE8;color:#FFFFFF";>Submit</button>
                                    <button type="reset" name="reset" class="btn btn-default" style="background-color:#FF2720;color:#FFFFFF";>Reset</button>
                                </form>
                            </div>
                            <!-- /.col-lg-6 (nested) -->
                            <!-- /.col-lg-6 (nested) -->
                        </div>
                        <!-- /.row (nested) -->
                    </div>
                    <!-- /.panel-body -->
                </div>
                <!-- /.panel -->
            </div>
            <!-- /.col-lg-12 -->
        </div>
        <!-- /.row -->

</div>
                         <button type="submit" name="submit" class="btn btn-default" style ="background-color:#238DE8;color:#FFFFFF";>Submit</button>
                         <button type="reset" name="reset" class="btn btn-default" style="background-color:#FF2720;color:#FFFFFF";>Reset</button>
                                </form>
                            </div>

   <?php
   if (isset($_POST["submit"]))
   {
   //create connection 
   $conn = new mysqli("localhost", "root", "", "justrated");
  // Check connection
   if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
   }
   $sql = "INSERT INTO businesses (`BusinessName`)
    VALUES ('".$_POST['BusinessName']."')";
  if ($conn->query($sql) === TRUE) {
   echo "New record created successfully";
 } else {
   echo "Error: " . $sql . "<br>" . $conn->error;
 }
 $conn->close();
 }
 ?>
 <!-- /#wrapper -->
 <!-- jQuery -->
 <script src="bower_components/jquery/dist/jquery.min.js"></script>
 <!-- Bootstrap Core JavaScript -->
 <script src="bower_components/bootstrap/dist/js/bootstrap.min.js">    </script>
<!-- Metis Menu Plugin JavaScript -->
<script src="bower_components/metisMenu/dist/metisMenu.min.js"></script>
<!-- Custom Theme JavaScript -->
<script src="dist/js/sb-admin-2.js"></script>
</body>
</html>

mariobgr · Answer 1 · 2015-09-04T14:57:21.647

5

First of all, You should set your form to send through POST, as it defaults to GET.

<form role="form" action="" method="post">

Second, give your input a name

<input class="form-control" placeholder="Enter Business Name" name="BusinessName">

Third, you should either escape your data before inserting, or use prepared statements. What you're doing is dangerous.

And last, I don't get what you are doing with jQuery and JavaScript (jQuery is a library for JavaScript, you know... not two different things) ??

edited Sep 04 '15 at 14:57

answered Sep 04 '15 at 14:50

mariobgr

2,143
2
16
31

1

You should add a bit about more about SQL injection issue, maybe link, http://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php?rq=1 – chris85 Sep 04 '15 at 14:55
In addition to the correct answer above: you put the name attribute on the div instead of the input element (See @mariobgr second points): from your code--
– dlporter98 Sep 04 '15 at 14:56

score 0 · Answer 2 · answered Sep 04 '15 at 14:54

0

you need to add a name attribute to your input field:

<input name="business_name" class="..." />

and you need to put:

<form method="post" ....>

answered Sep 04 '15 at 14:54

Erik Flitman

163
4

Inserting data into a mysql data using PHP, JQUERY and JAVASCRIPT

2 Answers2