grails - использование значений переменных в атрибутах remoteFunction - PullRequest
Новая
       0

grails - использование значений переменных в атрибутах remoteFunction

1 голос
/ 04 января 2012

[пожалуйста, начните с комментария, чтобы увидеть, где эта проблема в настоящее время, спасибо. Надеюсь, быстро / легко читается через]

У меня возникла ситуация, когда я рендерил шаблон, и шаблон имеет функцию javascript, которая должна отправлять правильные значения в действие контроллера через remoteFunction, например, ниже: 

<script type="text/javascript">
  function updateOrderEntry() {
    alert("updating OrderEntries");
    var unused = ${remoteFunction(action:'userByName', id:userId, update:[success: 'userOrderList', failure: 'userOrderListError'])};
  }
</script>

Я получаю предупреждение и "вызов" в контроллер нормально, когда эта функция выполняется на странице, но она не отправляет значение id (params не содержит id). Когда я создаю шаблон, я предоставляю userId в качестве параметра модели, и я убедился, что он хорошо вписывается в шаблон (например, в div).

Я перепробовал несколько вариантов выше, но не могу заставить его работать, например. используя remoteFunction в качестве тега: 

 var unused = <g:remoteFunction action="userByName" id="${userId}" update="[success: 'userOrderList', failure: 'userOrderListError']" />;

Я также пробовал различные варианты, используя атрибут params (что было бы лучше), но после того, как это не сработало, я подумал, что попробую просто заставить работать параметр id.

Что я делаю неправильно, когда я пытаюсь по-разному заполнять атрибуты remoteFunction?

Спасибо

[проект на Grails 1.3.7]

-------------------------------- обновление за 1-й / 2-й комментарий --------- --------------------------

У него не было отображений URL для этого контроллера, но я удалил тот, который был у меня для другого контроллера. Также закомментировал отладку beforeInterceptor, которую я имел в этом контроллере, а именно: 

  // def beforeInterceptor = [action: this.&debug]

  // def debug() {
  //  println "ACTION: ${actionUri}, PARAMS: ${params}"
  // }

Я добавил код отладки в начало моего действия userByName, а именно: 

 def userByName = {
    println "action: ${actionUri}, params: ${params}"

Я также сделал 3 версии функции remoteFunction, которая отправляется обратно из контроллера в шаблоне, со всеми 3 идентичными, кроме , вторая использует жестко закодированный идентификатор пользователя. вместо произведенного из переменной, а именно: 

 function updateOrderEntry() {
    alert("updating OrderEntries, 1st time");

    var unused = ${remoteFunction(action:'userByName', id:userId, params:[userId:userId], update:[success: 'userOrderList', failure: 'userOrderListError'])};

    alert("updating OrderEntries, 2nd time, THIS TIME WITH hardcoded id and param values");
    var unused = ${remoteFunction(action:'userByName', id:'4', params:[userId:'4'], update:[success: 'userOrderList', failure: 'userOrderListError'])};

    alert("updating OrderEntries, 3rd time, back to non-hard-coded values");
    var unused = ${remoteFunction(action:'userByName', id:userId, params:[userId:userId], update:[success: 'userOrderList', failure: 'userOrderListError'])};
}

Когда эта функция отправляется обратно в браузер (из шаблона рендеринга), браузер (Chrome, использующий сетевую отладку) показывает, что он получает: 

   function updateOrderEntry() {
    alert("updating OrderEntries, 1st time");

    var unused = jQuery.ajax({type:'POST',data:{'userId': '4'}, url:'/nameIsInAppPropsFile/money/userByName/4',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

    alert("updating OrderEntries, 2nd time, THIS TIME WITH hardcoded id and param values");
    var unused = jQuery.ajax({type:'POST',data:{'userId': '4'}, url:'/nameIsInAppPropsFile/money/userByName/4',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

    alert("updating OrderEntries, 3rd time, back to non-hard-coded values");
    var unused = jQuery.ajax({type:'POST',data:{'userId': '4'}, url:'/nameIsInAppPropsFile/money/userByName/4',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;
}

Все это выглядит идентично мне. UpdateOrderEntry () запускается автоматически, и я вижу все 3 предупреждения, как показано выше. Соответственно на сервере я вижу следующий отладочный вывод: 

action: /money/userByName, params: [userId:null, action:userByName, controller:money]
action: /money/userByName, params: [userId:4, id:4, action:userByName, controller:money]
action: /money/userByName, params: [userId:null, action:userByName, controller:money]

Проблема в том, что userId или id неправильно установлены (как видно на сервере) в 1-й и 3-й функциях remoteFunctions, неясно, почему это так. Что-то другое, просто не могу понять, что.

P.S. Результаты одинаковы для Chrome и Firefox.

------ обновлено в соответствии с комментариями 3 - 5 ниже --------------------------

Глядя на Chrome в том, что он отправляет, средний, хороший запрос выглядит так: 

 Request URL:http://localhost:8080/nameIsInAppPropsFile/money/userByName/4
 Request Method:POST
 Status Code:200 OK
 Request Headersview source
 Accept:*/*
 Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
 Accept-Encoding:gzip,deflate,sdch
 Accept-Language:en-US,en;q=0.8
 Connection:keep-alive
 Content-Length:8
 Content-Type:application/x-www-form-urlencoded
 Cookie:JSESSIONID=F0FDCEE323A1834350E209A7C211E64D
 Host:localhost:8080
 Origin:http://localhost:8080
 Referer:http://localhost:8080/nameIsInAppPropsFile/money/transaction
 User-Agent:Mozilla/5.0 (Windows NT 6.0) AppleWebKit/535.7 (KHTML, like Gecko) Chrome/16.0.912.63 Safari/535.7
 X-Requested-With:XMLHttpRequest
 Form Dataview URL encoded
   userId:4

2 плохих (обратите внимание на первую и последнюю строки, а также?): 

 Request URL:http://localhost:8080/nameIsInAppPropsFile/money/userByName
 Request Method:POST
 Status Code:200 OK
 Request Headersview source
 Accept:*/*
 Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
 Accept-Encoding:gzip,deflate,sdch
 Accept-Language:en-US,en;q=0.8
 Connection:keep-alive
 Content-Length:11
 Content-Type:application/x-www-form-urlencoded
 Cookie:JSESSIONID=F0FDCEE323A1834350E209A7C211E64D
 Host:localhost:8080
 Origin:http://localhost:8080
 Referer:http://localhost:8080/nameIsInAppPropsFile/money/transaction
 User-Agent:Mozilla/5.0 (Windows NT 6.0) AppleWebKit/535.7 (KHTML, like Gecko)  Chrome/16.0.912.63 Safari/535.7
 X-Requested-With:XMLHttpRequest
 Form Dataview URL encoded
   userId:null

Итак, это показывает, что браузер отправляет по-другому.

Когда я жестко закодировал значение, которое я дал шаблону, то есть модель: [...., userId: '4'], я получил тот же неудачный результат. До того, как я использовал: model: [...., userId: order.user.id], но я обновил свои выходные данные отладки и подтвердил, что даже жесткое кодирование '4' здесь не помогает.

ОБНОВЛЕНИЕ: добавление минимального контрольного примера, соответствующего реальному коду. Примечание: реальный код - это страница с 3 разделами, верхняя часть фиксируется, где выбирается клиент; средняя часть обновляется заказами для этого клиента; и нижний раздел показывает транзакции по кредитным картам, связанные через заказ, обычно несколько транзакций (например, авторизация, захват, аннулирование и т. д.). Когда пользователь выполняет действие (например, void) в нижнем разделе транзакции, ему нужно обновлять не только этот раздел, но и раздел среднего порядка. Я пытался заставить секцию заказа - " second div" - обновить, используя link / remoteFunction в нижнем разделе транзакции и в его обработчике onComplete, вызывая функцию Javascript, которая будет делать вторая функция remoteFunction для обновления раздела среднего порядка.

Ниже приведен минимальный тестовый пример, в котором я не могу точно воспроизвести проблему, но интересно нашел другую, но связанную проблему. Похоже, что Grails (или как-то IntelliJ, моя IDE) имеет проблемы с параметром id, указанным в remoteFunction, когда он находится внутри Javascript. Когда вы запустите его, вы поймете, что я имею в виду. Надеюсь, быстро скопировать в код и запустить. Спасибо.

---- какой-то простой контроллер, модель не нужна ---- 

 class UiTestController {

   static allowedMethods = [save: "POST", update: "POST", delete: "POST"]

  def index = {
    println "rendering remoteTest"
    render(view: 'remoteTest')
  }

  def section1 = {
    println "action1 params: ${params}"

    render(template: 'remoteSection1', model: [id: params.id])
  }

  def section2 = {
    println "action2 params: ${params}"
    render(template: 'remoteSection2', model: [id: params.id])
  }
}

--- remoteTest.gsp - 

 <%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
   <title>Remote</title>
   <g:javascript library="jquery" plugin="jquery"/>
</head>
<body>

   <div style="text-decoration:underline; color:purple; cursor:pointer; margin: 20px"
    onclick="${remoteFunction(action: 'section1', id:'1', update: 'section1')}">click to update section 1</div>
   <br />
   <div id="section1">1st Section to Update</div>
   <br />
   <div id="section2">2nd Section to Update</div>
  </body>
</html>

---- _remoteSection1.gsp ----- 

  <g:javascript library="jquery" plugin="jquery"/>

 <div>
     <p>Section 1 updated, (id=${id}). Now, similar to real code, we
     <span style="text-decoration:underline; color:purple; cursor:pointer;"
          onclick="${remoteFunction(action: 'section2', id: '2', update: 'section2')}">update section 2</span>
    </p>
 </div>

---- _remoteSection2.gsp ----- 

 <g:javascript library="jquery" plugin="jquery"/>

 <script type="text/javascript">
     function updateSection1() {
        alert("doing remoteFunction with fixed value 55");
        var unused = ${remoteFunction(action: 'section1', id='55', update: 'section1')};
        alert("doing remoteFunction with fixed value 65, using params");
        var unused = ${remoteFunction(action: 'section1', params:[id:'65'], update: 'section1')};
  } 
  </script>

  <div>
      <p>Section 2 updated, (id=${id}). Now, similar to real code, we
      <span style="text-decoration:underline; color:purple; cursor:pointer;"
          onclick="${remoteFunction(action: 'section2', id: '2', update: 'section2', onComplete: 'updateSection1()')}">update section 2 again, and also section 1 with javascript updateSection1() function</span>
     </p>
  </div>

FINAL UPDATE

Код сейчас работает, причина изменения неизвестна. Мне пришлось перейти к нескольким другим задачам, и я вернулся к этому с изменениями в моем контроллере, и на удивление все работает. Те же самые вызовы Javascript, что и раньше. Но я быстро опубликую его, если вы заметите, что раньше произошла какая-то путаница:

-------------------------- Соответствующий код Javascript в _moneyEntries.gsp -------------- ------------ 

  function updateOrderEntry() {
    alert("Updating OrderEntries --  1st time");
    ${remoteFunction(action:'userByName', id:userId, update:[success: 'userOrderList', failure: 'userOrderListError'])};

    alert("Updating OrderEntries -- 2nd time, THIS TIME WITH hardcoded id and param values");
    ${remoteFunction(action:'userByName', params:[id: '4'], update:[success: 'userOrderList', failure: 'userOrderListError'])};

    alert("Updating OrderEntries -- 3rd time, back to non-hard-coded values");
    ${remoteFunction(action:'userByName', params:[id: userId], update:[success: 'userOrderList', failure: 'userOrderListError'])};

 }

---------------- Что мне показывает сеть Google - полный ответ -------------- 

<script type="text/javascript" src="/nameIsInAppPropsFile/plugins/jquery-       1.6.1.1/js/jquery/jquery-1.6.1.js"></script>

<script type="text/javascript">

    function confirmVoid(moneyTransId) {
       return confirm("Void transaction ID " +moneyTransId + ":");
    }

   function confirmCredit(moneyTransId, amountIn) {
     var valid = false;
     var amount = amountIn;
    while (!valid) {
        var r = prompt("For ID " +moneyTransId+ ", please specify the amount:", amount);
        if (r == null || r == "") {
            valid = true;
            amount = -1;
        } else {
            //alert("result is:" +r);
            if (r > amount) {
                alert("You cannot credit an amount greater than " + amount);
                amount = amountIn;
            }
            else {
                amount = r;
                // invoke remote function, update result
                valid = true;
            }
        }
    }
    return amount;
}

function confirmCapture(moneyTransId) {
    return confirm("Capture funds for ID " +moneyTransId + ":");
}

function confirmSend(moneyTransId) {
    return confirm("Are you sure you want to send an email receipt for ID " +moneyTransId + ":");
}
    //var unused = jQuery.ajax({type:'POST', url:'/nameIsInAppPropsFile/money/userByName/3',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

function updateOrderEntry() {
    alert("Updating OrderEntries --  1st time");
    jQuery.ajax({type:'POST', url:'/nameIsInAppPropsFile/money/userByName/8',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

    alert("Updating OrderEntries -- 2nd time, THIS TIME WITH hardcoded id and param values");
    jQuery.ajax({type:'POST',data:{'id': '4'}, url:'/nameIsInAppPropsFile/money/userByName',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

    alert("Updating OrderEntries -- 3rd time, back to non-hard-coded values");
    jQuery.ajax({type:'POST',data:{'id': '8'}, url:'/nameIsInAppPropsFile/money/userByName',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});;

}


 </script>

 <div>
    <div style="margin-bottom:9px;">Order # 1005 Merchant Transactions:
    <span class="jsAction" style="padding-left:30px"
          onclick="jQuery.ajax({type:'POST',data:{'userId': '8'}, url:'/nameIsInAppPropsFile/money/userByName',success:function(data,textStatus){jQuery('#userOrderList').html(data);},error:function(XMLHttpRequest,textStatus,errorThrown){jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}});; return false;">(refresh order status)</span></div>
<div class="list">
    <table>
        <thead>
        <tr>
            <th>What Action?</th>
            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=id&amp;order=asc">ID</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=dateCreated&amp;order=asc">Date</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=type&amp;order=asc">Transaction Type</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=responseCode&amp;order=asc">Result</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=totalAmt&amp;order=asc">Amount</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=description&amp;order=asc">Description</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=txid&amp;order=asc">Authorize.Net Transaction Id</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=responseReasonText&amp;order=asc">Authorize.Net Response Text</a></th>

            <th class="sortable" ><a href="/nameIsInAppPropsFile/money/voidTrans/12?sort=ccNumber&amp;order=asc">Credit Card #</a></th>

        </tr>
        </thead>
        <tbody>

            <tr class="odd">

                <td>
                   <!-- First Check for transaction validity, for it to be 'actionable' -->

                      none

                   </td>


                <td>13</td>

                <td>01-13-12 03:41 MST</td>

                <td>VOID OF previous authorization, ID 12</td>

                <td><span class="">
                        Approved</span></td>

                <td>NA</td>

                <td>Void: sfk .</td>


                <td>2168161109</td>

                <td><span class="">
                    This transaction has been approved.</span></td>

                <td></td>

            </tr>

            <tr class="even">

                <td>
                   <!-- First Check for transaction validity, for it to be 'actionable' -->
                   none
                   </td>


                <td>12</td>

                <td>01-13-12 03:41 MST</td>

                <td>AUTHORIZATION ONLY - then Voided in ID 13</td>

                <td><span class="">
                        Approved</span></td>

                <td>$11</td>

                <td>sfk .</td>


                <td>2168161109</td>

                <td><span class="">
                    This transaction has been approved.</span></td>

                <td>x9113</td>

            </tr>

        </tbody>
    </table>
   </div>

   <!--div class="paginateButtons">

   </div-->
 </div>

-------------------------- Что вывод Debug показывает в контроллере ----- 

 ACTION: /money/userByName, PARAMS: [id:8, action:userByName, controller:money]
 ACTION: /money/userByName, PARAMS: [id:4, action:userByName, controller:money]
 ACTION: /money/userByName, PARAMS: [id:8, action:userByName, controller:money]

Итак, я не знаю, почему это работает сейчас, а не раньше. Но updateOrderEntry () тоже самое. Возможно, вы видите что-то, что я сделал не так, в этом случае, пожалуйста, дайте мне знать. Еще раз спасибо за вашу помощь, Томаш, я многому научился отлаживать с помощью Google Chrome (благодаря вашей помощи).

Ответы [ 2 ]

1 голос
/ 04 января 2012

Это хорошо для меня, Grails 2.0, я установил def userId = 7, и, как вы можете видеть, он появляется в URL: 

            function updateOrderEntry() {
                alert("updating OrderEntries");
                var unused = jQuery.ajax({type:'POST', 
                    url:'/controller/userByName/7',
                    success:function(data,textStatus)
                        {jQuery('#userOrderList').html(data);},
                    error:function(XMLHttpRequest,textStatus,errorThrown)
                        {jQuery('#userOrderListError').html(XMLHttpRequest.responseText);}
            });;}
0 голосов
/ 25 января 2013

вот как работают params в remoteFunction: 

....
params:'\'id=\'+document.getElementById(\'idField\').value',
.....
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...