Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <link href="style.css" type="text/css" rel="stylesheet"></link>
- <script type="text/javascript" src="jquery.js"></script>
- <script type="text/javascript">
- $('document').ready(function() {
- $('#btn').click(function() {
- var nama = $('#nama').val();
- var alamat = $('#alamat').val();
- var umur = $('#umur').val();
- var pendidikan = $('#pendidikan').val();
- var data = 'nama=' + nama + '&alamat=' + alamat + '&umur=' + umur + '&pendidikan=' + pendidikan;
- $.ajax({
- type: 'POST',
- url: "aksi-form.php",
- data: data,
- success: function() {
- $('#tampil').load("lihat.php");
- }
- });
- });
- });
- </script>
- <style>
- .lab{
- width:150px;
- }
- .ipt{
- width: 300px;
- height: 30px;
- border:1px solid #fff;
- padding-left: 10px;
- font-size: 12pt;
- }
- #btn{
- width: 200px;
- height: 25px;
- margin-top:10px;
- background: #2ECC71;
- border:1px solid #2ECC71;
- color:#fff;
- }
- h1{
- font-family:sans-serif;
- text-align: center;
- }
- #tbl_input{
- margin-left: 450px;
- }
- </style>
- </head>
- <body>
- <div id="lay">
- <h1>FORM INPUT AJAX JQUERY CARIKODE.COM</h1>
- <div id="form-inp">
- <form method="post" action="" id="form-input">
- <table id="tbl_input">
- <tr>
- <td class="lab">Nama </td><td><input class="ipt" type="text" name="nama" id="nama"></td>
- </tr>
- <tr>
- <td class="lab">Alamat </td><td><input class="ipt" type="text" name="alamat" id="alamat"></td>
- </tr>
- <tr>
- <td class="lab">Umur </td><td><input class="ipt" type="text" name="umur" id="umur"></td>
- </tr>
- <tr>
- <td class="lab">Pendidikan </td><td><input class="ipt" type="text" name="pendidikan" id="pendidikan"></td>
- </tr>
- <tr>
- <td></td><td><input id="btn" type="button" value="Insert"></td>
- </tr>
- </table>
- </form>
- </div>
- <div id="tampil"></div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement