How to submit a textarea using wysiwyg editor and jquery

Question

Ok, because I am such a noob and have no idea how javascript works... My thinking was flawed. I am halfway there now. I have taken one of the poster's suggestions and set up a function and then in the html form tag, I call it. This works. I thought that I needed to have an id selector to have JQuery trigger but that isn't the case. I'm sorry. I know I am not making any sense at all but please bear with me, I'm trying. :)

Now that I have the form pointing to the javascript/jquery script. I now need to fix the jquery. Here is the code.

function doSave(){
  $(function() {
    $('.error').hide();
    $("#dfar").click(function() {
      $('.error').hide();

    var textArea = $('#dfarReport');
    if (textArea.val() == "") {
    alert('sd');
      textArea.show();
      textArea.focus();
    return false;
    }

For some reason, even though I press the submit button and have included the id selector of the text area I cannot see the alert. Can someone please tell me what I am doing wrong?

Answer 1

You could get the textarea by

$('textarea')

If it's the only one on your page.

You just need to call submit on the form that the textarea is contained within

EDIT:

After reading your update, you just want to validate that the textarea is not blank before submitting the form. You just need to set up the validation

var textArea = $('#results'); //Get the textarea

if (textArea.val() == "") {
    textArea.show();
    textArea.focus();
return false;
}
// perform the form submit here as textarea is not blank

Could you post the whole object where you have got the code beginning with

 case "Save":

from? It would probably be a good idea to use that object to perform the submit.

EDIT 2:

In regard to your comment about the page being refreshed, submitting the form causes the page to be POSTed. It sounds like you want to POST data using AJAX.

Take a look at jQuery's $.ajax() command

Answer 2

Change button to

<script>
function doSave()
{
   // save data using jQuery
}
</script>
<input type="button" value="Save" onclick="doSave(); return false;">

or

You can change the form with

<form onsubmit="doSave(); return false;">

Answer 3

You could do something like

$(document).ready(function(){
    $("#submit_btn").click(function(){
        mySubmit($("#myForm")) ; // call your existing javascript submit routine
    });
});

or if you prefer,

$(document).ready(function(){
    $("#myForm").submit(function(){
        mySubmit($("#myForm")) ; // call your existing javascript submit routine
    });
});

Answer 4

ok, I think you'll need this:

$(document).ready(function(){

    $("form").submit(function(){
        var textArea = $('#dfarReport');

        if (textArea.val() == "") {
            textArea.show();
            textArea.focus();
            return false;
        }
        else // you'll need to add the else and the return true
        {
            return true; 
        }
    });

});

you need to return true when the form is valid.

More info: http://docs.jquery.com/Events/submit

But make sure that you validate the data on the server as well!

Answer 5

please post the code you use.

You edited like 3x and there's always a different approach.

Ok, if you want to use the code as you defined in your first post right now, you 'll have to do this:

function doSave(){
  $(function() {
    $('.error').hide();
    $("#dfar").click(function() {
      $('.error').hide();

    var textArea = $('#dfarReport');
    if (textArea.val() == "") 
    {
      alert('sd');
      textArea.show();
      textArea.focus();
    return false;
    }
    else
    {
        return true;
    }