jquery-mobile: Невозможно изменить входное значение в диалоговом окне

Question

У меня возникла проблема с dinamicaly, устанавливая значение текстовых полей в диалоговом окне, открытом элементом listview с JQueryMobile.

Я могу изменить значение, подтвержденное предупреждением до и после, но отображаемое значение не изменяется.

Концепция представляет собой список, отображающий элементы списка покупок. Если пользователь нажимает на один из элементов, диалоговое окно должно отображаться с формой для редактирования информации о продукте.

Я начал с установки href на страницу диалога и привязки к событию onclick. Проблема заключалась в том, что событие запускалось до загрузки страницы, поэтому нет доступных элементов.

Затем я открыл диалоговое окно programaticaly в событии onclick.

Я могу изменить значение, но изменение не отображается.

Редкие фрагменты ниже.

Заранее благодарим за любую помощь.

С наилучшими пожеланиями

Joao

<ul data-role="listview" data-inset="true" data-split-theme="b" data-split-icon="star" id="shopping_list_listview" style="margin-bottom:0px"> 
<li> 
    <a data-rel="dialog" data-transition="pop" href="#" onClick="loadData($(this))"> 
     <span class="product_name truncate" SAMPLE product</span> 
    </a> 
</li> 

function loadData(obj) 
     { 

      $.mobile.changePage('product_dialog.html','pop',false,true) 

      var name = obj.find("span.product_name").text(); 

      alert ($("#popup-product-name").val()); 

      $("#popup-product-name").val(name); 

      alert ($("#popup-product-name").val()); 

     } 

Answer 1

ли это так, вот пример.

Working Demo

Markup

<!-- Page --> 
<div data-role="page" id="p1"> 
<p>Click on the text box to open dialog</p> 
<input type="text" id="two" /> <a data-role="button" href="#" id="btn">Move data to dialog</a> 
</div> 
<!-- /Page --> 

<!-- Dialog --> 
<div data-role="page" data-rel="dialog" id="dialog" data-theme="c" data-close-btn="right"> 
<div data-role="header" data-position="fixed" data-theme="b"> 
    <h1>New values added!</h1> 
</div> 

<ul data-role="listview" id="list"> 
    <li><a href="#">old value</a> 
    </li> 
    <li><a href="#">some value</a> 
    </li> 
    <li><a href="#">text</a> 
    </li> 
</ul> 
</div> 
<!-- /Dialog --> 

Код

$(document).on('click', 'a#btn', function() { 
var value = $("#two").val(); 
$.mobile.changePage("#dialog", { 
    role: "dialog" 
}); 
$('#list').find('a').text(value); 
});