입력 필드를 동적으로 추가하지만 필드는 외부 PHP 함수에 의해 생성됩니다

Question

예 ..이 질문은 이어지는 반복과 같지만 실제로는 비슷한 것을 찾을 수 없습니다 .. 여기에 작동하지만 여기서는 동적 인 것은 없습니다 ... 그래, 간단합니다. .

var counter = 0; 
function addInput(divName){ 
     var newdiv = document.createElement('div'); 
     newdiv.innerHTML = "Member " + (counter + 1) + " <br><input type='text' name='myInputs[]'>"; 
     document.getElementById(divName).appendChild(newdiv); 
     counter++; 
} 

하지만 여기 그것을 조금 꼬임을주고있다 ..

var counter = 0; 
function addInput(divName){ 
     var newdiv = document.createElement('div'); 
     newdiv.innerHTML = "Member " + (counter + 1) + addmore(); 
     document.getElementById(divName).appendChild(newdiv); 
     counter++; 
} 

때문에, 새로운 기능 "addmore()"는 여기 외부 PHP 코드에 의해 생성 된 필드를 반환 A의 도움으로 부름 받았다. JAX ..

함수 addmore(); 이 같은 것입니다 ..

addmore(){ 
     $jd.ajax({ 
      url: "<?php echo JURI::root(); ?>", 
      type: "POST", 
      data: {'option':'com_joomd', 'view':'itempanel', 'task':'loadfields', 'typeid':<?php echo $this->cparams->typeid; ?>, 'catid[]':checked, 'id':<?php echo (int)$this->item->id; ?>, "<?php echo jutility::getToken(); ?>":1, 'abase':1}, 
      beforeSend: function() { 
      $jd(".poploadingbox").show(); 
      }, 
      complete: function() { 
      $jd(".poploadingbox").hide(); 
      }, 
      success: function(res) { 

       $jd('#fieldtable_id').html(res); 
      }, 
      error: function() { 
       alert('error');     
      } 
    }); 
} 

분명히 $ jd ('# fieldtable_id') .html (res); 이다

Answer 1

귀하의 기능 addmore()는 아무 것도 반환하지 않습니다 ..

이 나를 인도 해주십시오 .. 실제 일을하고,하지만 난 동적으로 여기에 새로운 분야를 소개하는 데 사용할 수 없습니다입니다

때문에

1. 은 함수에는 return "value"는
2. 당신은 당신이 이렇게해야

$의 jd.ajax()와 비동기 호출을하고이 없다 :

var counter = 0; 
function addInput(divName){ 
     addmore(divName); 
} 

과 :

function addmore(divName){ 
     $jd.ajax({ 
      url: "<?php echo JURI::root(); ?>", 
      type: "POST", 
      data: {'option':'com_joomd', 'view':'itempanel', 'task':'loadfields', 'typeid':<?php echo $this->cparams->typeid; ?>, 'catid[]':checked, 'id':<?php echo (int)$this->item-  id; ?>, "<?php echo jutility::getToken(); ?>":1, 'abase':1}, 
      beforeSend: function() { 
      $jd(".poploadingbox").show(); 
      }, 
      complete: function() { 
      $jd(".poploadingbox").hide(); 
      }, 
      success: function(res) { 
      var newdiv = document.createElement('div'); 
      newdiv.innerHTML = "Member " + (counter + 1) + res; 
      document.getElementById(divName).appendChild(newdiv); 
      counter++; 

      }, 
      error: function() { 
       alert('error');     
      } 
    }); 
} 

Answer 2

(jQuery를 사용하여) 동적으로 입력 필드를 추가/제거하려면이 시도 :

<script>$(function() { 
     var scntDiv = $('#p_scents'); 
     var i = $('#p_scents p').size() + 1; 

     $('#addScnt').live('click', function() { 
       $('<p><label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt_' + i +'" value="" placeholder="Input Value" /></label> <a href="#" id="remScnt">Remove</a></p>').appendTo(scntDiv); 
       i++; 
       return false; 
     }); 

     $('#remScnt').live('click', function() { 
       if(i > 2) { 
         $(this).parents('p').remove(); 
         i--; 
       } 
       return false; 
     }); 
});</script> 

<style> 
* { font-family:Arial; } 
h2 { padding:0 0 5px 5px; } 
h2 a { color: #224f99; } 
a { color:#999; text-decoration: none; } 
a:hover { color:#802727; } 
p { padding:0 0 5px 0; } 
input { padding:5px; border:1px solid #999; border-radius:4px; -moz-border-radius:4px; -web-kit-border-radius:4px; -khtml-border-radius:4px; } 
</style> 


<div id="ContentWrapper"> 
<h2><a href="#" id="addScnt">Add Another Input Box</a></h2> 
<form id="cat" method="POST" action=""> 
<div id="p_scents"> 
    <p> 
     <label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt" value="" placeholder="Input Value" /></label> 
    </p> 
</div> 

포스트는 새 필드의 이름은 다음과 같습니다 p_scnt_1, p_scnt_2 등

Answer 3

아약스 호출에서 값을 반환하려는 경우. async를 false로 설정하고 responseText를 사용하여 ajax 호출에서 값을 반환하십시오. 그런 다음 addmore 함수에서 해당 변수를 반환합니다.

Returning values from jquery ajax call.