Jquery Post Input Array PHP

you have form html with array input, and you want to save it with jquery post (ajax)

input-array-html

the html code looks like

input-array-html-code

with jquery you need get value from array input which checked and with ask class, use …

input-array-get-valueyou need var object data

at last, change the object or array value to json string, so you can send it with POST method

send-aray-post-with-json

and test in receiver file (simpan.php) you must decode the json string

json-decode

test with var_dump

dump-json-arraycomplete html code


<!DOCTYPE HTML>
<html>
<body>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div id='div-polling-ajax-module'>
<ol>
<li>Sebagai interviewer persiapan apa saja yang Anda lakukan sebelum sesi interview ?
<ul  style="list-style-type: none;">
<li>
<input type="radio" ask="1" value="1" name="ask[1]">Membaca CV
</li>
<li>
<input type="radio" ask="1" value="2" name="ask[1]">Mencari informasi tentang profil kandidat melalui jejaring sosial
</li>
<li>
<input type="radio" ask="1" value="3" name="ask[1]">Kedua jawaban diatas kurang tepat
</li>
</ul>
</li>
<li>Pertanyaan apa yang sering Anda ajukan kepada kandidat pada saat sesi interview?
<ul  style="list-style-type: none;">
<li>
<input type="radio" ask="2" value="4" name="ask[2]">Seputar personality
</li>
<li>
<input type="radio" ask="2" value="5" name="ask[2]">Seputar keluarga
</li>
<li>
<input type="radio" ask="2" value="6" name="ask[2]">Seputar background informasi
</li>
</ul>
</li>
</ol>
<input type='hidden' value='1' id='id_pool'/>

<button id='send_polling' class='btn btn-info'>Save</button>
<button id='view_polling' class='btn btn-warning'>View</button>

<script>
$(document).ready(function() {
$('#send_polling').click(function(){ save_poling(); });
$('#view_polling').click(function(){ view_poling(); });

});

function save_poling(){

var data = {};
$.each($('input:radio:checked.ask'), function(){ data[$(this).attr('ask')] = this.value; });
console.log(data);

$.post(
'simpan.php',

{'id_pool':$('#id_pool').val(), 'ask':JSON.stringify(data) },

function (data){ $('#nav-list-form').html(data); }
);

view_poling();
}

function view_poling(){
console.log('view');

}
</script>
</body>
</html>

complete php code


<?php

$post = json_decode($_POST['ask']);

var_dump($post);
?>

Published by

G3n1k

just to remember what i had known :)

4 thoughts on “Jquery Post Input Array PHP”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s