How to save data which is inside a table dynamically created using JavaScript to database

Question

 function create(x) {
               var field=document.createElement('fieldset');
                            var t=document.createElement('table');
                            t.setAttribute("id","myTable");
                            document.body.appendChild(t);
                            field.appendChild(t);
                            document.body.appendChild(field);

                            var row=document.createElement('th');
                            newHeader = document.createElement("th");
                            newHeader.innerText = x;
                            row.appendChild(newHeader);


                            var row1=document.createElement('tr');
                            var col1=document.createElement('td');
                            var col2=document.createElement('td');

                            var row2=document.createElement('tr');
                            var col3=document.createElement('td');
                            var col4=document.createElement('td');

                            var row3=document.createElement('tr');
                            var col5=document.createElement('td');
                            var col6=document.createElement('td');

                             col1.innerHTML="Name";
                            col2.innerHTML="<input type='text' name='stateactivityname' size='40' required>";
                            row1.appendChild(col1);
                            row1.appendChild(col2);
                            col3.innerHTML="Registration Applicable";
                            col4.innerHTML="<select name='regapp' required><option></option><option>Yes</option><option>No</option></select>";
                            row2.appendChild(col3);
                            row2.appendChild(col4);
                            col5.innerHTML="Registers Applicable";
                            col6.innerHTML="<select name='registers' required><option></option><option>Yes</option><option>No</option></select>";
                            row3.appendChild(col5);
                            row3.appendChild(col6); 
                            t.appendChild(row);
                            t.appendChild(row1); 
                            t.appendChild(row2);
                            t.appendChild(row3);
                            addrow('myTable');
      }

PHP code for storing data to database is:

<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
   <?php
   $conn=new mysqli("localhost","root","","newcomplyindia");
   if($conn->connect_errno){
       echo("connection error");
   }
   $actname=$_POST["actname"];
   $industry=$_POST['industrytype'];
   $centralorstate=$_POST["cors"];
   $sql="insert into acts (actname,centralorstate) value ('".$actname."','".$centralorstate."')";
   $regapp=$_POST["regapp"];
   if($regapp=='Yes'){
       $regapp=true;
   }
   else{
       $regapp=false;
   }
   $registers=$_POST["registers"];
   if($registers=='Yes'){
       $registers=true;
   }
   else{
       $registers=false;
   }
   $sub=$_POST["sub"];
   if($sub=='Yes'){
       $sub=true;
   }
   else{
       $sub=false;
   }
   if($conn->query($sql)==true){
             echo 'act name added ';
   }
   $lastid=$conn->insert_id;
   $sql1="insert into actsstate (actid,registrationrequired,registersapplicable,sublocation)"
           . "values('$lastid','$regapp','$registers','$sub')";

   if($conn->query($sql1)==true){
        echo '<br>name and central/state added';
   } 
   $stateactivity=$_POST["stateactivityname"];
   $activityname=$_POST["activityname"];
   $activitymonth=$_POST["month"];
   $activitydate=$_POST["date"];
   $sql2="insert into activity (name,actid,activityname,activitymonth,activitydate)"
       . "values('$stateactivity','$lastid','$activityname','$activitymonth','$activitydate')";
   if($conn->query($sql2)){
       echo 'activity added';
   }
   else{
       echo 'no record';
   }
   $conn->close();
   ?>

i have a javascript like this. The table is created dynamically. And i want to store the data inside this table to database. am using mysqli for database connection Am new to javascript. Can anyone help me to do this

Are you looking to store it using JS or PHP? You added a tag for PHP, so is that what you're using server-side? — Michael Fourre
– Michael Fourre, Commented Feb 22, 2016 at 9:13
Do you have any PHP code written? We probably need more to give an adequate answer — Michael Fourre
– Michael Fourre, Commented Feb 22, 2016 at 9:26
Your code has security issues. You should escape your values before doing SQL queries, otherwise, someone can destroy/steal your database — rap-2-h
– rap-2-h, Commented Feb 22, 2016 at 9:44

Khaled Al-Ansari · Accepted Answer · 2016-02-22 09:58:10Z

1

Here's a way using Vanilla JS (pure js)

var xhttp = new XMLHttpRequest();
var url = "save.php";
xhttp.open("POST", url, true);
// uncomment this if you're sending JSON
// xhttp.setRequestHeader("Content-type", "application/json");

xhttp.onreadystatechange = function() { // Call a function when the state changes.
    if(xhttp.readyState == 4 && xhttp.status == 200) {
        // the 4 & 200 are the responses that you will get when the call is successful
        alert(xhttp.responseText);
    }
}
xhttp.send('the data you want to send');

And here's a way to save to the database (mysql in my case) with Flat PHP (pure php)

$servername = "localhost";
$username   = "db_username";
$password   = "db_password";
$dbname     = "db_name";

// connect to the DB
$conn = new mysqli($servername, $username, $password, $dbname);
// check if you're connected
if ($conn->connect_error) {
    echo "Connection failed: " . $conn->connect_error;
}
else {
    // echo "connecting to DB succeeded <br> ";
}

// uncomment the following if you're recieving json
// header("Content-Type: application/json");
// $array = json_decode(file_get_contents("php://input"), true);

$sql = "INSERT INTO table_name (columns,names) VALUES (columns,values)";
if ($conn->query($sql) === TRUE) {
    echo "Data was saved successfully";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();

to learn more about the sql commands I suggest the w3schools tutorials

edited Feb 22, 2016 at 9:58

answered Feb 22, 2016 at 9:45

Khaled Al-Ansari

3,9702 gold badges27 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sree Over a year ago

form id was not mentioned

Jason Roman · Accepted Answer · 2016-02-22 15:43:46Z

0

Of course you can by using AJAX:

$.post("php_script.php",{javascript variables}, function(result) {
    alert(result);
});

edited Feb 22, 2016 at 15:43

Jason Roman

8,30610 gold badges37 silver badges44 bronze badges

answered Feb 22, 2016 at 9:32

f.developer

12 bronze badges

Collectives™ on Stack Overflow

How to save data which is inside a table dynamically created using JavaScript to database

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related