ajax请求在为表行选择颜色值时不起作用

bbmckpt7  于 2021-06-17  发布在  Mysql
关注(0)|答案(0)|浏览(182)

我有一张table是这样摆的:

$(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);
});

其目的是从mysql表生成一个关于ajax请求的表。每行都有一个名为default\u color的列,用于确定行的初始样式中该行的颜色。我正在尝试执行一个ajax请求,在使用colorpicker时更改该行的颜色,以便将更改永久存储在数据库中。下面是我在javascript中为colorpicker使用的内容。

<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请求发送color picker值是不起作用的,我不知道为什么。其他一切都是可编辑的,工作正常。但这引起了一些问题。
这就是当前更新所有其他值的方式

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();
}

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题