FormMethod.Post가없는 Dropdownlist에서 SelectedItem 가져 오기

Question

내 모델의 목록에 바인딩 된 드롭 다운 목록이 있습니다. Model.list_IDs

현재 페이지는 사용자가 본질적으로 드롭 다운 목록을 사용하여 모델의 속성을 변경하는 "편집"페이지입니다. 드롭 다운리스트에서

@Html.DropDownListFor(model => Model.ID, Model.list_IDs, new { style = "width:250px" }) 

항목은 직관적이지, 그래서 내가 버튼을 제공하고자, 클릭 할 때,

( GetDetails라는 방법을 통해 컨트롤러에서 호출) 저장 프로 시저를 통해 추가 정보를 검색

버튼은 액션 링크를 통해 생성되며 단추를 클릭하면 추가 정보를 보여주는 부분 뷰 (집중된 팝업 창과 같이)를 표시 할 계획입니다. 그것은 단지 모델의 현재의 ID가 아닌 현재 드롭 다운리스트에서 선택한 ID를 전송하기 때문에

@Html.ActionLink(" ", "GetDetails", new { id = Model.ID.ToString() }, new { @class = "lnkMagnify16", title = "View Details" }) 

은 분명히 Model.ID.ToString()는 올바르지 않습니다.

Model.ID.ToString()을 어떻게 변경하여 드롭 다운 목록의 현재 선택된 항목을 나타낼 수 있습니까?

FormMethod.Post (Get selected item in DropDownList ASP.NET MVC)를 사용하여이 작업을 수행하는 방법이 있지만 제출 버튼이있는 페이지를 다시로드하지 않으려 고합니다. 가능하다면 JavaScript와 같은 "제 3 자"접근법도 피하고 싶습니다.

Answer 1

JavaScript는 "제 3 자"접근 방식이 아니며 여기에서 원하는 것을 성취하는 방법입니다. 표준 양식 게시판이든 AJAX (JavaScript)를 통해서든 은 새 정보를 얻기 위해 서버에 새 요청을해야합니다.

이제 동적으로 링크의 값을 Model.ID 값으로 업데이트하는 방법이 있으므로 AJAX 또는 양식 게시물을 사용하지 않아도되지만 JavaScript를 사용해야합니다. 모든 동적 동작 클라이언트 사이드는 JavaScript에서 비롯된 것입니다. 기본적으로 드롭 다운의 변경 이벤트에 바인딩하고 링크의 href 속성을 변경해야합니다.

document.getElementById('ID').addEventListener('change', function() { 
    var selectedId = this.options[this.selectedIndex].value; 
    document.getElementById('AwesomeLink').href = // alter `href` with `selectedId` 
}); 

그러나, 링크는 여전히 사용자가 클릭하면 전체보기를 변경하는 것입니다. 사용자가 페이지에 머물러있게하려면 AJAX를 사용하여 해당 링크의 응답을 가져온 다음 직접 또는 모달 팝업을 통해 페이지에 추가해야합니다 (아직 필요합니다). 더 많은 자바 스크립트를 달성하기 위해). 또한 Model.ID 값이 URL에서 끝나는 방법, 즉 URL이 경로 (/some/url/{id}/)인지 쿼리 문자열 매개 변수 (/some/url/?id={id})인지 여부는 명확하지 않습니다. 이전 버전 인 경우 URL 클라이언트 측을 훨씬 쉽게 구축 할 수 있으므로 후자로 전환하는 것이 좋습니다.

var xhr = new XMLHttpRequest(); 
xhr.addEventListener("load", function (response) { 
    // add response.responseText to the DOM 
}); 
xhr.open("GET", "/some/url/?id=" + selectedId); 
xhr.send();