Ajax-запрос не работает при выборе значения цвета для строки таблицы

Question

Итак, у меня есть таблица, настроенная так:

$(document).ready(function($)
{    
function create_html_table (tbl_data)
{


    //--->create data table > start
    var tbl = '';
    tbl +='<table>'

        //--->create table header > start
        tbl +='<thead>';
            tbl +='<tr>';
            tbl +='<th>col1</th>';
            tbl +='<th>col2</th>';
            tbl +='<th>col3</th>';
            tbl +='</tr>';
        tbl +='</thead>';
        //--->create table header > end

        //--->create table body > start
        tbl +='<tbody>';


            //--->create table body rows > start
            $.each(tbl_data, function(index, val) 
            {
                //you can replace with your database row id
                var row_id = val['row_id'];

                //loop through ajax row data
                tbl +='<tr row_id="'+row_id+'" style="background-color:'+val['default_color']+'">';
                    tbl +='<td><label for="colorPicker_'+index+'">Color:</label><input type="color" class="colorpicker" value="'+val['default_color']+'" id="colorPicker_'+index+'"></td>'
                    tbl +='<td><div class="row_data" edit_type="click" col_name="col1">'+val['col1']+'</div></td>';
                    tbl +='<td><div class="row_data" edit_type="click" col_name="col2">'+val['col2']+'</div></td>';
                    tbl +='<td><div class="row_data" edit_type="click" col_name="col3">'+val['col3']+'</div></td>';

                    //--->edit options > end                        
                tbl +='</tr>';
            });
            //--->create table body rows > end
        tbl +='</tbody>';
        //--->create table body > end

    tbl +='</table>';
    //--->create data table > end

    //out put table data
    $(document).find('.tbl_user_data').html(tbl);
}


var ajax_url = "<?php echo APPURL;?>/ajax.php" ;
var ajax_data = <?php echo json_encode($q1);?>;

//create table on page load
//create_html_table(ajax_data);

//--->create table via ajax call > start
$.getJSON(ajax_url,{call_type:'get'},function(data) 
{
    create_html_table(data);
});

Цель этого - сгенерировать таблицу по запросу ajax из таблицы mysql.У каждой строки есть столбец с именем default_color, который определяет цвет строки в начальном оформлении строки.Я пытаюсь сделать ajax-запрос, который меняет цвет для этой строки, когда используется палитра цветов, чтобы он постоянно сохранялся в базе данных.Вот что я использовал в javascript для средства выбора цвета.

<script>
$(document).ready(function () {
$(document).on('click', 'tr', function () {

    $(document).on('change','.colorpicker',function(evt){
        var el=$(evt.target);
        var val=el.val(); 
        var tr=el.closest("tr");
        var data_obj = 
        {
            row_id: tr.attr("row_id"),
            col_name: "default_color",
            col_val:val,
            call_type: 'single_entry',              
        };
        $.post(ajax_url, data_obj, function(data) {

        })
    });
});



});

</script>

Однако ajax-запрос на отправку значения средства выбора цвета не работает, и я не уверен, почему.Все остальное редактируемое и отлично работает.Но это вызывает проблемы.

Так обновляются все остальные значения

if(isset($_POST['call_type']) && $_POST['call_type'] =="single_entry")
{   

$row_id     = app_db()->CleanDBData($_POST['row_id']);
$col_name   = app_db()->CleanDBData($_POST['col_name']); 
$col_val    = app_db()->CleanDBData($_POST['col_val']);

$tbl_col_name = array("col1", "col2", "col3", "row_id");

if (!in_array($col_name, $tbl_col_name))
{
    echo json_encode(array(
        'status' => 'error', 
        'msg' => 'invalid col_name', 
    ));
    die();
}

$q1 = app_db()->select("select * from users where row_id='$row_id'");
if($q1 < 1) 
{
    //no record found in the database
    echo json_encode(array(
        'status' => 'error', 
        'msg' => 'no entries were found', 
    ));
    die();
}
else if($q1 > 0) 
{
    //found record in the database

    $strTableName = "users";

    $array_fields = array(
        $col_name => $col_val,
    );
    $array_where = array(    
      'row_id' => $row_id,
    );
    //Call it like this:  
    app_db()->Update($strTableName, $array_fields, $array_where);


    echo json_encode(array(
        'status' => 'success', 
        'msg' => 'updated entry', 
    ));
    die();
}