Динамические параметры с использованием remoteLink в Grails - PullRequest
1 голос
/ 03 июля 2010

Я хочу сделать Ajax-вызов с использованием remoteLink (с Prototype в качестве библиотеки Javascript), но мне нужно, чтобы один из передаваемых параметров был значением из текстового поля.Вот что у меня есть в моем GSP:

<input id="email" name="email" type="text"/>
...
<g:remoteLink action="addEmail" params="[email:???]">Add</g:remoteLink>

Что я ставлю вместо ???заставить RemoteLink отправить значение текстового поля электронной почты в качестве параметра?По сути, как мне ссылаться на DOM / обращаться к нему в теге Grails?

Я пытался поместить

\$('email').value

вместо ???но я получил ошибку "Не удалось разобрать скрипт" в моем GSP.

Спасибо

Ответы [ 6 ]

5 голосов
/ 05 июля 2010

Мне нужно было сделать что-то подобное раньше, и мне помогло следующее (да, не особенно элегантно):

<input id="email" name="email" type="text"/>
...
<g:javascript>
    var addEmail = function()
    {
        ${ remoteFunction (action:"addEmail", update:"update-element-id", params:"  'email=' +$('email').value  ") }
    };
</g:javascript>
<a href="javascript:void(0)" onclick="addEmail();return false;">add email</a>

Извлечено в функцию javascript для ясности и добавлено несколько пробелов в параметрах для более четкого отображения одинарных кавычек.

3 голосов
/ 03 июля 2010

<g:remoteLink action="addEmail" params="${[email: some.groovy.to.get.your.email()]}">Add</g:remoteLink>

2 голосов
/ 13 ноября 2012

Для этого есть лучшее решение.

Используйте атрибут before перед тегом remoteLink, чтобы установить переменную js, содержащую ваши DOM-объекты.

Например: в js:

var MyJSClass = {
  setParams: function() {
    MyJSClass.dynamicParams = {email: $("#email").val(), myOtherField: anyJSLogicHere()}  
  }
}

в gsp:

<g:remoteLink action="addEmail" params="MyJSClass.dynamicParams" before="MyJSClass.setParams()">Add</g:remoteLink>

См. Предыдущий код, который является функцией js, которая выполняется перед запросом и задает свойство dynamicParams, которое затем будет использоваться в запросе AJAX.

0 голосов
/ 18 июня 2013

Если вы хотите использовать remoteLink с Jquery, вот что сработало для меня.

<g:remoteLink action="${myBean.action}" params="[myParam: myBean.param]" update="updateDiv">
        My Awesome Link
</g:remoteLink>

просто и аккуратно.

0 голосов
/ 06 июня 2013

На основании ответа Эдуарда я вычитал, что код Javascript в атрибуте params будет выполнен.Поэтому я попробовал следующее, и это сработало:

<g:remoteLink action="addEmail" params="{email:\$('#email').val()}">Add</g:remoteLink>
0 голосов
/ 03 июля 2010

Если вы согласны с использованием кнопки вместо ссылки, это становится тривиальным с помощью g: submitToRemote. Но если это должна быть ссылка, вы можете сделать что-то ужасное, как это:

Просмотры / электронная почта / index.gsp:

<%@ page contentType="text/html;charset=UTF-8" %>

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Sample title</title>
    <g:javascript library="prototype" />
  </head>
  <body>
  <g:form name="theForm">
    Email: <g:textField name="emailAddr" />
    <!-- Here comes the ugly -->
    <a href="#" name="submit" 
       onclick="new Ajax.Updater('resp','${createLink(action:'addEmail')}',{asynchronous:true,evalScripts:true,parameters:Form.serialize(document.theForm)});return false">
    Submit Form
    </a>
  </g:form>
  <div id="resp">
  </div>
  </body>
</html>

Контроллер электронной почты:

class EmailController {

    def index = { }

    def addEmail = {

        if(params?.emailAddr) {
            render "${params.emailAddr}"
        }
        else {
            render "No Email Entered"
        }
    }
}

Пара вещей, на которые стоит обратить внимание, если вы настроите это: * первый аргумент «resp» Ajax.Updater - это идентификатор div, который вы хотите обновить * в команде Form.serialize (document.theForm) 'theForm' должно соответствовать имени, которому вы назначаете форму.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...