ajax fill from json

 contoh 1

	function loadbrg(id,vnd){
		document.forms['fmedit'].querySelectorAll('input[name^="a"]').forEach(function(el){el.value='';});
		$("#modaledit").modal();
		//if(id==0)document.forms['fmtarget'].querySelectorAll('input[name^="a"]').forEach(function(el){el.value=el.name;});
		if(id==0)return;
		var oTXT=document.forms['fmedit'].querySelectorAll('input[name^="a"]');
		$.post("?act=loadbrg&id="+id+"&vnd="+vnd).done(function(response){
			console.log(response);
			$.each(oTXT, function( key, value ) {
				var otxt=value.name.replace('a[','').replace(']','');
				value.value=response[otxt];
				//console.log(key+"="+value.value+"->"+otxt);
			});
		});
	}

contoh 2

	var fmtarget=document.forms['fmpopup'];
	fmtarget.querySelectorAll('input').forEach(function(el){el.value='';});
	$.post("?act=loadlembar",{idobj:idobj}).done(function(response){
		console.log(response);
		$.each(response, function( key, value ) {
			try {
				fmtarget["a["+key+"]"].value=value;
			}
			catch(err) {console.log("a["+key+"]"+err.message);}
		});
	});

Popup Submit

document.getElementById("btnsumbit").addEventListener("click",function(){
	$('#popup').modal('hide');
	$.post("?act=save",$(this.form).serialize()).done(function(response){
		console.log(response);
		if(response.split("<<<")[1]==" reload ")location.reload(true);
	});
	event.preventDefault();
});
          
fmtarget.querySelectorAll('input[type=text]').forEach(function(el){
	console.log(el.name);
	el.value='';
});

Ajax JSON to fill form

form to display data

<form method='post' name='fmtarget'> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Data Munfiq</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <input type='hidden' name='a[idx]' value='0'> <input type='hidden' name='a[kab]' value="<? echo $kab?>"> <input type='hidden' name='a[kec]' value="<? echo $kec?>"> <input type='hidden' name='a[des]' value="<? echo $des?>"> No Kotak<? mktxt('nmrkotak');?> Nama<? mktxt('nama');?> Alamat<? mktxt('alamat');?> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="submit" class="btn btn-primary" id='oprevent'>Save changes</button> </div> </div> </div> </form>

 code to load data

if($_GET[act]=='load'){ $r=loadrow("select * from nu_koin_munfiq where idx='$_GET[id]'"); header('Content-Type: application/json'); echo json_encode($r); exit; }

code to display

function editkan(id){ $("#exampleModal").modal(); $.post("?act=load&id="+id).done(function(response){ console.log(response); var json=response; var fmtarget=document.forms['fmtarget']; for(key in json) { if(json.hasOwnProperty(key)) fmtarget["a["+key+"]"].value=json[key] } }); }

Javascript Jquery Prevent Form Submit

PHP CODE
<? if($_GET[act]=="save"){ $aa=(object) $_POST[a]; foreach($aa as $key => $value) {$s .= "$key='".mysqli_real_escape_string($db,$value)."', ";} $s=rtrim($s, ", "); $s="insert INTO sia_owner set $s ON DUPLICATE KEY UPDATE $s"; $db->query($s); echo " | $s |"; echo "<<< ok <<<"; exit; } ?>

javascript

  <script>

  var inputs=document.getElementsByTagName("*");

  for (i = 0; i < inputs.length; i++) {

    try{

      if(inputs[i].name.includes("a[")){

        inputs[i].value = "sss"+inputs[i].name.replace("a[", "[a|");

      }

      if(inputs[i].type=='submit'){

        inputs[i].addEventListener("click", function(event){

          $.post("?input&act=save",$(this.form).serialize()).done(function(response){

console.log(response);

            //var node = response.split("<<<");

            //if(node[1]==" ok "){location.reload(true);}

            var wnd = window.open("about:blank", "", "_blank");

            //wnd.document.write(node[1]);

            wnd.document.write(response);

          });  

        event.preventDefault();

        });

      }

    }catch(e){}

  }

  </script>

d

<script>

      function addsiswa(id){

        $.post("",{id:id} ).done(function(response){

            var node = response.split("<<<");

            if(node[1]==" ok "){location.reload(true);}

            //var wnd = window.open("about:blank", "", "_blank");

            //wnd.document.write(node[1]);

            //wnd.document.write(response);

          });  

      }

</script>

d

d

<button type="submit" class="btn btn-success" style="margin:10px" onclick="simpan(this.form); return false;">Simpan</button>

Post To Fill Select (ajax jquery)

  <select name="golongan" id="golongan"> <option value=''>--Pilih Golongan--</option> <? $golongan=$db->query("select * from des_kib_kode where bidang='*'"); while($rw=mysqli_fetch_object($golongan)){ echo "<option value='$rw->golongan'>$rw->uraian</option>"; } ?> </select> <select name="bidang" id="bidang"></select> <select name="kelompok" id="kelompok"></select> <select name="sub" id="sub"></select> <div id="subsub"></div> <script> $(document).ready(function() { var golongan; var bidang; var kelompok; var sub; $("#golongan").change(function() { $("#bidang").html(""); $("#kelompok").html(""); $("#sub").html(""); $("#subsub").html(""); golongan = $(this).val(); $.post("?ajax=ajax-kode",{golongan:golongan}).done(function(response){ $("#bidang").html(response); }); }); $("#bidang").change(function() { $("#kelompok").html(""); $("#sub").html(""); $("#subsub").html(""); bidang = $(this).val(); $.post("?ajax=ajax-kode",{golongan:golongan, bidang:bidang}).done(function(response){ $("#kelompok").html(response); }); }); $("#kelompok").change(function() { $("#sub").html(""); $("#subsub").html(""); kelompok = $(this).val(); $.post("?ajax=ajax-kode",{golongan:golongan, bidang:bidang, kelompok:kelompok}).done(function(response){ $("#sub").html(response); }); }); $("#sub").change(function() { $("#subsub").html(""); sub = $(this).val(); $.post("?ajax=ajax-kode",{golongan:golongan, bidang:bidang, kelompok:kelompok, sub:sub}).done(function(response){ $("#subsub").html(response); }); }); }); </script>

function simpan(o){

  $.post("?act=save",$(o).serialize()).done(function(response){

    var node = response.split("<<<");

    //if(node[1]==" ok "){location.reload(true);}

    var wnd = window.open("about:blank", "", "_blank");     wnd.document.write(node[1]);

  });  

}

if($_GET[act]=="save"){

  $aa=(object) $_POST[a];

  foreach($aa as $key => $value) {$s .= "$key='".mysqli_real_escape_string($db,$value)."', ";}

  $s="insert INTO nu_penyaluran set ".rtrim($s, ", ")." ON DUPLICATE KEY UPDATE ".rtrim($s, ", ");

  $db->query($s);

  echo "<<< $s <<<";

  exit;

}

dd

Javascipt and jQuery addEventListener

<script> var bayars=document.getElementsByClassName("bayar"); for(var j = 0; j < bayars.length; j++) { bayars[j].addEventListener('keydown', function (e) { var key = e.which || e.keyCode; if (key === 13) { // 13 is enter var person = prompt("Yakin telah menerima pembayaran sebesar \n"+document.getElementById("dibayar").innerHTML); if (person == null || person == "") return; for(var i = 0; i < bayars.length; i++) { if(bayars[i].value > 0){ //alert(bayars[i].form.id); var data = $("#"+bayars[i].form.id).serialize(); $.ajax({ type : 'POST', url : '?ajax=admin/keuangan/bayar.php&opr='+person, data : data, success : function(response) { setTimeout('top.window.location.href = ""; ' , 500); } }); } } } if (key === 39) { // 13 is right button //var person = aler var nextid=this.id.replace("tdi", ""); nextid = nextid*1 + 1; document.getElementById("tdi"+nextid).focus(); } if (key === 37) { // 13 is right button //var person = aler var nextid=this.id.replace("tdi", ""); nextid = nextid*1 - 1; document.getElementById("tdi"+nextid).focus(); } }); bayars[j].addEventListener('keyup', function (e) { var rupiah=0; for(var i = 0; i < bayars.length; i++) { rupiah += bayars[i].value * 1; } var reverse = rupiah.toString().split('').reverse().join(''), ribuan = reverse.match(/\d{1,3}/g); ribuan = ribuan.join('.').split('').reverse().join(''); document.getElementById("dibayar").innerHTML=ribuan; }); } </script>

<script>
document.getElementById("myBtn").addEventListener("click", displayDate);

function displayDate() {
  document.getElementById("demo").innerHTML = Date();
}
</script>
-----------------------------------------------------------------------
if using jquery
-----------------------------------------------------------------------

$("td.layanan").dblclick(function (e){

        e.stopPropagation();      //<-------stop the bubbling of the event here

        var nik = this.closest("tr").cells[1].innerHTML;

        top.window.location.href = "?pass="+nik;

});

ajax and response

function popup(idbrg){

$.ajax({ type : 'POST', url : '?plain=app/barang-harga.php&act=load', data : {id:idbrg, act:"load"}, success : function(response){ var json=JSON.parse(response); var fmtarget=document.forms['fmmodal']; for(key in json){ if(json.hasOwnProperty(key))fmtarget["a["+key+"]"].value=json[key] } $("#popup").modal(); } });

}

    if($_GET[act]=="load"){

        $o=mysqli_fetch_object($db->query("select * from ijp_barang where idx='$_POST[id]'"));

        echo ' {

            "nama_barang" : "'.$o->nama_barang.'",

            "hrg_beli": "'.$o->hrg_beli.'",

            "isi_kemasan": "'.$o->isi_kemasan.'",

            "satuan_kemasan": "'.$o->satuan_kemasan.'",

            "vendor" : "'.$o->vendor.'",

            "idx" : "'.$o->idx.'"

        }';

    }

$.post("test.php",{nama:"person"}).done(function(response){
            alert(response);
});

<button class="btn btn-primary" onclick="simpan(this.form,event)" value="datang-f138.php">Selesai</button>

function simpan(fm,e){ e.preventDefault();

    $.post(".?ajax=app/save3",$(fm).serialize()).done(function(response){

        var idxsrt="<? echo $_GET[srt]?>";

        document.getElementById("hrefclose").href="keterangan=domisili?srt="+response.split('|')[0];

        $('#printmodal').modal();

        fmcetak=document.forms['fmcetak'];

        fmcetak.action='.?ajax='+'../cetak/keterangan'+'&srt='+response.split('|')[0]+'&src=';

        fmcetak['nosur'].value=response.split('|')[1];

        fmcetak.submit();

    });

}