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">×</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
Post a Comment