2011-09-06 8 views
2

그래서 Jquery Mobile에서 날짜 선택기 입력을 사용하고 올바르게 렌더링하는 데 어려움이 있습니다. 나는 JQM 팀에서 제공하는 모든 필요한 파일 (http://dev.jtsage.com/jQM-DateBox/#/jQM-DateBox/demos/install.html)을 inclueded 한, 나는 정적 HTML에 직접 추가 할 때 렌더링하기 위해 그것을 얻을 수 있습니다Jquery Mobile - 날짜 선택기 문제

<label for="mydate">Some Date</label> 
<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "calbox"}'> 

는 그러나, 나는 동적 양식을 구축하고 있고 추가하고 비행 중에 HTML 의이 비트. 내 다른 모든 입력은 다음을 수행이 하나를 제외하고는 JQuery와 모바일 스타일을 얻고있다 :

$(form).html(formFields);    
var page = document.getElementById('page'); 
$(page).trigger('create'); 

formFields 내가 페이지로 추가하고있는 HTML 문자열입니다.

위의 정적 HTML 페이지에서 JQM을로드 할 때 해당 코드에 여러 가지 요소가 추가되는 것으로 보입니다. create 메소드를 호출 할 때 동일한 작업을 수행하는 것으로 보이지 않습니다. 이 주위에 어딘가에 있다면 누군가 생각을 가지고 있습니까? 미리 감사드립니다.


UPDATE

: 유용한 주석 아래 게시와 그래서, 그것은 나타납니다 문제는이 입력을 새로 고침하고 필요한 스타일을 적용하지 않습니다 '생성'메소드를 호출, 아니 공식 JQM 입력이기 때문에 그. 위에 게시 된 HTML은 문자열 작성기로 작성한 것입니다. 문제는 상쾌하게 누워 있습니다. 페이지가로드되면 날짜 입력 HTML에 여러 가지 추가 항목이 추가됩니다. 아래는 방화범이 끌리는 모습입니다 ... 어느 누구도 이것을 경험합니까?

<div class="ui-input-datebox ui-shadow-inset ui-corner-all ui-body-c"> 
    <input id="mydate" class="ui-input-text ui-body-null ui-body-x" type="text" data- options="{'mode': 'calbox'}" data-role="datebox" name="mydate"> 
    <a class="ui-input-clear ui-btn ui-btn-up-c ui-btn-icon-notext ui-btn-corner-all ui-shadow" title="date picker" href="#" data-theme="c" style="vertical-align: middle; float: right;"> 
    <span class="ui-btn-inner ui-btn-corner-all"> 
     <span class="ui-btn-text">date picker</span> 
     <span class="ui-icon ui-icon-grid ui-icon-shadow"></span> 
    </span> 
    </a> 

+0

DateBox 일부 설명을 참조하십시오. JQM은 이것을 공개하지 않았습니다. JT Sage의 제 3 자 플러그인입니다. 그 말로는 질문을 편집하고 동적으로 페이지를 만드는 데 사용하는 코드를 추가 할 수 있습니까? 또는 페이지 자체? –

+0

아, 이제 알겠습니다. 나는 그것을 수정할 것이다. – gabaum10

답변

1

좋아 사람들은 그것을 알아 냈어.

"create"메서드를 호출 한 후에도 스타일이 적용되지 않는 것으로 나타났습니다. 그래서 나는 웹 주위에 떠 다니는 해킹으로 눈을 돌렸다. 기본적으로 전체 양식을 삭제하고 다음과 같이 다시 작성했습니다.

$('#page').page("destroy").page(); 

페이지는 양식이 살고있는 콘텐츠 창의 이름이었습니다. 그처럼 간단한 리로디드.

+0

감사합니다. 이것은 나에게 많은 좌절감을 덜어 주었다. –

1

는 JT 단계 DateBox가 제대로 렌더링 동적 HTML를 삽입 할 때,

$('#mydate').textinput(); 
$('#mydate').datebox(); 
$('#mydate').datebox('hardreset'); 

첫 번째 줄은 JQM의 텍스트 입력으로 그것을 만들 다음 코드를 실행 얻으려면 ... 그 밖에 너희들의 일부를 도움이되기를 바랍니다 그 다음이 선이 고려 가치가 나머지