JQuery Mobile/Rho listview自动更改为对话框
我有一个带有列表视图的移动页面。如果列表的内容比移动视口长,则listview会自动更改为对话框。如果列表适合视口,则显示为listview。(不确定JQuery行为或Rho中的某些内容)无论如何,在对话框模式下,更改事件不起作用。以前有人经历过吗JQuery Mobile/Rho listview自动更改为对话框,jquery,listview,mobile,dialog,rhomobile,Jquery,Listview,Mobile,Dialog,Rhomobile,我有一个带有列表视图的移动页面。如果列表的内容比移动视口长,则listview会自动更改为对话框。如果列表适合视口,则显示为listview。(不确定JQuery行为或Rho中的某些内容)无论如何,在对话框模式下,更改事件不起作用。以前有人经历过吗 $(document).on('pageshow', '#coltreg-show-page', function(event) { var $activePage = $.mobile.activePage // bind for term se
$(document).on('pageshow', '#coltreg-show-page', function(event) {
var $activePage = $.mobile.activePage
// bind for term select change
var $coltSessions = $activePage.find('select#coltsessions')
$coltSessions.bind('change', function() {
var evId = $(this).val()
loadDetails( { evId: evId } )
})
//$leftArrow = $activePage.find('a#left-arrow')
//$leftArrow.bind('click', function() {
// var termId = $selectTerm.val()
// loadGrades( { termId: termId, previousTerm: true } )
//})
//$rightArrow = $activePage.find('a#right-arrow')
//$rightArrow.bind('click', function() {
// var termId = $selectTerm.val()
// loadGrades( { termId: termId, nextTerm: true } )
//})
// load if grades aren't already there
var $regsesList = $activePage.find('ul#regses-list')
if ( $regsesList.children().size() > 1 ) return
var evId = $coltSessions.val()
loadDetails( { evId: evId } )
})
function loadDetails(argMap) {
argMap = argMap || {}
argMap.evId = argMap.evId || null
//argMap.previousTerm = argMap.previousTerm || false
//argMap.nextTerm = argMap.nextTerm || false
var $activePage = $.mobile.activePage
$.mobile.showPageLoadingMsg()
var requestUrl = "/app/Coltreg/async_coltreg"
var requestData = {}
if ( argMap.evId ) requestData['evId'] = argMap.evId
//requestData['previousTerm'] = argMap.previousTerm
//requestData['nextTerm'] = argMap.nextTerm
loadDetailsRequest(requestUrl, requestData)
}
function loadDetailsRequest(requestUrl, requestData) {
var $activePage = $.mobile.activePage
var $regsesList = $activePage.find('ul#regses-list')
$.get(requestUrl, requestData, function(result){
$.mobile.hidePageLoadingMsg()
$regsesList.find('li#eid').remove()
$regsesList.append(result)
$regsesList.listview("refresh").trigger("updatelayout")
})
}
雇员再培训局网页:
<div data-role="content">
<ul data-role="listview" data-theme="c" id="regses-list">
<li id="regses-selector" class="sessionNav">
<div class="sn-btn">
<ul>
<li></li>
<li class="centerLink">
<select name="coltsessions" id="coltsessions" data-shadow="false" data-corners="false" data-iconpos="none" data-inline="true" data-native-menu="false">
<%
ev = get_mnth_events
ev.each do |e|
%>
<option value="<%= e['evntid'] %>">
<%= e['evntname'] %>
</option>
<%
end
%>
</select>
</li>
<li></li>
</ul>
</div>
</li>
</ul>
</div><!-- /content -->
-
-
这是jQuery移动行为。你可以在这本书中看到它的作用。
如果它在小提琴中显示为常规列表视图,请向下滑动“结果”框使其变小,并查看对话框的显示
<select data-native-menu="false">
<option>text</option>
<option>text</option>
<option>text</option>
</select>
正文
文本
文本
可能的解决方案: