testModule/POST_normal_PUT_via_AJAX.html at master · nheise/testModule · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>POST normal - PUT via ajax</title>
  <script>
    $(window).load( function() {
      $('form[method=PUT]').submit( function() {
        var form = $(this);
        var action = form.attr('action'),
            method = form.attr('method'),
            serializedData = form.serialize();

        var request = $.ajax( {
          type : method,
          url : action,
          dataType : 'json',
          data : serializedData,
          complete : function( data, textStatus, jqXHR ) {
            alert( JSON.stringify( data ) );
          },
          fail : function( jqXHR, textStatus ) {
            alert( JSON.stringify( jqXHR ) );
          }
        });

        return false;
      });
    });
  </script>
</head>
<body>
  <h1>POST</h1>
  <form action="http://nheise.net/testModule/forms" method="POST">
    <input type="text" name="foo" value="hallo1">
    <input type="submit" value="Submit"/>
  </form>
  <h1>PUT via AJAX</h1>
  <form action="http://nheise.net/testModule/forms/p1" method="PUT">
    <input type="text" name="foo" value="hallo2">
    <input type="submit" value="Submit"/>
  </form>
  <h1>PUT via POST with hidden _method field</h1>
  <form action="http://nheise.net/testModule/forms/p1" method="POST">
    <input type="text" name="foo" value="hallo3">
    <input type="submit" value="Submit"/>
    <input type="hidden" name="_method" value="PUT"/>
  </form>
</body>
</html>