[gameprogrammer] Re: POST in JSON format?
- From: Kevin Jenkins <gameprogrammer@xxxxxxxxxx>
- To: gameprogrammer <gameprogrammer@xxxxxxxxxxxxx>
- Date: Thu, 24 Jan 2013 14:01:47 -0800
Thank you Michael.
I'm learning this stuff but haven't figured out the last step. If I have
more than one form on the page, it gathers up the values from all forms,
not just the one I clicked submit for. The closest I found was for multiple
submit buttons, not multiple separate forms
http://stackoverflow.com/questions/5721724/jquery-how-to-get-which-button-was-clicked-upon-form-submission
How would I make the jquery only act on the form I clicked?
<html>
<head>
<script src="jquery.min.js"></script>
</head>
<body>
<div id="result_string">No results yet</div><br />
<form name="jsonform1" id="jsonform1" action="dev/account">
First name: <input type="text" value="fndef" name="firstname"><br>
Last name: <input type="text" value="lndef" name="lastname"><br>
<input id="action" type="button" name="button" value="Submit">
</form>
<script type="text/javascript">
//<![CDATA[
jQuery(function() {
jQuery("#action").click(function() {
var oJsonData = {};
var result = { };
$.each($('form').serializeArray(), function() {
result[this.name] = this.value;
});
oJsonData.json = JSON.stringify (result);
jQuery.ajax({
type: "POST",
url: $('form').attr('action'),
data: oJsonData.json,
contentType: "application/json; charset=UTF-8"
}).done(function(data){
document.getElementById('result_string').innerHTML = data;
});
});
});
//]>
</script>
</body>
</html>
On Thu, Jan 24, 2013 at 12:28 PM, Michael Croghan
<mcroghan@xxxxxxxxxxxxxx>wrote:
> http://api.jquery.com/jQuery.post/
> http://api.jquery.com/jQuery.ajax/
>
> // my example //
> jQuery.post ("jsontest.php", oJsonData, function(oData) {
> jQuery('#json_string').html(JSON.stringify (oData));
> });
>
> // your example with an added 'done' callback //
> jQuery.ajax({
> type: "POST",
> url: "dev/account",
> data: oJsonData.json,
> contentType: "application/json; charset=UTF-8"
> }).done(function(data){
> // do whatever here like update an html element //
> });
>
> I'd look more at the jQuery api. Widely used, easy to use and makes your
> front end life much less frustrating.
>
> -- Mike
>
> On Thu, Jan 24, 2013 at 10:49 AM, Kevin Jenkins <gameprogrammer@xxxxxxxxxx
> > wrote:
>
>> I figured out how to set the headers (below).
>>
>> In my code below, you can see I'm submitting the form to the url
>> dev/account which has an associated servlet. In that servlet, I want to
>> return some HTML as a test
>> resp.getWriter().println( "TEST RESPONSE" );
>>
>> How would I, after pressing submit on the form, view that response? Is
>> there a way to change the URL to dev/account? Or to update index.html to
>> just show it?
>>
>> My ultimate purpose of this is so that an external website can submit
>> through a web form some stuff to my java server, and display the results
>> back. But for now I'm just putting all the forms on one index.html so I can
>> rapidly test without having to use restclient
>>
>> Thanks in advance.
>>
>> Code here:
>>
>> <form id="jsonform">
>> First name: <input type="text" value="fndef" name="firstname"><br>
>> Last name: <input type="text" value="lndef" name="lastname"><br>
>> <input id="action" type="button" name="button" value="Submit">
>> </form>
>> <script type="text/javascript">
>> jQuery(function() {
>> jQuery("#action").click(function() {
>> var oJsonData = {};
>> var result = { };
>> $.each($('form').serializeArray(), function() {
>> result[this.name] = this.value;
>> });
>> oJsonData.json = JSON.stringify (result);
>> jQuery.ajax({
>> type: "POST",
>> url: "dev/account",
>> data: oJsonData.json,
>> contentType: "application/json; charset=UTF-8"
>> });
>> });
>> });
>>
>>
>>
>> On Thu, Jan 24, 2013 at 8:06 AM, Kevin Jenkins <gameprogrammer@xxxxxxxxxx
>> > wrote:
>>
>>> Thanks for these helpful responses.
>>>
>>> Michael, does index.php have to be php, or can I use index.html so I can
>>> test on my local system? From the code I think you are submitting the form
>>> to itself, then running PHP to add the two header fields? There's no way to
>>> do this with javascript?
>>>
>>>
>>> On Wed, Jan 23, 2013 at 11:52 PM, Michael Croghan <
>>> mcroghan@xxxxxxxxxxxxxx> wrote:
>>>
>>>> simple example with jQuery
>>>>
>>>>
>>>> On Wed, Jan 23, 2013 at 11:38 PM, Paulo Pinto <pjmlp@xxxxxxxxxxxxx>wrote:
>>>>
>>>>> You cannot do JSON POST directly from forms.
>>>>>
>>>>> The only way is via Ajax requests.
>>>>>
>>>>> So you need to bind the click event for the "Ok" button to a
>>>>> JavaScript function that calls the
>>>>> server side with an Ajax call.
>>>>>
>>>>>
>>>>>
>>>>> On Thu, Jan 24, 2013 at 7:41 AM, Kevin Jenkins <
>>>>> gameprogrammer@xxxxxxxxxx> wrote:
>>>>>
>>>>>> Sorry for not being clear. I'm OK on the server side because I'm
>>>>>> writing it in Java and am using json-lib to read the body of the post.
>>>>>> But
>>>>>> for testing I want to write a webpage that can do a POST from an HTML
>>>>>> form
>>>>>>
>>>>>> <form>
>>>>>> First name: <input type="text" name="firstname"><br>
>>>>>> Last name: <input type="text" name="lastname"><br>
>>>>>> <input type="submit" value="Submit">
>>>>>> </form>
>>>>>>
>>>>>> With that code the body is not in JSON format. I was wondering if
>>>>>> there was a simple way to make any form put the body in JSON format. Or
>>>>>> lacking that, at least how to hand-craft it so that it is. I found some
>>>>>> javascript code online but it didn't work, that is what I was alluding
>>>>>> to.
>>>>>>
>>>>>>
>>>>>>
>>>>>> On Wed, Jan 23, 2013 at 9:51 PM, Michael Croghan <
>>>>>> mcroghan@xxxxxxxxxxxxxx> wrote:
>>>>>>
>>>>>>> Didn't think about server side. :)
>>>>>>>
>>>>>>> One way half-a-dozen ways depending on what specifically you're
>>>>>>> trying to do.
>>>>>>>
>>>>>>>
>>>>>>> On Wed, Jan 23, 2013 at 9:39 PM, Alan Wolfe <alan.wolfe@xxxxxxxxx>wrote:
>>>>>>>
>>>>>>>> btw... a sly trick i use sometimes when i have http questions of
>>>>>>>> this
>>>>>>>> sort is i'll go ask on the libcurl mailing list (shh)
>>>>>>>>
>>>>>>>> People tend not to consider it off topic, and they will actually
>>>>>>>> think
>>>>>>>> that you are trying to achieve something with libcurl (mostly i am,
>>>>>>>> but not always) - and there's a lot of super knowledgeable people
>>>>>>>> there with regards to this sort of thing.
>>>>>>>>
>>>>>>>> On Wed, Jan 23, 2013 at 9:36 PM, Alan Wolfe <alan.wolfe@xxxxxxxxx>
>>>>>>>> wrote:
>>>>>>>> > i think it partly depends on the server understanding your
>>>>>>>> intentions
>>>>>>>> > (ie apache vs IIS vs WCF even, are different if i recall
>>>>>>>> correctly),
>>>>>>>> > but the official content-type is "application/json" according to
>>>>>>>> the
>>>>>>>> > RFCs
>>>>>>>> >
>>>>>>>> > http://tools.ietf.org/html/rfc4627
>>>>>>>> >
>>>>>>>> > doesn't do a lick of good if that doesn't work for you though (:
>>>>>>>> >
>>>>>>>> > On Wed, Jan 23, 2013 at 9:19 PM, Kevin Jenkins
>>>>>>>> > <gameprogrammer@xxxxxxxxxx> wrote:
>>>>>>>> >> Does anyone know how to do an HTML form POST using JSON format?
>>>>>>>> I searched
>>>>>>>> >> online but couldn't find any clear explanations or source-code
>>>>>>>> that actually
>>>>>>>> >> worked.
>>>>>>>>
>>>>>>>> ---------------------
>>>>>>>> To unsubscribe go to http://gameprogrammer.com/mailinglist.html
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>
>>>>>>
>>>>>
>>>>
>>>
>>
>
Other related posts:
