- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要使用 Phonegap 创建一个 iOS 应用程序来保存 HTML 表单。但是,我对 iOS 或 Phonegap 不是很熟悉。谁能给我指出正确的方向?
这是我的 HTML:
<!DOCTYPE html>
<html class="ipad" lang="en">
<head>
<meta charset="utf-8">
<title>Hall Render - Resources Sign Up</title>
<!-- Mobile Viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- Main Stylesheet -->
<link href="assets/css/screen.css" media="all" rel="stylesheet" type="text/css">
<!-- jQuery -->
<script src="assets/js/jquery-1.11.3-min.js"></script>
<!-- jQuery Plugins -->
<script src="assets/js/jquery-validation-1.14.0-min.js"></script>
<!-- Phonegap JS -->
<script src="assets/js/phonegap.js"></script>
<script src="assets/js/cordova.js"></script>
<!-- Functions -->
<script src="assets/js/functions.js"></script>
</head>
<body onload="onDeviceReady()">
<!-- Begin Header -->
<header>
<div class="wrap">
<img src="assets/img/hall_render-logo.png" height="50" width="132">
<h1><strong>Health Law</strong> is our business.</h1>
</div>
</header>
<!-- End Header -->
<!-- Begin Secondary Header -->
<section id="secondary-header">
<div class="wrap">
<div class="inner-wrap">
<h2><strong>Hall Render Alerts Provide</strong> up-to-date information</h2>
<p>on topics ranging from general health law to health care reform, HIPAA,<br>
employment law, health information technology and health care tax news.</p>
</div>
</div>
</section>
<!-- End Secondary Header -->
<!-- Begin Main -->
<section id="main">
<div class="wrap">
<div class="inner-wrap">
<div class="text">
<h3>Sign Up to Receive Hall Render Resources</h3>
<p>
We appreciate your interest in our firm. As the nation’s largest law firm focused exclusively on matters specific to health care, our knowledge and experience allow us the opportunity to share the latest and most relevant health care news and practical takeaways directly with you. In an evolving industry such as health care, it’s crucial to stay up to date and informed. These email alerts are designed to help you do just that.
</p>
</div>
<form id="signup-form" method="get" action="">
<fieldset>
<div class="label-input-wrap">
<label for="cfirst-name">First Name: (required)</label>
<input type="text" id="cfirst-name" name="firstname" tabindex="1">
</div>
<div class="label-input-wrap">
<label for="clast-name">Last Name: (required)</label>
<input type="text" id="clast-name" name="lastname" tabindex="2">
</div>
<div class="label-input-wrap">
<label for="corganization">Organization:</label>
<input type="text" id="corganization" name="organization" tabindex="3">
</div>
<div class="label-input-wrap">
<label for="ctitle">Title:</label>
<input type="text" id="ctitle" name="title" tabindex="4">
</div>
<div class="label-input-wrap">
<label for="cemail">Email: (required)</label>
<input type="email" id="cemail" name="email" tabindex="5">
</div>
<input id="form-submit" type="submit" value="Sign Up" tabindex="6">
</fieldset>
</form>
</div>
</div>
</section>
<!-- End Main -->
<!-- Begin Secondary -->
<section id="secondary">
<div class="wrap">
<div class="inner-wrap">
<div class="text">
<h3>Thank You</h3>
<p>
Thank you for signing up to receive Hall Render resources.<br>
You will be receiving an email from us soon with the latest health law news.
</p>
</div>
</div>
</div>
</section>
<!-- End Secondary -->
<!-- Begin Footer -->
<footer>
<div id="red-tab"></div>
<div class="clear"></div>
<div id="red-banner"></div>
<div id="footer-hold">
<div class="wrap">
<p>
DENVER <span>|</span> DETROIT <span>|</span> INDIANAPOLIS <span>|</span> LOUISVILLE <span>|</span> MILWAUKEE <span>|</span> PHILADELPHIA <span>|</span> WASHINGTON, D.C.
</p>
</div>
</div>
</footer>
<!-- End Footer -->
</body>
</html>
这是我的 functions.js
文件:
(function($){
/* On Page Ready */
$(document).ready(function(){});
/* On Page Load */
$(window).load(function(){
// Size differences
var mainH = $('#main').outerHeight();
var sheaH = $('#secondary-header').outerHeight();
$('#secondary').height(mainH + sheaH - 40).hide();
// Form Validation and Sumbit
var form = $('#signup-form');
form.validate({
debug: true,
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
email: {
required: true,
email: true
}
},
messages: {
firstname: {
required: "Please enter your first name."
},
lastname: {
required: "Please enter your last name."
},
email: {
required: "Please enter your email."
}
},
submitHandler: function(form){
form.submit();
$('#main, #secondary-header').fadeOut(400);
$('#secondary').fadeIn(500);
setTimeout(function(){
window.location.reload(1);
}, 8000);
}
});
});
/* On Window Resize */
$(window).resize(function(){});
})(window.jQuery);
我正在使用 jQuery 表单验证,验证后它会隐藏表单并显示“谢谢”,然后重新加载页面。现在,如何将表单数据保存到 iOS 文件系统?该应用程序需要离线使用并保存信息,因此我需要将信息存储在 iOS 中。
最佳答案
所以我意识到我所做的一切都是错误的。我需要将表单数据发布到数据库。数据库用于收集所有提交的表单数据。我相信每次提交表单数据时,.txt 文件的想法都会被覆盖。所以,我创建了两个页面。一页填写并提交表格。用于查看所有表单条目以及导出和清除数据库的一页。
index.html
<head>
<meta charset="utf-8">
<title>Hall Render - Resources Sign Up</title>
<!-- Mobile Viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- Main Stylesheet -->
<link href="assets/css/screen.css" media="all" rel="stylesheet" type="text/css">
<!-- jQuery -->
<script src="assets/js/jquery-1.11.3-min.js"></script>
<script src="assets/js/jquery.mobile-1.4.5.min.js"></script>
<!-- jQuery Plugins -->
<script src="assets/js/jquery-validation-1.14.0-min.js"></script>
<!-- Cordova JS -->
<script src="cordova.js"></script>
<!-- Functions -->
<script src="assets/js/functions.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){
var db = window.openDatabase("HALLRENDER", 1.0, "App database",200000);
// Size differences
var mainH = $('#main').outerHeight();
var sheaH = $('#secondary-header').outerHeight();
$('#secondary').height(mainH + sheaH - 40).hide();
// Form Validation and Sumbit
var form = $('#signup-form');
form.validate({
debug: true,
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
email: {
required: true,
email: true
}
},
messages: {
firstname: {
required: "Please enter your first name."
},
lastname: {
required: "Please enter your last name."
},
email: {
required: "Please enter your email."
}
},
submitHandler: function(form){
$('#main, #secondary-header').fadeOut(400);
$('#secondary').fadeIn(500);
db.transaction(populateDB, errorCB, successCB);
}
});
}
// Populate the database
function populateDB(tx) {
// Form Variables
var firstName = $('#cfirst-name').val();
var lastName = $('#clast-name').val();
var organization = $('#corganization').val();
var title = $('#ctitle').val();
var email = $('#cemail').val();
tx.executeSql('CREATE TABLE IF NOT EXISTS PEOPLE (Email, FirstName, LastName, Title, Organization)');
tx.executeSql('INSERT INTO PEOPLE (Email, FirstName, LastName, Title, Organization) VALUES ("'+email+'", "'+firstName+'", "'+lastName+'", "'+title+'", "'+organization+'")');
setTimeout(function(){
window.location.reload(1);
}, 8000);
}
// Transaction error callback
function errorCB(tx, err) {
alert("Error processing SQL: "+err);
}
// Transaction success callback
function successCB() {
console.log("Entry saved!");
}
</script>
</head>
<body onload="onDeviceReady()">
<!-- Begin Header -->
<header>
<div class="wrap">
<!-- SOMETHING -->
</div>
</header>
<!-- End Header -->
<!-- Begin Secondary Header -->
<section id="secondary-header">
<div class="wrap">
<div class="inner-wrap">
<!-- SOMETHING -->
</div>
</div>
</section>
<!-- End Secondary Header -->
<!-- Begin Main -->
<section id="main">
<div class="wrap">
<div class="inner-wrap">
<div class="text">
<!-- SOMETHING -->
</div>
<form id="signup-form">
<fieldset>
<div class="label-input-wrap">
<label for="cfirst-name">First Name: (required)</label>
<input type="text" id="cfirst-name" name="firstname" tabindex="1">
</div>
<div class="label-input-wrap">
<label for="clast-name">Last Name: (required)</label>
<input type="text" id="clast-name" name="lastname" tabindex="2">
</div>
<div class="label-input-wrap">
<label for="corganization">Organization:</label>
<input type="text" id="corganization" name="organization" tabindex="3">
</div>
<div class="label-input-wrap">
<label for="ctitle">Title:</label>
<input type="text" id="ctitle" name="title" tabindex="4">
</div>
<div class="label-input-wrap">
<label for="cemail">Email: (required)</label>
<input type="email" id="cemail" name="email" tabindex="5">
</div>
<input id="form-submit" type="submit" value="Sign Up" tabindex="6">
</fieldset>
</form>
</div>
</div>
</section>
<!-- End Main -->
<!-- Begin Secondary -->
<section id="secondary">
<div class="wrap">
<div class="inner-wrap">
<div class="text">
<h3>Thank You</h3>
</div>
</div>
</div>
</section>
<!-- End Secondary -->
</body>
导出.html
<head>
<meta charset="utf-8">
<title>Hall Render - Export</title>
<!-- Mobile Viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- Main Stylesheet -->
<link href="assets/css/screen.css" media="all" rel="stylesheet" type="text/css">
<!-- jQuery -->
<script src="assets/js/jquery-1.11.3-min.js"></script>
<!-- jQuery Plugins -->
<script src="assets/js/jquery-validation-1.14.0-min.js"></script>
<!-- Cordova JS -->
<script src="cordova.js"></script>
<!-- Functions -->
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){
var db = window.openDatabase("HALLRENDER", 1.0, "App database",200000);
db.transaction(queryDB);
$('#dump').click(function(){
db.transaction(dropDB);
alert('Database Cleared!');
});
}
// Query Table Rows
function queryDB(tx) {
tx.executeSql('SELECT * FROM PEOPLE', [], querySuccess);
}
// Get Table Rows
function querySuccess(tx,result){
var status = document.getElementById("status");
var people = "";
var len = result.rows.length;
for (var i=0; i<len; i++){
people = people + '<li>'+result.rows.item(i).Email+','+result.rows.item(i).FirstName+','+result.rows.item(i).LastName+','+result.rows.item(i).Title+','+result.rows.item(i).Organization+'</li>';
}
status.innerHTML = people;
$("#status").listview("refresh");
}
// Delete Database
function dropDB(tx) {
tx.executeSql('DROP TABLE PEOPLE');
}
// File Writer
function saveCourseToFile() {
console.log("checkpoint 1");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSSuccess, onFSError);
alert('CSV File Created!');
}
function onFSSuccess(fileSystem) {
console.log("checkpoint 2");
console.log("Opened file system: " + fileSystem.name);
fileSystem.root.getFile("export.csv", {create:true, exclusive:false}, gotFileEntry, onFSError);
}
function gotFileEntry(fileEntry) {
console.log("checkpoint 3");
fileEntry.createWriter(gotFileWriter, onFSError);
}
function gotFileWriter(writer) {
var entries = $('#status').find('li').filter(function() {
return $(this).find('ul').length === 0;
}).map(function(i, e) {
return $(this).text();
}).get().join('\n');
var dbEntries = 'Email,First Name,Last Name,Title,Organization\n'+entries;
writer.onwrite = function(evt) {
console.log("checkpoint 4: write success!");
};
writer.write(dbEntries);
}
function onFSError(err) {
console.log(err.code);
}
</script>
</head>
<body onload="onDeviceReady()">
<div class="inner-wrap">
<ol id="status" nam="status"></ol>
<div class="clear"></div>
<button id="export" onclick="saveCourseToFile()">Create .csv File Export</button>
<div class="clear"></div>
<button id="dump">Clear Database</button>
<p id="warning"><strong>WARNING: </strong>Export to .csv <em>BEFORE</em> clearing database!!</p>
<div class="clear"></div>
<div id="contents"></div>
</div>
</body>
这可能看起来很疯狂。但是,它适用于我想要完成的事情。获取表单数据,将其保存在本地,然后将信息导出到 .csv 文件中。希望这能让其他人对类似的问题有所了解。感谢大家的帮助!!
关于html - Phonegap 保存 HTML 表单数据的 txt 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31732674/
我知道我要求太多,但也许你也可以帮助解决这个问题。 a.txt 包含单词,b.txt 包含字符串。 我想知道 b.txt 中有多少个字符串以 a.txt 中的单词结尾 例子:一个.txt apple
这个问题在这里已经有了答案: erge text files ordered by numerical filenames in Bash (3 个答案) 关闭 4 年前。 我有一个文件夹,其中包含
我在一个目录中有几个平面文件 (.txt)。所有这些文件的格式都是 *.txt.txt,所以我想将其重命名为 *.txt?有什么简单的方法可以一起重命名? 当我尝试 ren *.txt.txt *.t
这个问题在这里已经有了答案: How can I use a file in a command and redirect output to the same file without trunc
您是否有任何理由应该或不应该允许访问 javascript 或 css 文件?特别是常见的文件,如 jquery。 最佳答案 人们普遍认为,搜索引擎每天为给定站点分配一定数量的带宽或 URL。因此,一
Closed. This question is off-topic。它当前不接受答案。 想要改善这个问题吗? Update the question,所以它是用于堆栈溢出的on-topic。 已关闭
这是相同的代码。我面临的问题是,我无法在任何文件上写入任何内容。请帮忙解决这个问题 #include #include int main() { FILE *fe; FILE *fo;
我想要特定于域的 robots.txt,到目前为止这有效: RewriteRule ^robots\.txt$ robots/%{HTTP_HOST}.txt [L] 但我希望有一个后备方案,因此如果
我正在调试一些构建成功运行的 SQL 命令的代码。 然而,在查询结束时,查询结果似乎被写入了一个文本文件。 完整的查询如下 echo SELECT DATE,DATETABLE,DATE,APPDAT
这个问题已经有答案了: difference between grep Vs cat and grep (5 个回答) 已关闭 8 年前。 我看到一个例子,其中有人这样做: cat source.tx
我想将表中的数据从以 csv 格式存储的文本文件插入到 sql server 表中。为此,我正在使用批量插入语句。现在我需要在“From”子句中指定文件名。我不想在那里使用网络位置或本地位置。我想将我
假设我有一个测试文件夹 (test.domain.com) 并且我不希望搜索引擎在其中抓取,我是否需要在测试文件夹中有一个 robots.txt 或者我可以只放置一个 robots.txt在根目录中,
关闭。这个问题是off-topic .它目前不接受答案。 想改善这个问题吗? Update the question所以它是 on-topic对于堆栈溢出。 9年前关闭。 Improve this q
这个问题在这里已经有了答案: order of directives in robots.txt, do they overwrite each other or complement each ot
关闭。这个问题是opinion-based .它目前不接受答案。 想改进这个问题?更新问题,以便 editing this post 可以用事实和引用来回答它. 8年前关闭。 Improve this
已关闭。这个问题是 not about programming or software development 。目前不接受答案。 这个问题似乎不是关于 a specific programming
在过去的几年中,当我引用“名字”字段的文本框控件时,我一直使用 FirstNameTxt 命名约定。但是,我注意到大多数其他开发人员倾向于使用命名约定 txtFirstName 哪个是最好的约定?为什
我只想允许目录 /minsc 中的一个文件,但我想禁止该目录的其余部分。 现在 robots.txt 中是这样的: User-agent: * Crawl-delay: 10 # Directorie
我正在编写一个将 youtube.com 映射到另一个域的代理服务器(因此用户可以轻松地从德国等国家/地区访问 youtube,而无需审查搜索结果和视频)。 不幸的是,我的 robots.txt 中存
我没有编程技能,但有一项非常具体的任务:我必须将一个庞大的文本文件拆分成多个,并在特定的文本标记 (@) 处拆分它们。我决定尝试使用 Powershell 脚本来完成此任务。 到目前为止,这就是我想出
我是一名优秀的程序员,十分优秀!