Elimde bir HTML formu var:
<html>
<head><title>test</title></head>
<body>
<form action="myurl" method="POST" name="myForm">
<p><label for="first_name">First Name:</label>
<input type="text" name="first_name" id="fname"></p>
<p><label for="last_name">Last Name:</label>
<input type="text" name="last_name" id="lname"></p>
<input value="Submit" type="submit" onclick="submitform()">
</form>
</body>
</html>
Bir kullanıcı gönder düğmesine tıkladığında bu formdaki verileri sunucuma JSON nesnesi olarak göndermenin en kolay yolu hangisidir?
GÜNCELLEME: Bu kadar ileri gittim ama işe yaramıyor gibi görünüyor:
<script type="text/javascript">
function submitform(){
alert("Sending Json");
var xhr = new XMLHttpRequest();
xhr.open(form.method, form.action, true);
xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
var j = {
"first_name":"binchen",
"last_name":"heris",
};
xhr.send(JSON.stringify(j));
Neyi yanlış yapıyorum?
Form verilerinin tamamını dizi olarak alın ve json stringify yapın.
var formData = JSON.stringify($("#myForm").serializeArray());
Bunu daha sonra ajax'ta kullanabilirsiniz. Ya da ajax kullanmıyorsanız; gizli textarea içine koyun ve sunucuya iletin. Eğer bu veri normal form verisi ile json string olarak geçilirse o zaman json_decode kullanarak decode etmeniz gerekir. Daha sonra tüm verileri bir dizi içinde alacaksınız.
$.ajax({
type: "POST",
url: "serverUrl",
data: formData,
success: function(){},
dataType: "json",
contentType : "application/json"
});
HTML, form verilerinden JSON oluşturmanın hiçbir yolunu sağlamaz.
Bunu gerçekten istemciden halletmek istiyorsanız, JavaScript kullanmaya başvurmanız gerekir:
Muhtemelen application/x-www-form-urlencoded
verisine bağlı kalmanız ve JSON yerine bunu sunucuda işlemeniz daha iyi olacaktır. Formunuz JSON veri yapısından faydalanacak karmaşık bir hiyerarşiye sahip değildir.
Sorunun büyük ölçüde yeniden yazılmasına yanıt olarak güncelleme...
readystatechange
işleyicisi yoktur, bu nedenle yanıtla hiçbir şey yapmazsınızkodunuz iyi ancak gönder düğmesi nedeniyle asla çalıştırılmıyor [type="submit"] sadece type=button ile değiştirin
<input value="Submit" type="button" onclick="submitform()">
komut dosyanızın içinde; form bildirilmemiştir.
let form = document.forms[0];
xhr.open(form.method, form.action, true);