javascript data mysql database

[juulphp]

I made a site to fill things in on an form. I have two buttons to get an extra form field on the screen. I want to save the data using the exact same markup somewhere. This is the code for getting the data:

Code: Select all

<script>
$(document).ready(function(){
$("#btn").click(function(){
$(".div2").append("<div class='tekst2'><div id='green'></div><textarea rows='8' cols='30' id='tekst' name='tekst' class='tekst'></textarea></div><br/>");
});
$("#btn2").click(function(){
$(".div3").append("<div class='tekst'><div id='red'></div><input class='nummer' id='nummer' type='text' name='nummer'></div><br/>");
});

var ele = new Array();
$("#btn1").click(function(){
$('.tekst').each(function(){
$('.nummer').each(function(){
ele.push($(this).val());

}); });
var send = ele.join(',')
request = $.ajax({
url: "form.php",
type: "post",
data: ele
//you can use this request object to know what's the status of your response
});
});

});
</script>

And this is my form.php:

Code: Select all

<?php
 require_once'config.php';
 $tekst      = $_POST['tekst'];

 $query = "INSERT INTO draaiboek (tekst) 
                    VALUES ('$tekst')";
 $result = mysqli_query($mysqli, $query);


 if($result) {

 } 
 else {

  } 

And this is the code for save and show the input fields on the screen:

Code: Select all

<button class="btn btn-success" id="btn">Nieuw spreekveld</button>
             <button class="btn btn-danger" id="btn2">Nieuw muziek veld</button>
			 <button class="btn btn-info" id="btn4">Witte ruimte</button>
    		 <button class="btn btn-default" id="btn1">Opslaan</button><br/><br/>
			  <div class="div2"></div>
			  </div>

But when i submit, i get only empty rows in the database. So the submit works but the data don't get in the database. What in the code is wrong?

Thank you!

[element121]

It looks like you are missing some code here:

Code: Select all

data: ele
//you can use this request object to know what's the status of your response

The data section might look like this for example, which would be the name of the fields you are posting:

Code: Select all

                data: {
                    name: name,
                    phone: phone
                }

So you would need to include "tekst" there and first get the value of it, into a JS variable:

This needs to be before the ajax call

Code: Select all

var tekst= $("#tekst").val();

And this needs to be in the data section

Code: Select all

                data: {
                    tekst: tekst
                }

Hope that helps,
Jon

[juulphp]

This is now my code:

Code: Select all

   var ele = new Array();
   $("#btn1").click(function(){
   $('.tekst').each(function(){
   $('.nummer').each(function(){
   ele.push($(this).val());
   }); });

   var tekst= $("#tekst").val();
   var titel= $("#titel").val();


   var send = ele.join(',')
    request = $.ajax({
    url: "form.php",
    type: "post",
    data: {
                    tekst: tekst,
					titel: titel
                }
   //you can use this request object to know what's the status of your response
});
});

});
</script>

But i get empty rows in the database.

[element121]

Do you see any error messages in the console?

You can use some debug statements in your PHP code to figure out if the data is getting posted correctly.

[juulphp]

It works now! I had in the form.php mysqli_real_escape_string and that I removed which it does now. I only fielding multiple text with the same IDs. How do I get all of that in one row. Now it only shows the first input field.

[juulphp]

Its works. Thanks for the answers!