Hi Andy
Find complete codes for np_capture.html which basically uses a
dictionary_db to populate its form elements and then each new
observation/record added is saved into another database np_transac_db.
Save_obs() is called following an onclick event on button.. These
codes work perfectly fine on Google Chrome.. No issues with handling
more than 1 database.. Its for my final year project. I thought
compiling would have had been an easy task :) I guess the issue is
with working with more than 1 database at a time. Can you help me out
with this?
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="height=device-height; width=device-
width; user-scalable=1;" />
<script src="../jquery-1.6.2.js"></script>
function load_locality(selected_zone)
{
if (!db)
{ alert("Failed to connect to database."); }
else
{
db.transaction(function (tx)
{
//populate drop down for localities
tx.executeSql('SELECT id,locality_name FROM dictionary_localities
where zone=?', [selected_zone], function (tx, results) {
var len = results.rows.length; var i=0; var
txt="";
for (i = 0; i < len; i++)
{
txt=txt+"<option value="+results.rows.item(i).id
+">"+results.rows.item(i).locality_name+"</option>";
}
document.getElementById("locality").innerHTML=txt;
}, null);
});
}
}
function new_obs()
{
document.getElementById("zone").options[0].selected = true;
document.getElementById("locality").innerHTML='<option value="0">
--- </option>';
document.getElementById("producer_code").options[0].selected = true;
document.getElementById("cropid").options[0].selected = true;
document.getElementById("AP").value="";
document.getElementById("interline").value="";
document.getElementById("remarks").value="";
}
function save_obs()
{
// fetching global var here - month,year,lat,lng
var locality=Number(document.getElementById("locality").value);
var
producer=Number(document.getElementById("producer_code").value);
var cropid=Number(document.getElementById("cropid").value);
var AP=Number(document.getElementById("AP").value);
var
interline=Number(document.getElementById("interline").value);
var remarks=String(document.getElementById("remarks").value);
//check if locality has been selected
if (locality==0) {alert("You need to select a locality name. Please
select a zone to get a list of localities."); return false;}
if ((AP==0) || (isNaN(AP))) {alert("Please ensure that you have
entered a numeric value for Area Planted(ha)"); return false;}
if (isNaN(interline)) {alert("Please ensure that you have entered a
numeric value for Interline Ratio"); return false;}
//timestamp
var d=new Date();
var iyear=d.getFullYear();
var imonth=d.getMonth()+1;
var iday=d.getDate();
var timestamp=iyear+"-"+imonth+"-"+iday+" "+d.toLocaleTimeString();
var transac_db = openDatabase('np_transac_db', '1.0', 'New
Plantation Upload',5*1024*1024);
if (!transac_db)
{ alert("Failed to connect to database."); return false;}
else
{
transac_db.transaction(function (tx)
{
tx.executeSql('CREATE TABLE IF NOT EXISTS np_local(record_no
INTEGER PRIMARY
KEY,month,year,locality,producer,crop,AP,interline,remarks,lat,lng,enumcode,time_captured)');
//insert obs row in the table
tx.executeSql("INSERT INTO
np_local(record_no,month,year,locality,producer,crop,AP,interline,remarks,lat,lng,time_captured)
VALUES (NULL,?,?,?,?,?,?,?,?,?,?,?);",
[month,year,locality,producer,cropid,AP,interline,remarks,lat,lng,timestamp],insert_success,insert_error);
});
}
}
function insert_success()
{
alert("Observation was successfully inserted in database..");
}
function insert_error()
{
alert("An error occurred while trying to insert the observation in
the database. Please try again and make a manual recording in case
error persists. "); return false;
}
-->
</script>
</head>
<body onload="window.scrollTo(0, 1);">
<form id="frm_uploader">
<table border=0 cellpadding=3> <caption><u> New Plantation - Data
Capture </u></caption>
<tr><th colspan=2 align=left><a href="index.html">Back</a> </th></
tr>
<tr><td id="m">Month:</td> <td id="y">Year:</td></tr>
<tr><td>Zone:</td> <td>
<select name="zone" id="zone"
onchange="load_locality(this.value);">
<option value="0"> --- </option>
<option value="N1">N1</option>
<option value="N2">N2</option>
<option value="N3">N3</option>
<option value="N4">N4</option>
<option value="E1">E1</option>
<option value="E2">E2</option>
<option value="E3">E3</option>
<option value="E4">E4</option>
<option value="S1">S1</option>
<option value="S2">S2</option>
<option value="S3">S3</option>
<option value="S4">S4</option>
<option value="CW1">CW1</option>
<option value="CW2">CW2</option>
<option value="CW3">CW3</option>
<option value="DA">DA</option>
</select>
</td></tr>
<tr> <td colspan=2><hr></td></tr>
<tr><td>Locality:</td> <td> <div id="locality_div"><select
name="locality" id="locality"> <option value="0">- - -</option> </
select> </div> </td></tr>
<tr><td>Producer:</td><td><select name="producer_code"
id="producer_code" ><option value="0"> --- </option> </select> </td></
tr>
<tr><td>Crop:</td><td><select name="cropid" id="cropid"> <option
value="0">- - -</option></select> </td></tr>
<tr><td>Area Planted(ha):</td><td><input type=textbox name="AP"
id="AP" size=10></td></tr>
<tr><td>Interline:</td><td><input type=textbox name="interline"
id="interline" size=10></td></tr>
<tr><td>Remarks:</td><td><input type=textbox name="remarks"
id="remarks" size=30></td></tr>
<tr>
<td colspan=2 align=center><button type="button"
onclick="new_obs();">New Observation</button>
<button type="button" onclick="new_obs();">Cancel</button>
<button type="button" onclick="save_obs();">Save Observation</
button></td>
</tr>
<tr><td colspan=2 align=center><div id="display"></div></td></tr>
</table>
</form>
</body>
</html>