Add bootstrap input data to mysql using ajax, jquery and php -


here have bootstrap modal window:

<!-- modal --> <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true">   <div class="modal-dialog">     <div class="modal-content">       <div class="modal-header">         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>         <h4 class="modal-title" id="mymodallabel">add new row</h4>       </div>       <div class="modal-body">       ...... <div class="input-group">   <span class="input-group-addon">ime</span>   <input type="text" id="ime" class="form-control" placeholder="upisi ime"> </div> </br> <div class="input-group">   <span class="input-group-addon">pol</span>   <input type="text" id="pol" class="form-control" placeholder="pol (male/female)"> </div> </br>  <div class="input-group">   <span class="input-group-addon">godine</span>   <input type="text" id="godine" class="form-control" placeholder="godine starosti"> </div> </br>  <div class="input-group">   <span class="input-group-addon">broj pojedenih krofni</span>   <input type="text" id="krofne" class="form-control" placeholder="pojedene krofne"> </div> </br>        </div>       <div class="modal-footer">         <button type="button" class="btn btn-default" data-dismiss="modal">close</button>         <button type="button" id="newdata" class="btn btn-primary">add new data</button>       </div>     </div><!-- /.modal-content -->   </div><!-- /.modal-dialog --> </div><!-- /.modal --> 

i want add data input fields mysql database column: name,gender,age,donuts eaten

so write ajax jquery code:

<script>   //add data database using jquery ajax $("#newdata").click(function() {     //in here can ajax after validating field isn't empty.     if($("#message-content").val()!="") {         $.ajax({             url: "messages.php",             type: "post",             async: true,              data: { name:$("#ime").val(), gender:$("#pol").val(), age:$("#godine").val(), donuts_eaten:$("#krofne").val()}, //your form data post goes here json object             datatype: "html",              success: function(data) {                 $('#output').html(data);                 },           });     } else {         //notify user need enter data     } }); </script> 

now try write php file i'm beginer show know how connect write:

<?php  $con = mysql_connect('localhost', 'gmaestro_agro', 'password') or die('error connecting server');  mysql_select_db('gmaestro_agro', $con);   //what need write here add data mysql  ?> 

i have demo of this: http://agrotime.roadvoyage.com/index1.html, click on add new button modal window...

please me that

sorry english bad i'm learning hard

as simple have write query:

$con = mysql_connect(...); if($con != false) {     mysql_select_db('gmaestro_agro', $con);     $query = "insert `table` (`name`, `gender`, `age`, `donuts_eaten`) values (";     $query .= mysql_real_escape_string($_post['name']) . ", ";     $query .= mysql_real_escape_string($_post['gender']) . ", ";     $query .= mysql_real_escape_string($_post['age']) . ", ";     $query .= mysql_real_escape_string($_post['donuts_eaten']);     $query .= ")";     $result = mysql_query($query);     if($result != false) {         echo "success!";     } else {         echo "an error occured saving data!";     } } 

i assume way know name of 'table' , 'columns' in mysql db , can fix them on own. data in ajax request appear in php's post array.


Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -