Question

This problem seems very strange to me because it is intermittant. I am going to be detailed so please bear with me.

I have a textarea which is made into a wysiwyg editor with http://redactorjs.com

I am using the click-to-edit feature (http://redactorjs.com/docs/examples/click-to-edit/) and saving the data with an ajax post.

The mysql database field is called ‘Info’ and is set to type ‘blob’.

Now, if i enter the following text into the textarea and press save, it will probably store it fine.

“Hello my name is greg and i am a very good actor.
I am also a cooking enthusiast who once came 2nd in a cooking competition.”

Then if i click edit and add to it

“Hello my name is greg and i am a very good actor.
I am also a cooking enthusiast who once came 2nd in a cooking competition. I also like to swim on a thursday morning!”

I sometimes see that only something like the below will be saved into the db.

“Hello my name is greg and i am a very good actor.
I am also a cooking enthusiast who once came”

Then if if edit it again and add the same text back in and save again it saves successfully!?!?

Let me show you some code..

view.php

echo the info data

<script>
function ClickToEditInfo()
{ 
    var info =  ['formatting', '|', 'bold', 'italic', 'deleted', '|',
                    'unorderedlist', 'orderedlist', 'outdent', 'indent', '|',
                    'table', 'link', '|',
                    'fontcolor', 'backcolor', '|', 
                    'alignleft', 'aligncenter', 'alignright', 'justify', '|',
                    'horizontalrule']
    $('#info').redactor({ 
            focus: true,
            buttons: info,
            wym: true,
            fixed: true
    }); 
}

function ClickToSaveInfo()
{
    var html = $('#info').getCode();
    var item = <?php echo $item_id; ?>;

    $.ajax({
            type: 'POST',
            url: "ajax/clickToEditInfo.php",
            data: "item_id="+item+"&html="+html,
            error: function(xhr, status, error) {
                console.log(error);
            },
            beforeSend: function() {
                $("#ajax").show();
                $("#ajax").html('<span class="label label-info">Saving info.. please wait</span>');
            },
            success: function(html){
                console.log(html);
                $("#ajax").html('<span class="label label-success">Saved!</span>');
                $("#ajax").fadeOut(1000, function () {
                    $(this).hide();
                });
            }
    });

    $('#info').destroyEditor(); 
}
<?php 
    endif; // end check if user owns item
}
?>
</script>

        <div id="info">
            <?php echo $item->getMainField('info', $item_id); ?>
        </div>  

clickToEditInfo.php

<?php 
include_once('../classes/item.class.php');
if (!isset($_SESSION)) session_start();

$item_id = $_POST["item_id"];
$html = $_POST["html"];
$user_id = $_SESSION['jigowatt']['user_id'];

if( $item->checkUserOwns($user_id, $item_id) ) : //check user owns item

    $item->clickToEditInfo($user_id, $item_id, $html);

else : // user does not own it
    return false;
endif; // end check if user owns item
?>

and

item.class.php > clickToEditInfo

public function clickToEditInfo($user_id, $item_id, $html) {
    $stmt = parent::query("UPDATE `item_main` SET `info` = '$html' WHERE `item_id` = $item_id AND `user_id` = $user_id");
}

Can you think of a reason why the data posted in the DB gets intermittently truncated?

UPDATE:

I have found a way to reliably reproduce it.
like i said its a wysiwyg editor.

“Hello my name is greg and i am a very good actor. I am also a cooking enthusiast who once came 2nd in a cooking competition.”

if i highlight competition and click the hyperlink button and link it to google for example. Press Save and the following is inserted.

“Hello my name is greg and i am a very good actor. I am also a cooking enthusiast who once came 2nd in a cooking”

i have edited

<?php 
include_once('../classes/item.class.php');
if (!isset($_SESSION)) session_start();

$item_id = $_POST["item_id"];
$html = $_POST["html"];
$user_id = $_SESSION['jigowatt']['user_id'];

if( $item->checkUserOwns($user_id, $item_id) ) : //check user owns item

    $item->clickToEditInfo($user_id, $item_id, $html);

    **echo $html;**

else : // user does not own it
    return false;
endif; // end check if user owns item
?>

and the console.log(html) is showing

<p>Hello my name is greg and i am a very good actor. I am also a cooking enthusiast who once came 2nd in a cooking

so its not posting all the data, something to do with the html tags?

UPDATE2

I have done console log on var html = $(‘#info’).getCode();
and confirmed that

<p>Hello my name is greg and i am a very good actor.</p><p>I am also a cooking enthusiast who once came 2nd place on Come dine with me :)&nbsp;<a href="goggle" target="">link</a>&nbsp;</p>

is posted, yet only

<p>Hello my name is greg and i am a very good actor.</p><p>I am also a cooking enthusiast who once came 2nd place on Come dine with me :) 

is received in clickToEditInfo.php

how do i fix this?

Answer 1

Escape the post data before sending it over POST

var html = escape($('#info').getCode());