jQuery мобильное значение ввода текста перейти на страницу 2

0

im new в jquery mobile, поэтому я не знаю, как передать значение моих динамических текстовых полей ввода в моей странице1 на мою следующую страницу2, когда кнопка нажата, и я видел образец, но нет команды на кнопку submit

<div data-role="page">

    <div data-role="header">
        <h1>My Title</h1>
    </div><!-- /header -->

    <div data-role="content">
        <form method="post" action="processForm.php">                    
        <li data-role="fieldcontain"> 
            <label for="children" class="select">Number of Kids</label>
            <select name="children" id="children" data-mini="true">
               <option value="0">0</option>
               <option value="1">1</option>
               <option value="2">2</option>
               <option value="3">3</option>
            </select> 
        </li>
            <div id="kidsFields"></div>
    </form>        
    </div><!-- /content -->

</div>

var html = '';
$('#children').on('change', function() {
    children = $(this).val();
    html = '';
    for (var i = 0; i < children; i++) {
        html += '<label>Name</label><input type="text" id="textName' + i + '" name="child' + i + 'Name" /><label>Age</label><input type="text" name="child' + i + 'Age" id="textAge' + i + '" />';
    }

    $('#kidsFields').html(html);
    $('#kidsFields').append('<input type="submit" value="Submit" />');

    $('.ui-page').trigger('create');
});

http://jsfiddle.net/HwFFU/1/

Теги:
jquery-mobile

2 ответа

1
Лучший ответ

Добавьте идентификатор в кнопку отправки:

 $('#kidsFields').append('<input id="submitBtn" href="#page2" type="submit" value="Submit" />');

добавьте событие click:

$("#submitBtn").off('click').on('click', function () {

  // page1 is the id of the data-role page, having input type elements
  var formData =  $("#page1 :input").serializeArray();
  // sessionStorage.setItem("inputValues", JSON.stringify(formData));

});

Вы можете сохранить этот formData в sessionStorage, который представляет собой строковое представление объекта с ключом JSON с каждым типом ввода и связанными с ним значениями, которые будут использоваться на любых других страницах. Когда вы получите этот элемент, вам нужно будет проанализировать его JSON.parse(sessionStorage.getItem("inputValues"));

  • 0
    круто, позвольте мне попробовать это, и я вернусь к вам на мой ответ ты
  • 0
    его остановка указала, где загрузить данные? где я должен загрузить его, и вы можете рассказать мне о sessionStorage, потому что я ничего не знаю об этом
Показать ещё 7 комментариев
0
On page1 you can store with local storage

use button instead of type="submit"
>> frm is form id
<input type="button" value="Submit" id="btn_submit" />


$('#btn_submit').on('click', function(event) {
  event.preventDefault();
if(event.handled !== true)
    {  
    localStorage.setItem("formdata",  $('#frm').serialize());
    event.handled = true;
}
return false;
});


On page2 load event get local storage value.

$('#page2').on('pageshow',function(event){
if(event.handled !== true){ 
   localStorage.getItem("formdata");
   event.handled = true;
}
return false;
});
  • 0
    Смотрите мой отредактированный код
  • 0
    Могу ли я спросить вас еще одну вещь, если вы сериализуете, он превращается в текст правильно? Как я могу вернуть его обратно, чтобы понравиться ввод текста или что-то в этом роде.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню