0

내 주요 부분보기에서 하나의 언어 드롭 다운 목록이 있고 그 다음에 언어 속성이 드롭 다운 목록에서 선택한 값과 일치하는 조건으로이 페이지의 하위 항목을 보여주는 부분보기가 있습니다. 기본적으로 모든 하위 항목이 표시됩니다.일부 변경시 부분보기 새로 고침

<div class="rtd"> 
        @{ 
        var slang=new SelectList(
        new List<SelectListItem> 
        { 
         new SelectListItem { Selected = true, Text = "All", Value = ""}, 
         new SelectListItem { Selected = false, Text = "English", Value = "English"}, 
         new SelectListItem { Selected = false, Text = "Gujarati", Value = "Gujarati"}, 
         new SelectListItem { Selected = false, Text = "Hindi", Value = "Hindi"}, 
        }, "Value" , "Text", 1); 
        @Html.DropDownList("drpLang", @slang, new { @class = "dropdown"}) 

</div> 

<div class="list"> 
     @Html.Partial("_List") 
</div> 

따라서보기는 dropdownlist의 값에 따라 새로 고쳐 져야합니다. 그래서, 어떻게 달성 될 수 있습니까?

부분보기는 다음과 같습니다.

@{ var selection = CurrentPage.Children.Where("Visible").Where("language=\"English\""); } 

@if (selection.Any()) 
{ 
<ul> 
     @foreach (var story in selection) 
     { 
     <li class="col-lg-3 col-md-3 col-sm-6 col-xs-12"><a href="@story.Url" class="st-text"> @story.Name</a></li> 
     } 


</ul> 
} 

답변

1

당신은 selectList의의 변경 이벤트를 바인딩 JQuery와 스크립트를 작성할 수 있습니다

function BindSelectChange(){ 
     $('select').on('change',function(){ 
      // make an ajax call to your controller action 
      $.ajax({ 
       url:'/ControllerName/Action', 
       .... 
      }); 
     }); 
} 

bind a partial view via ajax 방법을 알아 보려면이 링크를보십시오.

그런 다음 컨트롤러 동작에 옵션 ID 또는 텍스트를 전달하십시오. select 요소의 선택된 옵션을 얻는 방법은 웹에서 확인하십시오.

당신은 단계 또는 seudo 코드에 대해 생각하는 경우 : // 클라이언트 1. 바인딩을 선택 요소의 변경 이벤트 2. 선택한 옵션 ID 또는 텍스트를 가져옵니다 - 당신이 3. 아약스를 확인하려는 작업에 따라 컨트롤러 동작을 호출하고, 성공하면 부분 뷰를 리 바인드합니다.

// 컨트롤러 액션 1. 옵션 ID/옵션 텍스트는 당신이 필요 적 어떤 데이터를 얻을 수와 뷰 모델/뷰 돌아갑니다 ->이 당신이 당신의 부분보기

+0

I에있는 것과 동일해야합니다을 이것에 새로운 ... 그래서 더 많은 것을 설명 할 수 있고 특정 아이 항목을 원할 수 있습니다. 어떻게 할 수 있습니까? – ghetal

+0

실제로 렌더링 할 모델을 사용하고 있지 않습니다. 하지만 내 질문에 명시된 바와 같이 umbraco partialview를 렌더링하려고합니다. 그래서 모델없이 렌더링하기 위해서 뷰만 되돌릴 수 있습니까? – ghetal

+0

나중에 할 수 있습니다. – JustLearning

관련 문제