동적 양식이 제출되지 않음 (jQuery)

PHP, MySQL, & jQuery를 사용하여 간단한 작업 관리자 응용 프로그램을 만들고 있습니다. 사용자가 "새 작업"버튼을 클릭하고 텍스트 필드에 타이핑하고 엔터를 치면 작업을 추가 할 수있는 기능이 추가됩니다. 이것은 JQuery와 나는이 : 나는 index.php 파일에 하드 코드 된 형태가있는 경우 예상대로이 기능이 작동동적 양식이 제출되지 않음 (jQuery)

function add_task() { 
// Add the "add new task" button 
$("<span class='add-new'>Add new item</span>").appendTo(".sub-phase"); 

// String for the input form 
var task_form = '<form class="add-new-task" autocomplete="off"><input type="text" name="new-task" placeholder="Add a new item..." /></form>'; 

// Display form on button click 
$('.add-new').click(function() { 
    $(task_form).appendTo($(this).parent()); 
}); 

// Post results 
$('.add-new-task').submit(function(){ 
var new_task = $('.add-new-task input[name=new-task]').val(); 

if(new_task != ''){ 
$.post('includes/add-tasks.php', { task: new_task }, function(data) { 
    $('.add-new-task input[name=new-task]').val(''); 
    $(data).appendTo('.task-list').hide().fadeIn(); 
     }); 
} 
return false; 
}); 
}

. 그러나 양식을 여기 jQuery에서 만든 경우 여기에 아무 것도 제출하지 않습니다. 나는 주변을 수색했으나 효과가있는 해결책을 찾을 수 없었다.

많은 조언을드립니다. 고맙습니다.

출처

2014-04-28 zep_fan

$ ('')을 사용해 보셨습니까? .addClass ('add-new'); –

문제는 당신이 이벤트를 위임하지 않는다는 것입니다. 페이지로드시 제출 핸들러를 설정했지만 동적으로 작성된 요소는 설정하지 않았습니다.

변경 :

$('.add-new-task').submit(function(){

사람 :

$(document).on('submit', '.add-new-task', function(){

지금 이벤트 처리기가 문서에 바인딩과 관계없이 동적인지 여부의 .add-new-task있는 페이지에있는 모든 요소에 대해 트리거합니다 만들어진.

또한 가능한 경우 document에 바인딩하지 말고 대신 closest static parent element에 바인딩해야합니다.

출처

2014-04-28 01:03:39 Ohgodwhy

나는 (비슷한 질문에 비슷한 응답을 찾은) 이것을 시도했지만 아직 갈 길이 없다. 응답 주셔서 감사합니다. 다른 아이디어? –

솔루션을 제공해 주셔서 감사합니다. 문제는 그것을 테스트하기 위해 인덱스 파일에 하드 코드 된 형식을 가졌다는 것입니다. 이것이 작동하지 않는 이유입니다. 동적으로 생성 할뿐만 아니라 그것을 하드 코딩 했더니 깨질 것입니다. 그것에 많은 시간을 낭비했다! 다시 한번 감사드립니다. –

여기에 바이올린을 확인하시기 바랍니다 - 여기 http://jsfiddle.net/kunaldethe/TQa97/

jQuery를 1.7.2를 사용하고 Ohgodwhy 응답으로되고,

$(document).on('submit', '.add-new-task', function(){

는 대신

$('.add-new-task').submit(function(){

사용된다 자바 스크립트 콘솔 (F12), 당신은 요청이 보냈습니다 볼 수 있습니다. (분명히 다음 페이지가 없으므로 요청이 완료되지 않습니다.)

jQuery를 1.7.2 미만의 버전으로 사용하면 코드가 손상됩니다.
사용하시는 환경을 알려주십시오.

출처

2014-04-28 05:46:19

동적 양식이 제출되지 않음 (jQuery)

답변

관련 문제