0
iPod에서 실행할 수있는 아주 작은 응용 프로그램을 작성하고 있습니다. 그것은 내가 입력 한 운동을 기반으로 정보를 저장하기위한 것입니다. 스토리지는 html5 로컬 데이터베이스가 될 것입니다. 내 질문은 어떻게 여러 운동을하고 각 운동에 대한 새로운 기록을 작성하는 양식에서 정보를 얻을 수 있습니까?html5 로컬 데이터베이스에 양식 데이터 제출 방법
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>lower</title>
<meta name="description" content="" />
<meta name="author" content="john" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="work.js" type="text/javascript" charset="utf-8"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="viewport" content="width=device-width; initial-scale=0.5; maximum-scale=0.6; minimum-scale=0.6; user-scalable=0;" />
</head>
<body>
<h1>Lower Body</h1>
<div>
<form method="post" id="workout_form">
<div>
<table id="hipadd">
<label for="hipAddReps">Hip Adductor</label>
<tr><td>Seat <input type="text" id="hipAddSeatSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="hipAddReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="hipAddWeight" size="3" /></td></tr>
</table>
</div><br />
<div>
<table id="hipab">
<label for="hipAbReps">Hip Abductor</label>
<tr><td>Seat <input type="text" id="hipAbSeatSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="hipAbReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="hipAbWeight" size="3"/></td></tr>
</table>
</div><br />
<div>
<table id="legcurl">
<label for="legCurlReps">Leg Curl</label>
<tr><td>Back <input type="text" id="legCurlBackSetting" size="1"/></td><td>Feet </td><td><input type="text" id="legCurlFeetSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="legCurlReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="legCurlWeight" size="3"/></td></tr>
</table>
</div><br />
<div>
<table id="legext">
<label for="legExtensionReps">Leg Extension</label>
<tr><td>Back <input type="text" id="legExtensionBackSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="legExtensionReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="legExtensionWeight" size="3"/></td></tr>
</table>
</div><br />
<div>
<table id="legpress">
<label for="legPressReps">Leg Press</label>
<tr><td>Back <input type="text" id="legPressBackSetting" size="1"/></td><td>Seat </td><td><input type="text" id="legPressSeatSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="legPressReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="legPressWeight" size="3"/></td></tr>
</table>
</div><br />
<div>
<table id="glute">
<label for="gluteReps">Glute</label>
<tr><td>Seat <input type="text" id="gluteSeatSetting" size="1"/></td></tr>
<tr><td>Reps <input type="text" id="gluteReps" size="2" value="10"/></td><td>Weight </td><td><input type="text" id="gluteWeight" size="3"/></td></tr>
</table>
</div><br />
<div>
<button type="button" onclick="insertData()">Submit</button>
</div>
</form>
</div>
</body>
</html>
와 자바 스크립트는 지금까지
$(function(){ initDatabase();
});
function initDatabase() {
try {
if (!window.openDatabase) {
alert('Local Databases are not supported by your browser.');
} else {
var shortName = 'WorkoutDB';
var version = '1.0';
var displayName = 'Workout Database';
var maxSize = 100000;
db = openDatabase(shortName, version, displayName, maxSize);
createTables();
}
} catch(e) {
if (e == 2) {
// Version mismatch.
console.log("Invalid database version.");
} else {
console.log("Unknown error "+ e +".");
}
return;
}
}
$(document).ready(function(){
db.transaction(function (transaction) {
//transaction.executeSql('drop table workout');
transaction.executeSql('CREATE TABLE IF NOT EXISTS workout(name TEXT, back TEXT, seat TEXT, feet TEXT, reps TEXT, weight TEXT);', [], nullDataHandler, errorHandler);
}
);
//insertData();
});
function insertData(){
var data = [$("label[for=hipAddReps]").text(), '', $('#hipAddSeatSetting').val(), '', $('#hipAddReps').val(), $('#hipAddWeight').val()];
db.transaction(function (transaction) {
transaction.executeSql("INSERT INTO Workout(Name, Back, Seat, Feet, Reps, Weight) VALUES (?, ?, ?, ?, ?, ?)", [data[0], data[1], data[2], data[3], data[4], data[5]]);
});
}
function errorHandler(transaction, error){
if (error.code==1){
// DB Table already exists
} else {
// Error is a human-readable string.
console.log('Oops. Error was '+error.message+' (Code '+error.code+')');
}
return false;
}
function nullDataHandler(){
console.log("SQL Query Succeeded");
}
그래서 제가 원하는 것은이 양식의 모든 필드를 입력하는 것입니다 가지고 하단에있는 제출 버튼을 누르면 및 다음 HTML은 내가 가진 각 운동마다 새로운 기록을 삽입하십시오.
그래서이 대답과 같은 것이 유일한 방법이라고 말하고 있습니까? http://stackoverflow.com/a/2227399/1060248 기본적으로 모든 운동에 대해 새로운 배열과 새로운 삽입 문을 만듭니다. –
당신은 아이팟을위한이 응용 프로그램을 만들고 있다고 말했고, 나는 HTML5에서 그렇게하고 있다고 가정합니다. IOS로 응용 프로그램을 만드는 중간 응용 프로그램이 있습니다. 아마도 [appcelerator] (http://www.appcelerator.com/) 또는 [phonegap] (http://phonegap.com/)을 사용하고 있습니까? 더 많은 정보는 귀하의 질문에 대한 답을 도울 것입니다. –
아직 그 시점에 있지 않아 결정하지 못했습니다. 앞으로 나아 가기 전에 결정할 필요가 있습니까? 나는 그저 일을 바로 잡으려고 노력 중이고, 나는 나의 iPod에서 그것을 얻기 위해 내가해야 할 일을 고려하려고했다. 이것이 막연한 경우 미안 해요.이 타입의 물건으로 처음으로 돌아 다니는 것입니다. –