2009-11-20 4 views
1

현재 페이지의 열에 팀 위치가 4 년인 PHP 페이지가 있습니다. 클라이언트는 위치에서 플레이어를 선택하고 첫 번째, 두 번째 및 세 번째 선택 사항을 갖기를 원합니다. 현재 페이지에는 각 위치에 대해 콤보 세트가있는 4 개의 열이 표시됩니다. 각 콤보에는 플레이어 집합이 있으며 사용자는 콤보에서 원하는 플레이어를 선택합니다. 제출시 플레이어 위치가 데이터베이스에 저장됩니다. 그러나 클라이언트는 이제 페이지를 변경하여 1 년 후 플레이어를 선택하면 콤보에서 플레이어를 제거하고 해당 연도에 더 이상 선택할 수 없도록합니다. 나는 약간의 AJAX를 사용했지만 어떤 생각이나 제안이 있는지 궁금해하고있었습니다. 페이지가 현재 매우 느려서 속도를 높이기를 원합니다. 플레이어가 선택 될 때 그 아래의 모든 콤보 제거 할 필요가 -PHP 콤보 상자 AJAX 새로 고침

페이지 레이아웃이

POISTION    YEAR1   YEAR2  YEAR3   YEAR4 
1     COMBOC1   COMBOC1  COMBOC1  COMBOC1 
        COMBOC2   COMBOC2  COMBOC2  COMBOC2 
        COMBOC3   COMBOC3  COMBOC3  COMBOC3 

2 same as above 

COMBOC1, 2, 3 모두 현재 같은 선수를 가지고있는 것처럼 현재. - I를 매년 걱정하는

다음
POISTION    YEAR1       YEAR2   YEAR3   YEAR4 
1     <PLAYER><POSITION><CHOICE> ... 

        [TEXT BOX CHOICE1] 
        [TEXT BOX CHOICE2] 
        [TEXT BOX CHOICE3] 

2 ... 

난 단지 1 콤보 상자를 가지고 :이처럼 매년에서 선택 플레이어와 싱글 플레이어를위한 텍스트 상자를 페이지 디자인을 변경하고 필요에 의해 시작 생각했다 그러나 콤보 상자를 새로 고치고 선택한 플레이어를 제거하는 것과 같은 문제가 있습니다. 페이지를 제출하면서 수행하는 것을 선호합니다. 긴 게시물에 대한 죄송합니다

- 환호

답변

0

난 당신이 지난 몇 년 동안 '선택 상자에서 선택한 내용에 따라 다음 선택 상자에서 옵션을 제거한다 수행 할 작업을 제대로 질문을 이해하고합니다. 이 작업을 수행하기 위해 양식을 제출하면 안됩니다. 자바 스크립트에서만 순전히 할 수 있어야합니다. 얻을 수 있도록해야이 코드는 시작 :

기본적으로
 

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".year").change(function() { 
      var name = $(this).attr("name"); 
      var checkYearNum = name.substr(4); 
      var value = $(this).val(); 
      var removeFromLaterYears = function (index) { 
       var yearNum = $(this).attr("name").substr(4); 
       if (yearNum > checkYearNum) { 
        var selector = "[value='" + value[0] + "']"; 
        $(this).children(selector).remove(); 
       } 
      } 
      $(".year").each(removeFromLaterYears); 
     }); 
    }); 
</script> 
</head> 
<body> 
<form> 
<fieldset> 
<select class="year" name="year1"> 
    <option value="">Select...</option> 
    <option value="player1">Player 1</option> 
    <option value="player2">Player 2</option> 
    <option value="player3">Player 3</option> 
</select> 

<select class="year" name="year2"> 
    <option value="">Select...</option> 
    <option value="player1">Player 1</option> 
    <option value="player2">Player 2</option> 
    <option value="player3">Player 3</option> 
</select> 

<select class="year" name="year3"> 
    <option value="">Select...</option> 
    <option value="player1">Player 1</option> 
    <option value="player2">Player 2</option> 
    <option value="player3">Player 3</option> 
</select> 
</fieldset> 
</form> 
</body> 
</html> 
 

,이 모든 선택 상자 변화 중 하나가, 어떤 다음 선택 상자에서 같은 값으로 선택을 제거 이벤트를 설정하는 JQuery와 사용하고있다 변경된 선택 상자의 연도 x 호보다 큰 연도 x 호 (각 선택 상자의 "이름"속성에 정의 됨)가있는.

이 외에도 플레이어가 선택되지 않은 경우 다시 추가 할 수 있도록 선택 상자에서 제거 된 선택 항목을 추적해야합니다.

콤보 상자에 대해서도 이야기 했으므로 선택 상자 외에도 텍스트 입력 필드가 있다고 가정하지만 동일한 원칙을 사용할 수 있습니다.

JQuery에 익숙하지 않은 사용자라면 JQuery를 알고 싶어 할 것입니다. 시작할 수있는 좋은 장소가 될 것입니다 : http://docs.jquery.com/How_jQuery_Works. 희망이 도움이됩니다.

+0

환호성 Steven 페이지 당김 속도를 높이기 위해 텍스트 상자로 약간 다른 트랙을 내려갔습니다. 하지만 귀하의 쿼리는 여전히 작동합니다 나는 콤보에서 값을 제거하고 정말 좋은 출발점을 제공 할 생각합니다. 건배 스티브 – bhs

+0

쿨, 도와 줘서 기쁩니다. –

관련 문제