Textarea Post Passed, but not data within form

Question

I have a form that I'm trying to pass through to update a page. My name and title are passed through; however, but my textarea does not. The code I'm using to pass the data

<script>
  $(function () {

    $('#updater').on('click', function (e) {

      e.preventDefault();

      $.ajax({
        type: 'post',
        url: 'calls.php',
        data: $('#updatepage').serialize(),
        success: function (data) {
            alert(data);
        location.reload();
        }
      });

    });

  });
</script>

And then my actual form is

 <form id="updatepage">
                  <input id="process" name="process" value="updatepage" type="hidden">
                  <input id="id" name="id" value="<?php echo $_GET['id']; ?>" type="hidden">
                  <table><tr><td>Name</td><td>Title</td></tr>
                  <tr><td><input type='text' name='name' id='name' value='<?php echo $admin->PageName(); ?>'></td>
                  <td><input type="text" name="title" id="title" value = "<?php echo $admin->PageTitle(); ?>"></td>
                  </tr>
                  </table>
                  <!-- tools box -->
                  <div class="pull-right box-tools">
                    <button class="btn btn-info btn-sm" data-widget='collapse' data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
                    <button class="btn btn-info btn-sm" data-widget='remove' data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
                  </div><!-- /. tools -->
                </div><!-- /.box-header -->
                <div class='box-body pad'>
                    <textarea id="editor1" name="editor1" rows="10" cols="80"><?php $admin->PageContent(); ?></textarea>
                    <a class="btn btn-app" id="updater">
                    <i class="fa fa-save"></i> Save
                  </a>
                  </form>

When I pass the data on the input ids are passed, but not matter what I do it seems my textarea always believes it's empty. The function that's called on the submission:

    public function UpdatePage() {
        global $db;
        $query = <<<SQL
        UPDATE pages
        SET name=:name,title=:title,content=:content
        WHERE id = :id
SQL;
        $resource = $db->sitedb->prepare( $query );
        $resource->execute( array(
        ':name' => $_POST['name'],
        ':title'=> $_POST['title'],
        ':content'  => $_POST['editor1'],
        ':id'   =>$_POST['id'],
        ));
    }

The problem lies within CK editor. For some reason attaching CK editor is making it so that it doesn't pass. Now I just have to find out why that is. The AJAX that's been modified to work with CKeditor $(function () {

    $('#updater').on('click', function (e) {
    for ( instance in CKEDITOR.instances )
    CKEDITOR.instances[instance].updateElement();

      e.preventDefault();

      $.ajax({
        type: 'post',
        url: 'calls.php',
        data: $('#updatepage').serialize(),
        success: function (data) {
            alert(data);
        location.reload();
        }
      });

    });

  });
</script>

Is there a binding error, perhaps? I noticed your "name" input's `name` attribute is "name" and call is `PageName()`, however, your textarea name attribute is `editor1` and call is `PageContent()`... do you mean for the textarea's name attribute to be `content`? — wahwahwah, May 15 '15 at 19:43
Unfortunately it's not that simple. :( I'm adding the call that's made when the form is submitted. — Morgan Green, May 15 '15 at 19:46
Similar question:[jQuery serialize leaves out textarea](http://stackoverflow.com/questions/17709014/jquery-serialize-leaves-out-textarea) - — Yogi, May 15 '15 at 19:46
Similar yes, but all I saw on there was cases of a forgotten name clause within the textarea and people arguing that it works fine on their end. — Morgan Green, May 15 '15 at 19:47

score 1 · Accepted Answer · edited May 23 '17 at 11:58

1

Your jQuery should be passing the data through fine. It is included in the serialize.

I used this code to alert what it is sending through and the textarea is included in the seralized data:

$('#updater').on('click', function (e) {
    alert($('#updatepage').serialize());
    e.preventDefault();
});

JS Fiddle: http://jsfiddle.net/zmgLba1h/

Since you mentioned using CKEditor, I found this SO thread about setting the value before submitting via ajax: https://stackoverflow.com/a/3256553/722617

edited May 23 '17 at 11:58

Community

1
1

answered May 15 '15 at 19:50

Bryan Zwicker

642
1
6
24

Yes, I actually just removed the CK editor and the data passed which tells me that it's a problem within CK editor now. – Morgan Green May 15 '15 at 19:52
I found an SO thread about submitting a CKEditor field. You need to set the textarea value before serializing. That should point you in the right direction – Bryan Zwicker May 15 '15 at 19:57
That's all correct. I appreciate it. I didn't even think about CK editor at first. – Morgan Green May 15 '15 at 20:06
I'm glad to have helped :) – Bryan Zwicker May 15 '15 at 20:06

Textarea Post Passed, but not data within form

1 Answers1