提交为空或提交的json解码失败.如何在表格内提交textarea [英] Submission empty or json decode of submission failed. how to submit textarea inside form

问题描述

<p><h3>Enter your SQL query below:</h3>
<form method="post" action="http://212.47.247.139/challenge/ajax.php?submission=%7B%7D" id="my-form">
    <textarea id='text1' class='sql' name='submission' rows=10 cols=120></textarea>
    <input type="submit" id="blogSubmit" onclick="getText()">
    <br>
</form>
</p>
<script>
    function getText() {
        // var str=document.getElementById("text1").value;
        // alert(str + "i did it");

        $.ajax('ajax.php?submission=%7B%7D', {
                    data: {submission: $('#text1').val()},
                    success: function(data) {
                        success_callback(data);
                        console.log("success " + data);
                    },
                    error: function(xhr, status, error) {
                        alert(error);
                    },
                    type: 'POST'
                })
    }
</script>

我在包含一些sql语句的表单内有一个文本区域.我在表单内有一个提交按钮.我想发生的事情是:当用户单击提交"按钮时，文本区域内的任何内容都将发布到"http://212.47.247.139/challenge/ajax.php?submission=%7B%7D".使用ajax.

I have a text area inside a form that holds some sql statement. I have a submit button inside the form. What i want to have happen is: when the user clicks the submit button, whatever is inside the textarea gets POSTED to "http://212.47.247.139/challenge/ajax.php?submission=%7B%7D" using ajax.

提交后，当我在网络"选项卡下查看时，我看到表单数据具有我输入的内容，但是我收到提交空白或提交失败的json解码".我是ajax，html和javascript的新手.代替 $('#blogSubmit').val()，我尝试了很多事情，例如 JSON.stringify({prop:$('#blogSubmit').val()

After submitting, When I look under the network tab, i see the form data has what I enter in, but I get a "Submission empty or json decode of submission failed". I am new to ajax, html, and javascript. In place of the $('#blogSubmit').val(), I have tried many things such as JSON.stringify({ prop: $('#blogSubmit').val()

我做错了什么?

实施Barmer建议的更改后进行更新

UPDATE after implementing changes Barmer suggested

   <p><h3>Enter your SQL query below:</h3>
    <form method="post" action="http://212.47.247.139/challenge/ajax.php?submission=%7B%7D" id="my-form">
        <textarea id='text1' class='sql' name='submission' rows=10 cols=120></textarea>
        <input type="button" id="blogSubmit" onclick="getText()">
        <br>
    </form>
    </p>
    <script>
        function getText() {
            // var str=document.getElementById("text1").value;
            // alert(str + "i did it");
    
            $.ajax('ajax.php?submission=%7B%7D', {
                        data: {submission: { prop: JSON.stringify($("#text1").val())}},
                        success: function(data) {
                            success_callback(data);
                            console.log("success " + data);
                        },
                        error: function(xhr, status, error) {
                            alert(error);
                        },
                        type: 'POST'
                    })
        }
</script>

现在我得到此错误:"警告:json_decode()期望参数1为字符串，在/var/www/my_website/challenge/ajax.php中给出的数组在 31
行提交为空或提交的json解码失败"

Now I get this error: "Warning: json_decode() expects parameter 1 to be string, array given in /var/www/my_website/challenge/ajax.php on line 31
Submission empty or json decode of submission failed"

为什么当我执行JSON.stringify将其转换为字符串时会给出一个数组?

Why would it say an array is given when I am doing JSON.stringify to convert it to string?

推荐答案

将提交"按钮更改为 type ="button" ，因此它不提交表单，仅运行您的函数.

Change the submit button to type="button" so it doesn't submit the form, it just runs your function.

在AJAX调用中，使用 JSON.stringify()将textarea的值转换为JSON.

In the AJAX call, convert the value of the textarea to JSON with JSON.stringify().

function getText() {

  $.ajax('ajax.php?submission=%7B%7D', {
    data: {
      submission: JSON.stringify($('#text1').val())
    },
    success: function(data) {
      success_callback(data);
      console.log("success " + data);
    },
    error: function(xhr, status, error) {
      alert(error);
    },
    type: 'POST'
  })
}

<p>
  <h3>Enter your SQL query below:</h3>
  <form method="post" action="http://212.47.247.139/challenge/ajax.php?submission=%7B%7D" id="my-form">
    <textarea id='text1' class='sql' name='submission' rows=10 cols=120></textarea>
    <input type="button" id="blogSubmit" onclick="getText()">
    <br>
  </form>
</p>

这篇关于提交为空或提交的json解码失败.如何在表格内提交textarea的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！