Передать значение из JS в контроллер как пост-параметр

Наконец то попалась интересная тема.
Конечно можно не задавать здесь никаких вопросов, а просто погуглить и найти ответы(что обязательно и сделаю), но тема может быть интересна и другим, плюс может кто-то знает точный ответ и даже несколько.

Ситуация такая:
На ВФ странице есть форма внутри которой стоит JS анимированная галерея.
Пользователь жмет галерейный кнопки, двигая ее вправо или влево, выбирая картинку, затем жмет на картинку в галереи и форма делает пост-реквест к контроллеру, после чего возвращается перезагруженная страница с той же галерей и доп секцией.
Как вы уже наверное догадались, после перезагрузки галерея приходит "как новая", т.е. стоит в начале, а надо чтобы изменный параметр элемента ("сдвиг" галереи, по факту это будет margin-left у дива, но можно использовать и кол-во шагов галереи) был установлен как это было до пост-бека (т.е. стоял на той же картинке).

Вопрос: как передать это значение, которое в момент отправки формы будет получено JSом как параметр этой же формы? сейчас буду посмотреть.

есть и более простой вариант: а зачем передергивать всю страницу, оставь галерею в покое, перерисуй аджаксом только доп секцию с фактической информацией. Это разумный вариант, но пока я хочу разобраться как же все-таки сделать, что я задумал изначально, так как наверняка это пригодится.

спасибо

Den Brown

Наконец то попалась интересная тема. 
Конечно можно не задавать здесь никаких вопросов, а просто погуглить  и найти ответы(что обязательно и сделаю), но тема может быть интересна и другим, плюс может кто-то знает точный ответ и даже несколько. 

Ситуация такая:
На ВФ странице есть форма внутри которой стоит JS анимированная галерея. 
Пользователь жмет галерейный кнопки, двигая ее вправо или влево, выбирая картинку, затем жмет на картинку в галереи и форма делает пост-реквест к контроллеру, после чего возвращается перезагруженная страница с той же галерей и доп секцией.
Как вы уже наверное догадались, после перезагрузки галерея приходит "как новая", т.е. стоит в начале, а надо чтобы изменный параметр элемента ("сдвиг" галереи, по факту это будет margin-left у дива, но можно использовать и кол-во шагов галереи) был установлен как это было до пост-бека (т.е. стоял на той же картинке).

Вопрос: как передать это значение, которое в момент отправки формы будет получено JSом как параметр этой же формы? сейчас буду посмотреть.

есть и более простой вариант: а зачем передергивать всю страницу, оставь галерею в покое, перерисуй аджаксом только доп секцию с фактической информацией. Это разумный вариант, но пока я хочу разобраться как же все-таки сделать, что я задумал изначально, так как наверняка это пригодится.

спасибо

Передать параметр из JS в контроллер очень просто.
используй apex:actionFunction

<apex:actionFunction action="{!methodOne}" name="methodOneInJavascript" rerender="showstate">
        <apex:param name="firstParam" assignTo="{!state}" value="" />
    </apex:actionFunction>

Офигенная штука, полезная. Я очень часто ей пользовался.

получается что на странице в JS ты вызываешь функция с параметрами, а в результате отрабатывает метод в контроллера, а параметры попадают в переменные контролера, которые можно использовать в методе.

Dmitry Shnyrev

Передать параметр из JS в контроллер очень просто.
используй apex:actionFunction

[code]<apex:actionFunction action="{!methodOne}" name="methodOneInJavascript" rerender="showstate">
        <apex:param name="firstParam" assignTo="{!state}" value="" />
    </apex:actionFunction>[/code]
Офигенная штука, полезная. Я очень часто ей пользовался.

получается что на странице в JS ты вызываешь функция с параметрами, а в результате отрабатывает метод в контроллера, а параметры попадают в переменные контролера, которые можно использовать в методе.

спасибо буду пробовать.

и дело в том что в момент клика идет отправка формы - не знаю как это совмещается с кодом выше.

есть еще вариант, как я понял парень предлагает закидывать нужное значение в apex:inputHidden требуемой формы:

еще вариант

это выглядит более логично.

но apex:actionFunction выглядит проще - буду пробовать его первым. надо тему изучить подробно

Den Brown

спасибо буду пробовать.

и дело в том что в момент клика идет отправка формы - не знаю как это совмещается с кодом выше.

есть еще вариант, как я понял парень предлагает закидывать нужное значение в [b]apex:inputHidden[/b] требуемой формы:

[url=https://developer.salesforce.com/forums/ForumsMain?id=906F00000008o7UIAQ]еще вариант[/url]

это выглядит более логично.

но apex:actionFunction выглядит проще - буду пробовать его первым. надо тему изучить подробно

Den Brown

есть еще вариант, как я понял парень предлагает закидывать нужное значение в apex:inputHidden требуемой формы:

Тоже отличный вариант.

Den Brown

Пользователь жмет галерейный кнопки, двигая ее вправо или влево, выбирая картинку, затем жмет на картинку в галереи и форма делает пост-реквест к контроллеру, после чего возвращается перезагруженная страница с той же галерей и доп секцией.

Хотя по твоему описанию тут смысл в том что пользователь выбрал картинку о которой надо скажем показать какую-то информацию. Получается что в контроллер нужно передать только ID картинки не более. Тогда мой вариант.

Если же ты сначала выбираешь картинку, а потом сабмитишь какую-то форму, вместе с которой должна передаваться информация о выбранной картинке, тогда apex:inputHidden подойдет лучше.

Dmitry Shnyrev

[quote="Den Brown"]есть еще вариант, как я понял парень предлагает закидывать нужное значение в apex:inputHidden требуемой формы:[/quote]
Тоже отличный вариант.

[quote="Den Brown"]Пользователь жмет галерейный кнопки, двигая ее вправо или влево, выбирая картинку, затем жмет на картинку в галереи и форма делает пост-реквест к контроллеру, после чего возвращается перезагруженная страница с той же галерей и доп секцией. [/quote]
Хотя по твоему описанию тут смысл в том что пользователь выбрал картинку о которой надо скажем показать какую-то информацию. Получается что в контроллер нужно передать только ID картинки не более. Тогда мой вариант.

Если же ты сначала выбираешь картинку, а потом сабмитишь какую-то форму, вместе с которой должна передаваться информация о выбранной картинке, тогда apex:inputHidden подойдет лучше.

Нет, я застрял на этом.

вот схема кода - это элемент галереи, череда которых создается динамически:

<apex:repeat>
<apex:form>
<apex:commandLink action="{!myAction}"

<apex:param value="{!repet.value}"

<apex:param value="{!repet.value2}"

<apex:image

</apex:commandLink>
</apex:form>
</apex:repeat>

как видите при клике на картинке (которая внутри команд линка) в контроллер уходят два параметра с размотанным рипитором значениями.

И нужно чтобы в этот же момент в контроллер ушло еще 1-2 значения (положение галереи), которые получаем через JS!

Ок,
вставляем в форму apex:inputHidden значение в которое записываем JS на onclick команд линка - значение из apex:inputHidden не уходит в контроллер (!) при клике на команд линк! хотя вижу что само apex:inputHidden я получил и его значение перезаписал в onclick. проблема.

(2) может можно получить команд линковые параметры в JS и записать валю перед отправкой? было бы прекрано. Но нет.

(3) попробовать actionFunction? ок одни параметр я передам в этот скрипт но как быть еще с двумя, которые разматываются репитором. проблоема.

А может можно использовать actionFunction вмсесте в команд линк? т.е. перед сработкой команд линка отрабатывает actionFunction, который уносит новый параметр в контроллер а потом срабатывает команд-линк? смысла нет, так как отравленное в контроллер значение не будет там "ждать" прихода двух еще параметров с команд линка, это разные процессы...

н да

Den Brown

Нет, я застрял на этом.
вот схема кода - это элемент галереи, череда которых создается динамически:
<apex:repeat>
<apex:form>
<apex:commandLink action="{!myAction}"
<apex:param value="{!repet.value}"
<apex:param value="{!repet.value2}"
<apex:image
</apex:commandLink>
</apex:form>
</apex:repeat>
как видите при клике на картинке (которая внутри команд линка) в контроллер уходят два параметра с размотанным рипитором значениями.
И нужно чтобы в этот же момент в контроллер ушло еще 1-2 значения (положение галереи), которые получаем через JS!
Ок,
вставляем в форму apex:inputHidden значение в которое записываем JS на onclick команд линка - значение из apex:inputHidden не уходит в контроллер (!) при клике на команд линк! хотя вижу что само apex:inputHidden я получил и его значение перезаписал в onclick. проблема.
(2) может можно получить команд линковые параметры в JS и записать валю перед отправкой? было бы прекрано. Но нет.
(3) попробовать actionFunction? ок одни параметр я передам в этот скрипт но как быть еще с двумя, которые разматываются репитором. проблоема.
А может можно использовать actionFunction вмсесте в команд линк? т.е. перед сработкой команд линка отрабатывает actionFunction, который уносит новый параметр в контроллер а потом срабатывает команд-линк? смысла нет, так как отравленное в контроллер значение не будет там "ждать" прихода двух еще параметров с команд линка, это разные процессы...
н да

Я бы запилил как 3 способ
параметры, которые ты "разматываешь" репитом запиши в атрибуты картинки.
Просто при нажатии картинки сначала вызови обычную js функцию которая соберет все параметры и потом вызовет apex:function со всеми собранными параметрами, которые и отправятся в контролер.

т.е. должно получить как-то так:
1. onclick на картинке - вызов функции clickWrapper(this)
2. функция clickWrapper выбираешь все атрибуты по this и еще какие тебе там надо и откуда надо (с помощью jquery)
3. clickWrapper вызывает apex:actionFunction со всеми параметрами (param1, param2, ..., paramN)

Profit

У тебя конечно красиво с точки зрения Salesforce way (без единого HTML тега и без JS), но лучше делать с помощью JS.

Dmitry Shnyrev

Я бы запилил как 3 способ
параметры, которые ты "разматываешь" репитом запиши в атрибуты картинки.
Просто при нажатии картинки сначала вызови обычную js функцию которая соберет все параметры и потом вызовет apex:function со всеми собранными параметрами, которые и отправятся в контролер.

т.е. должно получить как-то так:
1. onclick на картинке - вызов функции clickWrapper(this)
2. функция clickWrapper выбираешь все атрибуты по this и еще какие тебе там надо и откуда надо (с помощью jquery)
3. clickWrapper вызывает apex:actionFunction со всеми параметрами (param1, param2, ..., paramN)

Profit :)

У тебя конечно красиво с точки зрения Salesforce way (без единого HTML тега и без JS), но лучше делать с помощью JS.

вот об этом:
apex:actionFunction со всеми параметрами (param1, param2, ..., paramN)

как я понял paramN просто приписываются в параметры apex:actionFunction в порядке их размещения?!

возможно так все и придется сделать.

НО, только что поэкспериментировал - в идеальных условиях (просто пустая страница) команд линк отправляет значение скрытого поля в контроллер. Это ведь простейший путь. Сейчас буду разбираться почему этого не происходит на рабочей странице

Den Brown

вот об этом:
apex:actionFunction со всеми параметрами (param1, param2, ..., paramN)

как я понял paramN просто приписываются в параметры apex:actionFunction в порядке их размещения?!

возможно так все и придется сделать.

НО, только что поэкспериментировал - в идеальных условиях (просто пустая страница) команд линк отправляет значение скрытого поля в контроллер. Это ведь простейший путь. Сейчас буду разбираться почему этого не происходит на рабочей странице

Den Brown

НО, только что поэкспериментировал - в идеальных условиях (просто пустая страница) команд линк отправляет значение скрытого поля в контроллер. Это ведь простейший путь. Сейчас буду разбираться почему этого не происходит на рабочей странице

У меня есть предположение потому что onClick и Submit формы выполняются асинхронно (ввиду асинхронности js) и поэтому значение не успевает записаться в скрытое поле.

Dmitry Shnyrev

[quote="Den Brown"]НО, только что поэкспериментировал - в идеальных условиях (просто пустая страница) команд линк отправляет значение скрытого поля в контроллер. Это ведь простейший путь. Сейчас буду разбираться почему этого не происходит на рабочей странице[/quote]
У меня есть предположение потому что onClick и Submit формы выполняются асинхронно (ввиду асинхронности js) и поэтому значение не успевает записаться в скрытое поле.

а вот и нет.
JS отрабатывает вначале.

в идеальных условиях значение записанное JS в скрытое поле уходит в контрллер (новое значение видно в дебаге) и выводится на перегруженную страницу.

не могу понять почему не могу это повторить на рабочей.

там вообщето репитор, может он что-то мутит

Den Brown

а вот и нет.
JS отрабатывает вначале.

в идеальных условиях значение записанное JS в скрытое поле уходит в контрллер (новое значение видно в дебаге) и выводится на перегруженную страницу.

не могу понять почему не могу это повторить на рабочей.

там вообщето репитор, может он что-то мутит

да, сейчас с репитора размотал только одну форму - и все сработало - значение передалось в контроллер. что же ломает отправку?

Den Brown

да, сейчас с репитора размотал только одну форму - и все сработало - значение передалось в контроллер. что же ломает отправку?

Избавься от формы в репите.

Одна форма после репита. Репит за формой только для вывода геллереи.

Dmitry Shnyrev

Избавься от формы в репите.

Одна форма после репита. Репит за формой только для вывода геллереи.

Ок некоторые итоги.

если делать вот так:

<apex:repeat>
<apex:form>

<apex:inputHidden value="{!myProperty}" />

<apex:commandLink action="{!myAction}"

<apex:param value="{!repet.value}"
<apex:param value="{!repet.value2}"

<apex:image

</apex:commandLink>
</apex:form>
</apex:repeat>

то в контроллер уходит значение из inputHidden только из последней созданной рипитором формы.

если выводить форму из рипитора, то зачем мне вообще нужен commandLink?
нужно делать через apex:actionFunction.

попробовал через него передать параметр. Работает, но ведь результат виден только если на apex:actionFunction стоит rerender="что-то выводящие значение myProperty", то есть мы переирсовываем какую-то панель.

а если мы перерисовываем какую-то панель - а не перегружаем всю страницу как это есть изначально (ведь на commandLink в репиторе нет rerender - кликаешь и вся страница перегружается),
там вот если мы перерисовываем какую-то панель - то зачем мне это все вообще нужно?!
просто ставь на существующем commandLink rerender="то что и нужно обновить" - и галерея останется в прежнем положени, так как она и не перегружается.
вроде работает.

но чувство, что я так и понял всех тонкостей передачи в контроллер параметров так и осталось.

Den Brown

Ок некоторые итоги.

если делать вот так:

<apex:repeat> 
<apex:form> 

<apex:inputHidden value="{!myProperty}" /> 

<apex:commandLink action="{!myAction}" 

<apex:param value="{!repet.value}"
<apex:param value="{!repet.value2}"

<apex:image

</apex:commandLink> 
</apex:form> 
</apex:repeat>

то в контроллер уходит значение из inputHidden только [b]из последней[/b] созданной рипитором формы.

если выводить форму из рипитора, то зачем мне вообще нужен commandLink?
нужно делать через apex:actionFunction.

попробовал через него передать параметр. Работает, но ведь результат виден только если на apex:actionFunction стоит rerender="что-то выводящие значение myProperty", то есть мы переирсовываем какую-то панель.

а если мы перерисовываем какую-то панель - а не перегружаем всю страницу как это есть изначально (ведь на commandLink в репиторе нет rerender - кликаешь и вся страница перегружается),
там вот если мы перерисовываем какую-то панель - то зачем мне это все вообще нужно?!
просто ставь на существующем commandLink rerender="то что и нужно обновить" - и галерея останется в прежнем положени, так как она и не перегружается.
вроде работает.

но чувство, что я так и понял всех тонкостей передачи в контроллер параметров так и осталось.