2017-09-20 7 views
0

私はチェックボックスをクリックすると呼び出されるAJAX関数を持っています。通常、それは私のページの一部をオンまたはオフに切り替えます。それはうまくいくが、エラーが発生したとき、すなわち。特定の状況でチェックボックスをクリックすることが許可されていない場合、AJAXにこれが成功しなかったことを知らせたいと思います。Grails、コントローラからAJAXコールにエラーを返すにはどうすればいいですか?

また、フラッシュメッセージの使用と同じ場所に表示されるようにエラーメッセージを修正する方法もわかりません。

私がflash-messageを使用すると、同じページに再度リダイレクトする必要があり、そのページを内部に取得する必要があり、それほどうれしくありません。

私はそれが一般的なケースだと思うか、このb'causeのための標準的な解決策が存在するはずですか?

def useWeeklyVolumes() { 
    println("useWeeklyVolumes - params: "+params) 
    def od = OfferDetail.get(params.id) 
    String status = od.offerHeader.status 
    if ((status == 'Sold') || (status == 'Rejected')) { 
     transactionStatus.setRollbackOnly() 
     return render(status: 400, text:"Offer can not be changed (Sold/Rejected)")    
    } 

そして、ここにAJAX呼び出しがどのように見えるかです:

これは、この場合には使用されているコントローラの一部がどのようです。

$(document).ready(function(){ 
     $(document).on('change', '.useWeeklyVolumes', function (event){ 
      $.ajax({ 
       url: '${g.createLink(controller:'offerDetail', action:'useWeeklyVolumes')}', 
       data: {ckbWeeklyVolumes:this.checked, id:this.id}, 
       type: 'get', 
       success: function (data) { $('#nono').html(data);  }, 
       error: function (jqXHR) {document.querySelector('#alert').innerHTML = jqXHR.responseText; 
          const timeoutID = window.setTimeout(() => { 
          messageBox.innerHTML = ''; 
          window.clearTimeout(timeoutID); 
       }, 3000);} 
      }); 
     }); 
    }); 

これは私の最新の試みです:

<span id="alert"></span> 

エラーメッセージがここに表示されますが、私はリフレッシュを行うまで、それはそこに残っているだろう:私はこれを追加GSPで

<script> 
    $(document).ready(function(){ 
     $(document).on('change', '.batman', function (event){ 
     alert('Hej'); 
      $.ajax({ 
       url: '${g.createLink(controller:'person', action:'register')}', 
       data: {registered:this.checked, id:this.id}, 
       type: 'get', 
       success: function (data) { $('#alert').html(data);  }, 
       error: function (jqXHR) {const alert = document.querySelector('#alert').innerHTML = jqXHR.responseText; 
         const timeoutID = window.setTimeout(function() { 
         alert.innerHTML = ''; 
         window.clearTimeout(timeoutID); 
       }, 3000);} 
      }); 
     }); 
    }); 
</script> 

最終的な解決策:

<script> 
     $(document).ready(function(){ 
      $(document).on('change', '.batman', function (event){ 
       $.ajax({ 
        url: '${g.createLink(controller:'person', action:'register')}', 
        data: {registered:this.checked, id:this.id}, 
        type: 'get', 
        success: function (data) { $('#alert').html(data);  }, 
        error: function (jqXHR) {const alert = document.querySelector('#alert'); 
         alert.innerHTML = jqXHR.responseText; 
         const timeoutID = window.setTimeout(function() { 
          alert.innerHTML = ''; 
          window.clearTimeout(timeoutID); 
         }, 3000); 
        } 
       }); 
      }); 
     }); 

別の誤差関数と代替ソリューション:

<script> 
     $(document).ready(function(){ 
      $(document).on('change', '.batman', function (event){ 
       $.ajax({ 
        url: '${g.createLink(controller:'person', action:'register')}', 
        data: {registered:this.checked, id:this.id}, 
        type: 'get', 
        success: function (data) { $('#alert').html(data);  }, 
        error: function (jqXHR) {displayAlertMessage(jqXHR.responseText)} 
       }); 
      }); 
     }); 


     function displayAlertMessage(message) { 
      var timeOut = 5 
      jQuery('#alert').text(message).fadeIn() 
      jQuery('#alert').css("display", "block") 
      setTimeout(function() { 
      jQuery('#alert').fadeOut() 
      jQuery('#alert').css("display", "none") 
      }, timeOut * 1000); 
     } 

    </script> 
+0

のために行くことにした場合、私は非常に明確ではありませんよ応答を使用して最初のバージョンで

は、最初のエラーを言うときにはあなたが状況を扱っているわけバージョンのドキュメントを読みますコントローラーの動作&予期しないエラーではなく、フラッシュ領域にメッセージを中継したいですか? –

+0

はい、申し出のステータスが「拒否されました」とし、flash.message領域に表示されるエラーメッセージを返信したいとします。 – larand

答えて

1

あなたはフラッシュメッセージが表示され、div要素は、アラートIDを持っていると仮定しているのと同じdiv要素にエラーメッセージを表示しようとした場合、あなたはこれがに行くべきこの

// Remember jquery ajax error function can accept this params 
// Function(jqXHR jqXHR, String textStatus, String errorThrown) 
const alert = document.querySelector('#alert'); 

alert.innertHTML = 'Some message'; 

const timeoutID = window.setTimeout(() => { 
     alert.innerHTML = ''; 
     window.clearTimeout(timeoutID); 
}, 3000); 

ような何かを行うことができますドキュメントに示されているように最大3つのパラメータを受け付けるエラー関数http://api.jquery.com/jquery.ajax/

これは、データから得たメッセージを表示し、3秒後に削除されます。

@bassmartinには、コントローラでrenderメソッドを使用して特定のメッセージを作成し、状態を定義することができます。あるいは、2.3以上のgrailsバージョンを使用している場合は、respondを使うことができます。あなたはそのオプション

+0

これは非常に興味深いようですが、私はそれをエラー関数に含めることに失敗しました。 – larand

+0

私はこのようにしました:error:function(data){あなたのコード}そしてdiv idを別の場所に置くと、 "object Object"のようなテキストが得られ、テキストは消えません。 – larand

+0

Dataの代わりにjqXHR.responseTextを使用するように変更しても、テキストが表示されますが、テキストは消えません。 – larand

関連する問題