jquery에서 combox 상자를 동적으로 생성합니다.

Question

내가 원하는 작업 : 사용자가 데이터베이스에 신용 카드 번호가 하나만있는 경우 성공적으로 수행 한 페이지에 텍스트 필드를 표시하지만 사용자의 여러 신용 카드 번호가 내 데이터베이스에 저장되어있는 경우 대신 텍스트 필드를 표시하는 방법 모든 신용 카드 번호를 콤보 상자에 표시하고 싶습니다.

{ 
    "fname": "abc", 
    "lname": "xyz", 
    "creditCardInfo": [ 
     { 
      "creditCardNumber": "378282246310005", 
      "creditCardType": "AX", 
      "securityCode": "1234", 
      "expirationDate": "2020-02-01" 
     }, 
     { 
      "creditCardNumber": "6011000990139424", 
      "creditCardType": "DS", 
      "securityCode": "321", 
      "expirationDate": "2030-12-01" 
     } 
    ], 
    "creditCardNumber": "6011000990139424", 
    "creditCardType": "DS", 
    "creditCardCVC": "321", 
    "creditCardExpirationMonth": "12", 
    "creditCardExpirationYear": "2030" 
} 

:

는 다음 내가 무엇입니까 아약스 반응이다 (참고 : 모든 테스트 신용 카드 번호와 CVC 코드가 포함 된 위의 응답)

내가에 JQuery와 each 루프하지만 수를 사용하여 시도 해.

$.ajax({ 
type: "POST", 
url: "<?php echo $_SERVER['HOST']; ?>"+action, 
dataType: 'json', 
data: formdata, 
success: function(data) 
{ 
var userinfo = eval(data); 
alert(userinfo); 
if(userinfo['msg'] == 'fail'){ 
$(".usrmsg").show(); 
$(".validate").hide(); 
} 
else{ 

if(!$("#fname1").val()) $("#fname1").val(userinfo['fname']); 
if(!$("#lname1").val()) $("#lname1").val(userinfo['lname']); 
if(!$("#billingCity").val()) $("#billingCity").val(userinfo['billingCity']); 

if(userinfo['creditCardInfo']){ 
$('#creditCardComboBox').show(); 
$('#creditCardTextField').show(); 

// $(userinfo['creditCardInfo']).each(function(index) { 
// alert(index + ': ' + $(this).text()); 
// $("#creditCardNumber option[value="+index['creditCardNumber']+"]").attr("selected", "selected");         
// });         

$("#creditCardType option[value="+userinfo['creditCardInfo']['creditCardType']+"]").attr("selected", "selected"); 
$("#creditCardExpirationMonth option[value="+userinfo['creditCardInfo']['creditCardExpirationMonth']+"]").attr("selected", "selected"); 
$("#creditCardExpirationYear option[value="+userinfo['creditCardInfo']['creditCardExpirationYear']+"]").attr("selected", "selected"); 
} 

if(!$("#billingFirstName").val()) $("#billingFirstName").val(userinfo['fname']); 
if(!$("#billingLastName").val()) $("#billingLastName").val(userinfo['lname']); 
if(!$("#creditCardCVC").val()) $("#creditCardCVC").val(userinfo['creditCardCVC']); 
} 
} 
}); 

도움이 필요하십니까 :

다음은 내 코드입니다. 사전에

감사합니다.

Answer 1

이것이 귀하의 코드 일 것입니다. jquery hide/show/use .innerHtml 태그를 사용하여 콘텐츠를 표시하십시오.

$.ajax({ 
    type: "POST", 
    url: "<?php echo $_SERVER['HOST']; ?>"+action, 
    dataType: 'json', 
    data: formdata, 
    success: function(data) 
    { 
    //Check the length of the json array 
    var creditcardinfo = data.creditCardInfo 

    do 
    { 
     if(creditcardinfo.length==1){ 
     $('#creditCardTextField').show(); 
     $('#creditCardComboBox').hide(); 
     //Set value of creditcardText 
     $('#creditCardTextField').val(creditcardinfo[i].creditCardNumber); 

     }else if(creditcardinfo.length>1){ 
     $('#creditCardComboBox').show(); 
     $('#creditCardTextField').hide(); 
     //ASSUMING YOU Are using <select> tag 
     var newOption = $('<option>'); 
     newOption.attr('value',creditcardinfo[i].creditCardNumber).text(creditcardinfo[i].creditCardNumber); 
     $('#creditCardComboBox').append(newOption); 
     } 
    }while (i<creditcardinfo.length); 

    } 
});