첫 번째 선택에서 두 번째 동적 드롭 다운을 채우는 Ajax 접근 방식

이전에는 Ajax를 많이 사용하지 않았으며 이는 간단 해 보입니다. 나는 퍼즐에 별개의 부분을 가지고 있지만, 어떻게 조합 할 지 확신하지 못합니다.첫 번째 선택에서 두 번째 동적 드롭 다운을 채우는 Ajax 접근 방식

모두 드롭 다운 처음에는 다음 코드를 사용하여 채워 데이터베이스에서 채워 :

<?php 
$sql = "SELECT title, nid FROM node where type= 'hotel'"; 
$hotels = mysql_query($sql); 
?> 
<select name="hotels" id="hotels"> 
<?php 
while($row = mysql_fetch_array($hotels)) 
{ 
    echo "<option value=\"".$row['nid']."\">".$row['title']."\n "; 
} 
?> 
</select>

두번째 드롭은 상기 선택된 값에 기초하여 채워질 것이다. 그래서 기본적으로 선택한 항목의 ID를 가져 와서 쿼리에서 사용하여 두 번째 드롭 다운을 채 웁니다.

가 나는 SQL 쿼리에 대해 다음과 같이하지만, 위의 코드를 사용합니다 : X 첫 번째 드롭 다운에 의해 selectedIndex의 ID입니다

SELECT title, nid from node where type = 'season' AND hotel_nid = X

코드가 작동하기는하지만 둘을 결합하는 방법을 모르겠습니다. Javascript를 사용하여 "seasons"라는 div의 InnerHTML을 수정하여 드롭 다운을 검색하고 표시하는 코드를 인쇄 할 수있었습니다.

하지만 두 가지 드롭 다운을 모두 표시 할 수있는 더 좋은 방법이 있지만 두 번째는 처음 완료 될 때까지 사용할 수 없습니까?

출처

2011-01-18 Dan Harris

안녕하세요, 저는 이제 jQuery를 설치하고 간단한 스크립트로 내 페이지에서 작업하고 있습니다. jQuery가 필요한 것을 얻을 수있는 가장 쉬운 방법은 무엇입니까? 조사하는 데 더 많은 시간이 걸리지 만 예상보다 빠른 클라이언트 때문입니다. 감사! –

두 번째 목록을 채우는 PHP 스크립트는 사용자가 첫 번째 드롭 다운 값을 변경할 때 Ajax를 통해 호출해야합니다. 따라서 onchange = "myFunctionToPopulate (this.value);"를 추가해야합니다. 첫 번째 드롭 다운까지

어떻게 해야할지 모르는 경우 jQuery와 같은 JS 라이브러리를 사용하는 것이 좋습니다.이를 위해 간단한 코드를 게시 해 드리겠습니다. jQuery로

편집

, 당신은 같은 것을 할 수 있습니다 your_script.php 전체 선택 태그를 반환

<select name="first_dropdown" onchange="$('#dropdown2_container').load('your_script.php?nid='+this.value);"> 
    <option.... 
</select> 
... 
<div id="dropdown2_container" style="display:none"> </div>

출처

2011-01-18 11:55:22 Nabab

onChange() 설정에 대해 알고 있지만, 내가 맞은 문제는 innerHTML을 두 번째 드롭 다운을 표시하도록 설정할 때입니다. Javascript에서 innerHTML을 설정할 때 js 변수 중간에 괄호를 사용할 수 없습니다. , 난 문자 등 탈출 시도했습니다 –

안녕하세요, 지금 설치 jQuery 및 테스트 간단한 스크립트 내 페이지에서 작동합니다. jQuery가 필요한 것을 얻을 수있는 가장 쉬운 방법은 무엇입니까? 조사하는 데 더 많은 시간이 걸리지 만 예상보다 빠른 클라이언트 때문입니다. 감사! –

예제를 사용하여 스크립트를 만들려고했습니다. 하지만 전체 선택 태그를 반환하는 데 문제가 있습니다. 사실 단순한 문자열이라도 반환하는 데 문제가 있습니다. 스크립트가 문자 그대로 " –

당신이 innerHTML 대신 <div> 당신의 <select> 상자의 채우기 사용할 수 있습니다,하지만 난 당신이 jQuery를 한 번 봐 가지고 조언 정말 것이다 : http://api.jquery.com/category/ajax/합니다. 그것은 모든 것을 훨씬 쉽게 만듭니다.

출처

2011-01-18 11:49:20

첫 번째 선택에서 두 번째 동적 드롭 다운을 채우는 Ajax 접근 방식

답변

관련 문제