2015-02-06 2 views
0

보기에서 주어진 몇 가지 매개 변수를 기반으로 Yii2 프로젝트 용 위젯을 만들고 싶습니다.보기의 일부를 업데이트하는 AJAX 호출을 만듭니다.Yii2의 위젯 내부에서 AJAX 호출?

기본적으로 업데이트 된 우편 번호 필드는 다른 PHP 파일에서 해당 도시를 검색합니다. 나는 효과가있는 것을 만들었지 만 이것이 내가 원하는 것을 할 수있는 올바른 방법인지 궁금해하고 있었다. AJAX 호출을 다시 작성하지 않아도되기 때문에이 기능을 여러 양식에서 재사용 할 수 있기를 바라고 프로젝트에서 필드를 재사용 할 수 있습니다.

나는 이런 식으로 내보기에 위젯을 호출

<?= SearchWidget::Widget(['id' => 'customerform-postalcode', 
          'dataTarget' => 'cities', 
          'targetId' => 'customerform-city', 
          'targetType' => 'dropdown']);?> 

및 위젯의

나는 기본적으로 페이지에 AJAX 호출을 메아리 만 실행() 함수가 있습니다.

public function run() 
{ 
    $jScript = 
     '<script>' 
      . '$("#' . $this->id . '").change(function(){' 
       .'$.ajax({' 
        . 'url: "../scripts/search.php",' 
        . 'data: {' 
         . 'needle: $("#' . $this->id . '").val(),' 
         . 'haystack: "' . $this->dataTarget . '"' 
        . '},' 
        . 'type: "POST"' 
       . '}).done(function(data){' 
        .'var targetType = "' . $this->targetType . '";' 
        .'if (targetType=="dropdown") {' 
         . '$("#' . $this->targetId . '").empty();' 
         . 'var obj = jQuery.parseJSON(data);' 
         . '$.each(obj, function(key, value) {' 
          . '$("#' . $this->targetId . '").append("<option>" + value + "</option>");' 
         . '});' 
        . '} else {' 
         . 'var obj = jQuery.parseJSON(data);' 
         . '$("#' . $this->targetId . '").val(obj);' 
        . '}' 
       . '});' 
      . '})' 
     .'</script>'; 
    echo $jScript; 
} 

첫째로, 나는 단지이 그것에 대해 이동하는 올바른 방법 인 경우 정말 확실 해요 그래서 YII 및 프레임 워크 작업을 시작했습니다. 나의 첫 번째 본능은 이것이 너무 지저분하고 더 좋은 방법이 있어야한다고 말한다. 어떤 도움을 주셔서 감사합니다.

답변

0

개인적으로 저는 PHP 코드에 JS 코드를 쓰는 것을 좋아하지 않습니다. 그래서 JS를 별도의 .js 파일로 가져 오려고합니다.

필자는 SearchWidget을 변경하여 JavaScript에 올바른 변수를 제공하는 몇 가지 추가 속성으로 입력 필드를 표시합니다.

<input type="text" name="postcode" id="postcode" class="search-field" data-target="cities" data-targetid="customerform-city" data-targettype="dropdown" /> 

그런 다음 아래 (검증되지 않은)처럼 뭔가에 JS를 다시 작성할 수 있습니다 : 그래서 내 우편 번호 입력 필드는 같을 것이다.

$('.search-field').change(function() { 
    var id = $(this).attr('id'); 
    var data_target = $(this).data('target'); 
    var target_id = $(this).data('targetid'); 
    var target_type = $(this).data('targettype'); 

    $.ajax({ 
     url: "../scripts/search.php", 
     data: { 
      needle: $("#" + id).val(), 
      haystack: data_target 
     }, 
     type: "POST" 
    }).done(function(data) { 
     if (target_type == "dropdown") { 
      $("#" + target_id).empty(); 
      var obj = $.parseJSON(data); 
      $.each(obj, function(key, value) { 
       $("#" + target_id).append("<option>" + value + "</option>"); 
      }); 
     } else { 
      var obj = $.parseJSON(data); 
      $("#" + target_id).val(obj); 
     } 
    }); 
}); 

는이 어딘가에 파일 및 위젯의 init 부분에 등록 JS했습니다.