CODEWITHSUNDEEP
asp.net-mvcjsonpost
jeef3
jeef3

Reputation: 1997

Submit a form as JSON (no AJAX)

Is it possible to submit form data as JSON, without using AJAX?

I've tried changing the enctype:

<form enctype="application/json"></form>

But that's not a valid value according on w3schools

The reason I would like this behaviour is that the requested URL will return a file, which I obviously can't do anything with if I use AJAX. I would like to send JSON data marked as Content-Type: application/json so that ASP.NET MVC will use its JSON binding.

Upvotes: 15

Views: 13799

Answers (7)

Chetan chadha
Chetan chadha

Reputation: 568

You can use Form2js.It is designed by google and it is easy to use library.

https://github.com/maxatwork/form2js

Also , It can be modified according to user requirement .You can check their license .You can Find the basic examples of this javascript file using the link below:

http://form2js.googlecode.com/hg/example/test.html

Upvotes: 0

Shubham Patlani
Shubham Patlani

Reputation: 31

You can now set form enctype='application/json' according to the new W3C standards published on 29 May 2014.

You can check it : http://www.w3.org/TR/html-json-forms/

Upvotes: 0

Adeel Gill
Adeel Gill

Reputation: 353

Try this simple store your POST array in variable and then encode it as json obj. like this-->

$postarray=($_POST);
$jsondata=json_encode($postarray);

Sorry its for PHP

Upvotes: -1

chandu
chandu

Reputation: 2276

As per W3C standards you can't pass the data like JSON using

<form enctype="application/json"></form>

Description

User agents that implement this specification will transmit JSON data from their forms whenever the form's enctype attribute is set to application/json. During the transition period, user agents that do not support this encoding will fall back to using application/x-www-form-urlencoded. This can be detected on the server side, and the conversion algorithm described in this specification can be used to convert such data to JSON.

The path format used in input names is straightforward. To begin with, when no structuring information is present, the information will simply be captured as keys in a JSON object

Reference DOC

Upvotes: 0

afreeland
afreeland

Reputation: 3979

Could you use JSON.stringify() to serialize your client side object and then stuff that into a hidden input and submit your form...and then in the controller side pull it back out of the Request.Form and deserialize it into your object?

[Edit] Just saw in the comment section underneath of the original question that this was essentially a duplicate post and that this stackoverflow worked as a solution.

Upvotes: 1

Phd. Burak &#214;zt&#252;rk
Phd. Burak &#214;zt&#252;rk

Reputation: 1767

Yes, you can serialize form like an object with plugin. I write a sample for you;

//Head

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.serialize-object.js"></script>

You can download plugin from here

//Form

<form id="frm">
<input type="text" name="Model[Firstname]">
<input type="text" name="Model[Lastname]">
<input type="text" name="ModelDetail[PhoneNumber]">
...
<button type="button" onclick="sendForm()">Send</button>
</form>

//JS

function sendForm(){
model_data = $("#frm").serializeObject();
$.ajax({
url: 'YOUR_SERVICE_URL',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(model_data),
dataType: 'json',
success:function(e){
    // I know, you do not want Ajax, if you callback to page, you can refresh page here
   }
});

Good luck!

Upvotes: 1

&#214;mer Faruk Aplak
&#214;mer Faruk Aplak

Reputation: 911

you can try;

// html

<form type="POST" action="/Home/Test">
<input id="foo" value="hede">
</form>

// dto

public class TestInDto{
 public string foo {get;set;}
}

// home controller

[HttpPost]
void Test(TestInDto inDto){
 var foo = inDto.foo;

}

Upvotes: 0

Related Questions