最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Use AJAX to send html5 textarea directly without html <form> - Stack Overflow

programmeradmin0浏览0评论

Recently I am confused about whether it's possible to send input/textarea data directly without being included in html <form>. I thought in web page, if we want to get information from user then send the text to authentication server, we must use <form> irrespective of in which way it's submitted.

But an anonymous reviewer of my paper claims that <html> can be bypassed by using an html5 tag "textarea" and JS AJAX post. While I did lots of experiments trying to implement his way but all failed.

I wonder if there is really some way to submit user info without using <form> tag?

Thank you


Thanks for everyone's reply.

Update: I followed "the_void"'s code and changed the url of AJAX to a ServerSocket (implemented by Java). The server was able to get the POST event, but it cannot read the "data" of AJAX. The following is the html code:

HTML

<!DOCTYPE html>
<head>
  <meta charset="utf-8" />
  <script src="//ajax.googleapis/ajax/libs/jquery/1.8.3/jquery.min.js">
  </script>

  <script type="text/javascript">
    $(document).ready(function() {
      $('#submit').click(function() {
        // information to be sent to the server
      
        info = $('#foo').val();
        $.ajax({
          type: 'POST',
          url: ':8888',
          data: ({ foo: info }),
          // crossDomain: true,
          // dataType: 'json'
        });
        
        return false;
      });
    });
  </script>
</head>
<body>
  <label>Text</label>
  <textarea id="foo"></textarea>

  <button id="submit">Submit via Ajax</button>
</body>
</html>

It seems that the socket server cannot read from AJAX (but it can read from < form > + < action >). Is there any way to fix the reading issue?

Thank you

Recently I am confused about whether it's possible to send input/textarea data directly without being included in html <form>. I thought in web page, if we want to get information from user then send the text to authentication server, we must use <form> irrespective of in which way it's submitted.

But an anonymous reviewer of my paper claims that <html> can be bypassed by using an html5 tag "textarea" and JS AJAX post. While I did lots of experiments trying to implement his way but all failed.

I wonder if there is really some way to submit user info without using <form> tag?

Thank you


Thanks for everyone's reply.

Update: I followed "the_void"'s code and changed the url of AJAX to a ServerSocket (implemented by Java). The server was able to get the POST event, but it cannot read the "data" of AJAX. The following is the html code:

HTML

<!DOCTYPE html>
<head>
  <meta charset="utf-8" />
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
  </script>

  <script type="text/javascript">
    $(document).ready(function() {
      $('#submit').click(function() {
        // information to be sent to the server
      
        info = $('#foo').val();
        $.ajax({
          type: 'POST',
          url: 'http://10.0.0.3:8888',
          data: ({ foo: info }),
          // crossDomain: true,
          // dataType: 'json'
        });
        
        return false;
      });
    });
  </script>
</head>
<body>
  <label>Text</label>
  <textarea id="foo"></textarea>

  <button id="submit">Submit via Ajax</button>
</body>
</html>

It seems that the socket server cannot read from AJAX (but it can read from < form > + < action >). Is there any way to fix the reading issue?

Thank you

Share Improve this question edited Sep 12, 2020 at 18:22 snnsnn 13.6k5 gold badges49 silver badges55 bronze badges asked Feb 3, 2014 at 22:38 user3267738user3267738 551 gold badge2 silver badges5 bronze badges 4
  • Yes, with the proper javascript, you can submit anything without a <form> tag. You can also submit a form with $_GET in the URL. See: api.jquery.com/jquery.post – Sablefoste Commented Feb 3, 2014 at 22:40
  • 1 Technically that's possible - why shouldn't it? YOu can make most (not all, but nothing of interest here) HTTP Requests using Javascript, and you can access the contents of the textarea. SO yes, that works. QUestion is: what's the rpbolem with the form tag? Semantically, it makes a lot of sense to have it there: after all, the user IS filling out a form... – Johannes H. Commented Feb 3, 2014 at 22:41
  • This should get you closer: stackoverflow.com/questions/13103191/… – Matt Commented Feb 3, 2014 at 22:42
  • there's lots of ways to submit info without a form tag, ajax is just one of them. – dandavis Commented Feb 3, 2014 at 22:52
Add a comment  | 

3 Answers 3

Reset to default 11

Ajax (Asynchronous Javascript & XML) is a way to send data from client to the server asynchronously. For that you'd have to write code for sending the data in the client-side using Javascript/HTML and also to process the received data using server-side languages (eg PHP) on the server-side.

And, yes you don't need a <form> tag to do so.

Check out this example.

HTML:

<label>Text</label>
<textarea id="foo"></textarea>

<button id="submit">Submit via Ajax</button>

Javascript:

$('#submit').click(function(e) {
    e.preventDefault();

    // information to be sent to the server
    var info = $('#foo').val();

    $.ajax({
        type: "POST",
        url: 'server.php',
        data: {foo: info}
    });
});

Server-side Handler (PHP): server.php

<?php 

// information received from the client
$recievedInfo = $_POST['foo'];

// do something with this information

See this for your reference http://api.jquery.com/jquery.ajax/

Perhaps your reviewer was referring to the HTML5 textarea attribute "form". It allows a textarea to be part of a specified form without being inside the form element. http://www.w3schools.com/tags/att_textarea_form.asp

But generally speaking, as long as you can identify an element, say a textarea, you can access the text inside it and send it to the server without submitting any forms using ajax. From Sable's comment:
http://api.jquery.com/jquery.post OR http://api.jquery.com/jquery.ajax/

Yes, you can submit data to a server without putting it into a form. Form's provide a simpler mechanism for sending larger amounts of data to a server without the developer having to tell the browser how to encode the form.

EG:

HTML

JS

var text = $("input[type='text']").val();
$.post("/my/server/url", { userInput : text }, function(data){ /* Success! */});

This would technically post the data to the server without a form.

发布评论

评论列表(0)

  1. 暂无评论