2016-03-31 2 views
-3

Я хочу представить и сохранить данные формы с помощью JavaScriptХотите отправить и сохранить данные формы с помощью Javascript

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>Save data using JS</title> 
 
</head> 
 
<body> 
 
    <h1>Sign up</h1> 
 
<form name="myForm"> 
 
    Name:<br> 
 
    <input type="text" name="fname" required maxlength="40"><br><br> 
 
E-mail: <input type="email" name="email" required><br><br> 
 
    Gender:<br> 
 
    <input type="radio" name="gender" value="male" checked> Male<br> 
 
    <input type="radio" name="gender" value="female"> Female<br><br> 
 
    <input type="submit" value="Submit"> 
 
</form> 
 
    
 
</body> 
 
</html>

Так что, когда я нажимаю кнопку отправки, данные формы должны быть сохранены где-то , для каждого пользователя, который заполняет и передает его. Это должно быть сделано с использованием Javascript, jquery или ajax.

+0

Так где же вы застряли? что ты уже испробовал? – Apb

+0

Как вы можете видеть выше, я только что создал форму, теперь я хочу, когда пользователь отправляет форму, данные формы должны быть где-то сохранены. – Manish62

+0

@Manish, Тогда в чем вопрос? Что не работает? – Rayon

ответ

0
$('input[type=submit]').click(function(){ 
    var date = new Date(); 
    date.setTime(date.getTime()+(1*24*60*60*1000)); 
    createCookie('fname', $('input[name=fname]').val(), date); 
    createCookie('email', $('input[name=fname]').val(), date); 
    createCookie('gender', $('input:checked').val(), date); 
}); 

Просто понял, что я забыл функцию createCookie ...

function createCookie(name, value, date){ 
    var c = name + '=' + value + "; expires=" + date; 
    document.cookie = c; 
} 
+0

что это делает ?? – Manish62

+0

Создает три куки, когда пользователь нажимает кнопку отправки. Сначала значение поля fname. Во-вторых, это значение поля электронной почты. В-третьих, это значение проверенного гендерного поля (мужчины или женщины). Срок действия файла cookie истечет через 1 день. –

+0

как продлить срок действия? – Manish62

1

если вы хотите сохранить его локально использовать куки
код ниже сохранит свой ответ на человека компьютер с помощью куки:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>Save data using JS</title> 
</head> 
<script> 
function saveData() { 
    document.cookie="fname="+document.getElementById('fname').value+"; expires=Thu, 18 Dec 2019 12:00:00 UTC"; 
    document.cookie="email="+document.getElementById('email').value+"; expires=Thu, 18 Dec 2019 12:00:00 UTC"; 

    var radios = document.getElementsByName('gender'); 

    for (var i = 0, length = radios.length; i < length; i++) { 
    if (radios[i].checked) { 
     document.cookie="gender="+radios[i].value+"; expires=Thu, 18 Dec 2019 12:00:00 UTC"; 
     break; 
    } 
} 
alert('Data Saved!'); 
} 
alert('SAVED DATA: '+document.cookie); 
</script> 
<body> 
    <h1>Sign up</h1> 
<form name="myForm" id="myForm" action="javascript:saveData();"> 
    Name:<br> 
    <input type="text" name="fname" id="fname" required maxlength="40"><br><br> 
E-mail: <input type="email" name="email" id="email" required><br><br> 
    Gender:<br> 
    <input type="radio" name="gender" value="male" checked> Male<br> 
    <input type="radio" name="gender" value="female"> Female<br><br> 
    <input type="submit" value="Submit"> 
</form> 

</body> 
</html> 

Если вы хотите сохранить его в базе данных. отправьте форму на страницу, на которой может быть запущен какой-то код, например php, asp, coldfision, jsp или какой ваш любимый язык.

ПРИМЕЧАНИЕ: более современный способ хранения данных - использовать Window.localStorage. , но он несовместим со старыми браузерами .. но он имеет определенные улучшения в отношении файлов cookie, вам не нужно перезагружать страницу, чтобы увидеть изменения. данные никогда не истекают. вы можете хранить большие объемы данных, а затем вы можете использовать файлы cookie.

+0

данные сохраняются в моем браузере? – Manish62

+0

Да, ваш браузер хранит некоторое пространство для хранения, где веб-сайты могут сохранять информацию локально. Поэтому при следующем возвращении на этот веб-сайт он может получить локальную информацию.вы можете прочитать данные обратно ... using document.cookie –

+0

Как просмотреть данные, которые будут сохранены. – Manish62

Смежные вопросы