发送和接收div contenteditable

Question

I want to be able to send content editable text to a php file to make some changes using ajax. This is how it is set up:

index.php

<div id="textArea">
            <div contenteditable id="textField"></div>
        </div>
    </body>

</html>

<script>
    var storyArea = $("#storyArea");
    var textField = $("#textField");
    var textArea = $("#textArea"); 

    textField.on("keydown", function(e)
    {
        if (e.which == 13)
        {
            e.preventDefault();

            var newVal = textField.text();
            var exp = /\W/g;

            if(!(exp.exec(newVal)))
            {
                $.ajax(
                {
                    type: 'post',
                    url: 'story.php',
                    datatype: "html",
                    data: newVal,
                    success: function (data) 
                    {
                        alert(data);
                    }
                });
            }
            else
            {
                textArea.css("border", "2px solid #d45454");
                textField.empty();
                newVal = '';
            }
        }

    });

</script>

story.php

<?php 
    $input = $_POST['newVal'];
    echo $input;
?>

The problem I'm having is that my alert returns "Undefined index: newVal"

Thanks in advance.

Answer 1

You should use data: {newVal:newVal} to give the variable a name for the posted data. The function expects key:value pairs.