将图像注释存储在数据库中而不刷新页面

时间:2018-05-15 05:12:22

标签: javascript php jquery ajax

我想将图像上生成的注释存储在数据库中。我使用Annotorious API来生成注释。 API说:

  

Annotorious的某些版本与jQuery冲突。在同一页面上使用Annotorious和jQuery时,应该将jQuery置于无冲突模式,并为jQuery的$ alias分配一个新的变量名,或者将jQuery代码包装到一个函数中,你可以在其中使用$ alias本地范围,

像这样:

jQuery.noConflict();
jQuery(document).ready(function($) {
    // You can use the locally-scoped $ in here as an alias to jQuery.
    $('div').hide();
});

myAnnotations.php:

<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
            <script type="text/javascript">
            jQuery.noConflict();
            </script>
            <script type="text/javascript" src="annotorious.min.js"></script>
<link type="text/css" rel="stylesheet" href="css/theme-dark/annotorious-dark.css" />

<script>
anno.addHandler('onAnnotationCreated', function(annotation) {
        var anno_text = annotation.text;
        var anno_x =annotation.shapes[0].geometry.x;
        var anno_y = annotation.shapes[0].geometry.y;
        var anno_width = annotation.shapes[0].geometry.width;
        var anno_height= annotation.shapes[0].geometry.height;

        jQuery.post("insert-note.php",
            {anno_text:anno_text,anno_x:anno_x,anno_y:anno_y,anno_width:anno_width,anno_height:anno_height}
            );
    });
</script>

插入-data.php:

<?php
$anno_text = $_POST['anno_text'];
$anno_x = $_POST['anno_x'];
$anno_y = $_POST['anno_y'];
$anno_width = $_POST['anno_width'];
$anno_height = $_POST['anno_height'];
$sql = "insert into `notes`(`note`,`annox`,`annoy`,`anno_width`,`anno_height`) VALUES ('$anno_text','$anno_x','$anno_y','$anno_width','anno_height')";
$sql_query = mysqli_query($dbcon, $sql) or die(mysqli_errno($dbcon));
?>

这既不存储数据库中的值也不显示任何php或mysql错误。

1 个答案:

答案 0 :(得分:0)

插入-data.php:

$anno_x = (double) $_POST['anno_x'];
$anno_y = (double) $_POST['anno_y'];
$anno_width = (double) $_POST['anno_width'];
$anno_height = (double) $_POST['anno_height'];

有效。