Мобильная тема jquery на кнопке в вызове успеха websql

Я новичок в jQuery Mobile и HTML5. Я создал страницу с простой операцией CRUD в хранилище SQLite WebSQL. Это работает хорошо.

На странице у меня есть кнопки для вставки и отображения информации (с помощью jQuery mobile) .. на этой кнопке правильно отображается кнопка мобильной темы jQuery и текстовое поле. Но при успешном обратном вызове Javascript, когда я визуализирую текстовое поле и кнопку, он отображается как обычное текстовое поле и кнопка HTML.

Ниже приведен мой фрагмент кода.

HTML:

<div id='riderResults'></div>
<a href="javascript:void(0);" data-role="button" data-inline="true" data-mini="true" data-theme="b" onClick="displayRider()" name="display" id="display">Add Report</a>

Javascript:

function displayRider(){
  db.transaction(function(tx) {
    tx.executeSql("select * from riders", [], function(tx, result) {
      riderdataset = result.rows;
      for (var i = 0, item = null; i < riderdataset.length; i++) {
        item = riderdataset.item(i);
        var output='';
        output+='<div>'
             +'<input type="text" value="'+item['riderName']+'" name="name'+i+' id="name'+i+'"/>&nbsp;'
             +'<a href="javascript:void(0);" data-role="button" data-inline="true" data-mini="true" data-theme="b" onClick="updateRider('+i+')" name="update_rider" id="update_rider">Update Rider</a>'
             +'</div>';
      }
      document.getElementById('riderResults').innerHTML=output;
    });
  });
}

Пожалуйста, может ли кто-нибудь дать мне правильное направление, в котором я был неправ .. Спасибо.


person Tina Rathod    schedule 06.09.2012    source источник
comment
У меня есть ответ ... stackoverflow.com/questions/4952417/. Необходимо вызвать элемент, созданный следующим образом: $ ('# myelement'). Html ('обновленное содержимое'). Trigger ('create');   -  person Tina Rathod    schedule 06.09.2012


Ответы (1)


Я предлагаю вам перейти в свой браузер и проверить элемент кнопки, который был создан jquery-mobile, затем вы скопируете тег этого элемента и поместите его в свой вывод var. Поскольку jquery-mobile добавляет классы к вашим элементам автоматически в зависимости от роли данных, которую вы ему сказали.

Тег должен выглядеть так:

<a data-role="button" data-transition="none" data-theme="a" href="#id" data-corners="true" data-shadow="true" data-iconshadow="true" data-iconsize="18" data-wrapperels="span" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-icon-left ui-btn-up-a">
  <span class="ui-btn-inner ui-btn-corner-all">
    <span class="ui-btn-text">
      Button
    </span>
    <span class="ui-icon ui-icon-tab ui-icon-shadow ui-iconsize-18">
      &nbsp;
    </span>
  </span>
</a>
person Kevin Antonio    schedule 05.10.2012