2013-12-19 3 views
0

datepicker/autocomplete와 replacewith() 사이에 멍청한 문제가 있습니다. 사용자가 여러 행을 추가하고 제거 할 수있는 양식이 있습니다. 그런 것을 만들기 위해 복제를 설정했습니다. 일단 복제가 이루어지면 replaceWith()를 사용하여 attr 함수가 SubmitName으로 이름을 대체하여 IE와 어리석은 것을 만드는 것처럼 입력 이름을 변경합니다.replaceWith() 후 Datepicker 및 자동 완성이 작동하지 않습니다.

replacewith는 정상적으로 작동하지만 datepicker 함수 또는 자동 완성 함수가 더 이상 작동하지 않습니다. 참고로이 블록은 HTML 양식 바로 다음에 있습니다. 나는 아래 표와 같은 여러 가지 방법에 그것을 시도했지만 아무도 작동하지 않습니다 :

<script type="text/javascript"> 
var uniqueLeg = 1; 
$('.addLeg').click(function() { 
    var copy = $('#Leg').clone(true,true); 
    var formId = 'Leg' + window.uniqueLeg; 
    copy.attr('id', formId); 
    copy.removeAttr('style'); 

    copy.find(':input#tripdate').each(function() { 
     $(this).replaceWith("<input type='" + $(this).attr("type") + "' id='tripdate" + window.uniqueLeg + "' name='" + $(this).attr("name") + window.uniqueLeg + "' class='datepicker' />"); 
     $('.datepicker').datepicker({ dateFormat: "dd/mm/yy" }); 
    }); 
$('#trip').append(copy); 
window.uniqueLeg++; 
}); 

또는

copy.find(':input#tripdate').each(function() { 
     $(this).replaceWith("<input type='" + $(this).attr("type") + "' id='tripdate" + window.uniqueLeg + "' name='" + $(this).attr("name") + window.uniqueLeg + "' class='datepicker' />"); 
     $(this).datepicker({ dateFormat: "dd/mm/yy" }); 
    }); 

또는

copy.find(':input#tripdate').each(function() { 
     $(this).replaceWith("<input type='" + $(this).attr("type") + "' id='tripdate" + window.uniqueLeg + "' name='" + $(this).attr("name") + window.uniqueLeg + "' class='datepicker' />"); 
     $('tripdate'+window.uniqueLeg).datepicker({ dateFormat: "dd/mm/yy" }); 
    }); 

어느 것도 작동하지 않습니다. JQuery와 - UI는 심지어 페이지 게다가

<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <TITLE> Dev page </TITLE> 
    <link rel="stylesheet" href="src/jquery-ui.css" /> 
    <script src="src/jquery-1.9.1.js"></script> 
    <script src="src/jquery-ui.js"></script> 
    <SCRIPT language="javascript"> 
$(function() { 
      $(".datepicker").datepicker({ dateFormat: "dd/mm/yy" }); 
      $(".aptsearch").autocomplete({source:'suggest_apt.php', minLength:3}); 
      $(".actsearch").autocomplete({ 
       source:'suggest_act.php', 
       minLength:3, 
       select: function (event, ui) { 
        var id = $(this).attr("id"); 
        loadAC(ui.item.value, id); 
       } 
      }); 
     });... 

의 상단에 addClass를 선언 또는 RemoveClass 기능이 작동하는 것 같다하지 않습니다. 제발, 나는 무엇이 실종되었는지 볼 수 없다. 제안을 환영합니다.

<INPUT id=tripdate0 class="datepicker hasDatepicker" name=tripdate0 jQuery191007588717778684739="15"> 

뉴스 행 후 뉴스 행하기 전에

HTML 구조는

<INPUT id=tripdate1 class=datepicker name=tripdate1> 
+0

콘솔에 오류가 있습니까? 한가지 더,'.datepicker()'를 여러 번 호출하는 이유는 새로 추가 된 모든 행에 필요하기 때문에'$ (document) .ready()'안에서 한번 호출하면됩니다. 가능하다면 새로운 행이 추가 된 후에 html 구조체를 게시 할 수 있습니까? – dreamweiver

+0

오류가 발생하지 않지만 추가 된 행에 자동 완성과 날짜 표시기가 작동하지 않습니다. $ (document) .ready (function) {복제 후 .datepicker()를 다시 호출해야한다는 사실을 대체하지 않습니다. 방금 시도했는데 아무런 문제없이 작동하지 않았습니다. – poypoy

답변

0

좋아 나는 문제 무엇인지 알아보십시오. AddClass 및 .datepicker는 입력 ID가 replacewith에 의해 변경된 함수에서 작동 할 수 없습니다. 이 문제를 해결하는 유일한 방법은 나중에 수정 된 새 입력을 선택하고 클래스를 추가하는 것입니다. datepicker + initialize .datepicker()

조금 더러워 보이지만 적어도 작동합니다. 이 문제를 개선하기위한 제안 사항이 있으시면 언제든지 공유하십시오.

copy.find(':input#tripdate'+window.uniqueLeg).each(function() { 
     $(this).addClass('datepicker'); 
     $(this).datepicker({ dateFormat: "dd/mm/yy" }); 
    });