2010-08-19 4 views
0

일련의 "관련"선택이있는 페이지가 있습니다. 미리 선택된 옵션이 없으면 모든 것이 잘 작동합니다. 코드에 "경고"를 넣으면 작동하도록 "사전 선택"을 설정할 수 있지만 작동하지 않으면 작동하지 않습니다. 예ajax로 생성 한 후 "선택 옵션"선택

:

function loader(){ 
    if ($("#prod_1").val() > 0){ 
     switchBatch(1); 
     $('#batch_1').val('15'); 
     updateMax(1); 
    } 
    if ($("#prod_2").val() > 0){ 
     switchBatch(2); 
     alert('yup'); 
     $('#batch_2').val('35'); 
     updateMax(2); 
    } 
} 
$(function() { 
    loader(); 
}); 

갖고 두 번째 "경고 ('응을');" 그것은 작동하지만 첫 번째는 작동하지 않습니다.

"switchBatch()"는 (ajax 호출에서) 옵션을 일괄 선택 컨트롤로로드하는 함수입니다. 두 인스턴스 모두 옵션을로드하지만 두 번째 인스턴스 만 올바른 옵션을 선택합니다.

제안 사항?

랜스 여기

전체 일 :

<script> 
    maxVals = []; 
    function switchBatch(idNum){ 
     maxVals = []; 
     $("#max_"+idNum).val(''); 
     $.ajax({ 
      type: "POST", 
      url: "/cfc/product.cfc?method=pialJson", 
      data: ({ 
       productID: $("#prod_"+idNum).val() 
      }), 
      dataType: "json", 
      success: function(result){ 
       options = ''; 
       var colMap = new Object(); 
       for(var i = 0; i < result.COLUMNS.length; i++) { 
        colMap[result.COLUMNS[i]] = i; 
       } 
       for (var i = 0; i < result.DATA.length; i++){ 
        options += '<option value="' + result.DATA[i][colMap["BATCHID"]] + '">' + result.DATA[i][colMap["BATCHNAME"]]+ '</option>'; 
        maxVals[i] = result.DATA[i][colMap["INSTOCK"]]; 
       } 
       $("select#batch_"+idNum).html(options); 
       updateMax(idNum); 
      } 
     }); 
    } 
    function updateMax(idNum){ 
     thisOne = $("#batch_"+idNum).attr("selectedIndex"); 
     $("#max_"+idNum).val(maxVals[thisOne]); 
     checkMax(idNum); 
    } 
    function checkMax(idNum){ 
     $("#qty_"+idNum).removeClass('red'); 
     if ($("#qty_"+idNum).val() > $("#max_"+idNum).val()){ 
      $("#qty_"+idNum).addClass('red'); 
     } 
    } 

    function loader(){ 
     if ($("#prod_1").val() > 0){ 
      switchBatch(1); 
      alert('yup'); 
      $('#batch_1').val('<cfoutput>#batch_1#</cfoutput>'); 
      updateMax(1); 
     } 
     if ($("#prod_2").val() > 0){ 
      switchBatch(2); 
      alert('yup'); 
      $('#batch_2').val('<cfoutput>#batch_2#</cfoutput>'); 
      updateMax(2); 
     } 
    } 
    $(function() { 
     loader(); 
    }); 
</script> 

답변

0

switchBatch() 함수가 AJAX 요청 후에 실행하려고하는 코드가 포함 된 다른 인수를 허용하는지 확인하십시오.

나서() switchBatch().

function loader(){ 
    if ($("#prod_1").val() > 0) { 
     switchBatch(1, function() { 
      $('#batch_1').val('15'); 
      updateMax(1); // right now this is being called in switchBatch() as well 
     } 
     ); 
    } 
    if ($("#prod_2").val() > 0) { 
     switchBatch(2, function() { 
      $('#batch_2').val('35'); 
      updateMax(2); // right now this is being called in switchBatch() as well 
     } 
     ); 
    } 
} 

    // function argument -------v 
function switchBatch(idNum, func){ 
     maxVals = []; 
     $("#max_"+idNum).val(''); 
     $.ajax({ 
      type: "POST", 
      url: "/cfc/product.cfc?method=pialJson", 
      data: ({ 
       productID: $("#prod_"+idNum).val() 
      }), 
      dataType: "json", 
      success: function(result){ 
       options = ''; 
       var colMap = new Object(); 
       for(var i = 0; i < result.COLUMNS.length; i++) { 
        colMap[result.COLUMNS[i]] = i; 
       } 
       for (var i = 0; i < result.DATA.length; i++){ 
        options += '<option value="' + result.DATA[i][colMap["BATCHID"]] + '">' + result.DATA[i][colMap["BATCHNAME"]]+ '</option>'; 
        maxVals[i] = result.DATA[i][colMap["INSTOCK"]]; 
       } 
       $("select#batch_"+idNum).html(options); 

        // call the function that was passed in 
       func.call(null); 
       updateMax(idNum); // updateMax is being called in the function that is 
            // passed in. You probably don't need it in both places 
      } 
     }); 
    } 
+0

트릭을 한 Thanks Patrick. 이제 나는 왜 lol을 알아 내야 만 하는가? – Lance

0

updateMax()의 코드없이, 정확히 무슨 일이 일어나고 있는지 말하기 어렵다. 당신이 시도 할 수

한 가지 방법은 (즉 $('#selectID').change(updateMax)), 대신 updateMax()를 호출을 $('#selectID').change()을 선택 컨트롤의 onchange 청취자에게 updateMax()을 첨부합니다.

+0

updateMax에서 AJAX 요청에 대한 success: 콜백이 함수를 호출 선택 배치에 기초하여 값을 읽기 전용 텍스트 입력을 설정한다. 나는 일괄 선택이 (경고가 없다면) 변화하지 않는 것으로 생각하지 않는다. 올바르게 작동하지 않는 라인은 다음과 같다 : $ ('# batch_2'). val ('35 '); – Lance

1

"switchBatch()"함수가 아약스를 사용하기 때문에 사전 선택이 작동하지 않는다고 생각합니다. "switchBatch()"호출 후 JavaScript 코드는 ajax 호출이 완료되기 전에 실행되므로 select 요소는 비어 있습니다. 그러나 alert()로 인해 두 번째 if-block에서 작동합니다. 이는 ajax 호출에 select 요소를 채우고 채우는 데 충분한 시간을줍니다.

+0

아주 많이 들리 겠지만 "일시 중지"하고 아약스를 기다리는 방법을 모르겠습니다. switchBack을 실행하고 is가 완료 될 때까지 기다린 다음 updateMax()를 수행하는 방법이 있습니까? – Lance

+0

아약스 콜백 기능이 그 예입니다. 성공. 일부 디버그 인쇄물 (예 : console.log (...))을 사용하면 해결책을 찾아 낼 수 있습니다. –

+0

patrick dw의 대답을 참조하십시오. :) – Stian

관련 문제