Question

As below, I am using a ‘Form’ and ‘AJAX’ to post the content of a text area to a URL within my site. I see the POST does work and posts the conetn to the server and on success I have tried to find the element on the page to append it, though it is not working.

Can you please advise?. The function success part of the call should be where I specificy the destination, though how do I append this data, put some ajax in the destination page html, on load etc?

<form id="test" onclick="submitForm();">{% csrf_token %}
    <textarea id="red_content" name="content"></textarea>
    <p>
        <input type="submit" value="Publish" name="send">
    </p>
</form>


function submitForm()
{
$.ajax({
url: "http://127.0.0.1:8000/Test/Trial",
data: $('#test'),
type: 'POST',
dataType: 'html',
success: function(data)
{
//$('.content-container5').setFocus();
$('.content-container5').html(data);

}

}); 

Many Thanks,

Tom

Answer 1

I’m not very familiar with submitting a single field via ajax (or in your case jQuery’s ajax function). I did however have to do a similar function in a project I recently had.

I found this plugin:

jQuery Ajax Form Submit

It seemed to work really well. You may want to look into this for your project as well. In this case, instead of submitting your one field, the form will be submitted. This may be easier since you won’t have to map the fields yourself. You can post the form to the same page and process it or post it to a given url.

Hope this helps.