ZF 아약스 일반 방법

Question

젠드 프레임 워크와 아약스에 약간의 문제가 있습니다.

보기에는 탭이있는 div가 있습니다. UnitTab "#tabUnits"를 클릭하면 Unit보기가 항목 목록과 함께 표시됩니다. 새로운 단위를 추가하는 링크가있어서 추가보기가 탭에로드됩니다.

<a id="addUnit" href="idBuilding/<?= $this->idBuilding ?>" href="#"><img width="16" height="16" src="/images/icons/fugue/plus-circle-blue.png"></a> 

및 AJAX 호출이다 :는 유닛을 추가

링크는

$(document).ready(function(){ 

    var url = '/unit/add/'+$("#addUnit").attr('href'); 

    // ADD 
    $("#addUnit").click(function(event){ 
     event.preventDefault(); // link is not executed 

     $.ajax({ 
      url: url, 
      type: 'GET', 
      success: function(data) { 
       $("#tabUnits").html(data); 
      }, 
      error: function(){ 
       alert('An error occurred, please check before continue...'); 
      } 
     }); 

    }); 

}); 

에러가 유닛이 추가 발생해서리스트를 재 표시 할 때.

ID가 변경되고 있다는 것을 알면서 어떻게 유닛을 편집하고 싶을 때 어떻게 똑같이 할 수 있습니까?

Answer 1

ZF와 공통점이 많지 않습니다. jQuery 일뿐입니다. 더 많은 요소에 대해 동일한 AJAX 호출을 사용하려면 url 변수 만 변경하십시오. 같은 뭔가 (테스트하지) :

데이터 매개 변수에 대한

<a class="link" data-url="add" id="addUnit" href="idBuilding/<?= $this->idBuilding ?>" href="#"><img width="16" height="16" src="/images/icons/fugue/plus-circle-blue.png"></a> 
<a class="link" data-url="edit" id=editUnit" href="idBuilding/<?= $this->idBuilding ?>" href="#"><img width="16" height="16" src="/images/icons/fugue/plus-circle-blue.png"></a> 


$(document).ready(function() { 

    var url; 

    // ADD 
    $(".link").click(function(event){ 
     event.preventDefault(); // link is not executed 

     url = '/unit/' + $(this).data('url') + '/' + $(this).attr('href'); 

     $.ajax({ 
      url: url, 
      type: 'GET', 
      success: function(data) { 
       $("#tabUnits").html(data); 
      }, 
      error: function(){ 
       alert('An error occurred, please check before continue...'); 
      } 
     }); 

    }); 

}); 

더 : http://api.jquery.com/data/#data-html5