Использование Javascript API для расширенных настраиваемых полей

Я создаю новый тип поля с расширенными настраиваемыми полями, который позволяет пользователю выбрать изображение из библиотеки изображений и определить точку (координаты X, Y) на этом изображении. После определения координат пользователь может разместить в этой точке наложение видео. Но у меня вопрос: как получить и установить значения X и Y в базе данных с помощью javascript API?


person Kasper Gantzhorn    schedule 07.12.2019    source источник
comment
Я думаю, вам следует сохранить массив JSON с идентификатором файла, позицией x и позицией y.   -  person Kaperto    schedule 08.12.2019
comment
ваша проблема - получить X, Y или сохранить в БД?   -  person Obmerk Kronen    schedule 08.12.2019
comment
@ObmerkKronen да, я сделал код JS для определения координат X / Y, и теперь мой вопрос: как сохранить их в базе данных ... и как получить их при повторном доступе к полю.   -  person Kasper Gantzhorn    schedule 08.12.2019
comment
ну, если вы используете ACF tan, вы просто заполняете поля, они будут сохранены со всеми другими данными и будут извлечены с именем поля ..   -  person Obmerk Kronen    schedule 08.12.2019
comment
@ObmerkKronen Итак, если у меня есть координаты X и Y в javascript, я могу обновить базу данных через объект acf в javascript ... как? Я попытался обновить объект $ field с помощью $ field.context.dataset.value = 123; Но, к сожалению, он не сохранил его в базе данных. Как это сделать?   -  person Kasper Gantzhorn    schedule 08.12.2019
comment
@ObmerkKronen и я попробовали acf.set (posX, 123); Работает нормально, но в базе не сохраняет.   -  person Kasper Gantzhorn    schedule 08.12.2019
comment
я имею в виду, просто заполните поле в форме ... и, пожалуйста, опубликуйте код, чтобы продемонстрировать контекст и где проблема   -  person Obmerk Kronen    schedule 09.12.2019


Ответы (1)


Итак, @ObmerKronen предложил мне опубликовать код, чтобы продемонстрировать, что я пытаюсь сделать ... имеет смысл :)

Я добавил изображение в новый php-файл поля ACF (class-tas-v5.php)

$imgID = get_field('image_url');
$img = wp_get_attachment_image( $imgID, "full", "", array( "class" => "overlay-point-img" ) );
echo '<div class="overlay-point-img-container">' . $img . '</div>';   

Затем я определяю координаты X и Y в файле input.js

function initialize_field($field) {

var overlay_point_container = $field.context;
var img = $(overlay_point_container).find(".overlay-point-img-container");
var circle = '<div class="overlay-point-circle"></div>';
img.prepend(circle);

$(img).on("mousemove", function(event) {
  var relX = event.pageX - $(this).offset().left;
  var relY = event.pageY - $(this).offset().top;

  $(circle).css({ left: relX, top: relY });
});

// Tried these two functions, but none of the values are saved in the database
// acf.set("posX", "123"); 
// $field.val("posX");
}

Я пытался сохранить это с фиктивными данными вроде этого

acf.set("posX", "123"); 
$field.val("posX");
person Kasper Gantzhorn    schedule 09.12.2019
comment
Вы разрешили это? Я пытаюсь добиться чего-то подобного, чтобы запечатлеть людей на изображении. - person Pete Harrison; 20.11.2020