JQueryMobile saving a form to a txt file - forms

I'm building a app with jquerymobile and I've a page which is a form where I have to fill some info about the field job I have done so I can save it, instead of arriving to the store and fill the paperwork by guessing the time of arrival and the time of the finish.
So, I want to fill the form and when I tap on submit, it saves a txt or another file type on the android phone.
Thanks

This worked for me...
When user clicks the save button
var form_1;
var jsonString;
function saveFormState() {
form_1 = $("#form").find("select,textarea, input").serializeArray();
jsonString = JSON.stringify(form_1);
console.log(jsonString);
getFSToSaveForm();
}
function getFSToSaveForm(){
window.requestFileSystem(LocalFileSystem.PERSISTENT,0 ,function(fileSystem){
var entry=fileSystem.root;
entry.getDirectory('myForms', {create:true, exclusive:false}, function(dirEntry){
dirEntry.getFile('formToSave.json', { create: true, exclusive: false}, saveToJsonFile, onError);
}, onError);
}, onError);
}
function saveToJsonFile(fileEntry){
fileEntry.createWriter(function(writer){
writer.onwrite = function (evt) {
console.log("Wrote to file: " + jsonString);
};
writer.write(jsonString);
}, onError);
}
If you want to restore:
+Read the file and save the read text on a vaiable
Then use some Jquery.
var jsonString;
function getFSToRead(){} //You can find the code in the cordova API http://cordova.apache.org/docs/en/2.5.0/cordova_file_file.md.html
function restoreFormState() {
var newObjectArray ;
newObjectArray = JSON.parse(jsonString);
console.log(newObjectArray.length);
jQuery.each( newObjectArray, function( i, field ) {
$( '#' + field.name).val(field.value);
});
}
Hope that helps

Related

In protractor, I want the code to handle based on if OTP triggers and if not, I can login to the home page or any page and cont do the work

I am new to coding and as well as to protractor.
In protractor, I want the code to handle based on if OTP triggers go and retrieve OTP and if not, login to the home page or any page and continue to do the actions in the home page. I was trying to do an if else check with
I tried as like below
browser.getcurrentUrl().toEqual().then function()
{
statements;
},
I don't think it works. Can someone help?
below is my code snippet.
Basically i was trying to check the url, if it contains specific texts in it, I dont want anything to perform further execution want to exit out of execution. If the url doesnt contain anything specified I want to proceed with further execution.
The if condition is working fine. but not the else part.
var HomePages = require('../Pages/HomePage.js');
var EC = protractor.ExpectedConditions;
describe(‘Check_url function’, function() {
browser.wait(EC.urlContains(’some url’),2000).then(result => {
if (result) {
console.log('Sorry!!!!!!!, Encountered PassCode Authentication Process.
Execution cant be proceed further');
} else {
HomePages.profile();
browser.driver.sleep(300);
}
});
});
//////////////////////////
HomePages.js -
'use strict';
module.exports = {
Homepage: {
usrname: element(by.className('profile-name')),
usricon: element(by.css('[title="profile"]')),
Cli_id: element(by.css('[title=“Client ID"]'))
},
profile: function() {
this.click_Profile();
},
click_Profile: function() {
var angular3 = this.Homepage;
angular3.usricon.click();
},

How to get POST Data on Best Practice CRUD (Update)

We want to update / edit the Data of a Customer. So we've tried out the original Code from the examples. The example works fine, but we usually have to check the Userinputs before we write that to the Database. Here's my Code:
/**
* Event handler (attached declaratively) for the view save button. Saves the changes added by the user.
* #function
* #public
*/
onSave: function() {
var that = this,
oModel = this.getModel();
// abort if the model has not been changed
if (!oModel.hasPendingChanges()) {
MessageBox.information(
this._oResourceBundle.getText("keine Änderungen"), {
id: "noChangesInfoMessageBox",
styleClass: that.getOwnerComponent().getContentDensityClass()
}
);
return;
}
this.getModel("appView").setProperty("/busy", true);
if (this._oViewModel.getProperty("/mode") === "edit") {
// attach to the request completed event of the batch
oModel.attachEventOnce("batchRequestCompleted", function(oEvent) {
var oParams = oEvent.getParameters();
if (oParams.success) {
that._fnUpdateSuccess();
} else {
that._fnEntityCreationFailed();
}
});
}
oModel.submitChanges();
},
How may I access to the REQUEST Data ? I've tried to look at the oModel DOM, but only found aBindings where a lot of unuseful Stuff is there. Even window.location.search wasn't the solution.
We've fixed it.
Just use this._getFormFields(this.byId("newEntitySimpleForm"));

Extjs file upload progress

I have seen form file upload example in ExtJS4 and i need customize progress of the file upload.
I see waitMsg config property, but i don't want use that and i don't want use extjs 3rd party plugins.
So, how i can get simply current upload progress from upload form in extjs?
The waitMsg uses a message box with an infinitely auto-updating progress bar. So you can't just create a progressbar that displays the current upload.
You could create your own Ext.ProgressBar and estimate the upload time and when its done you set it to the max value. But I guess you don't want that.
To answer your question: You cannot simply track the current upload progress.
If you really need this user experience you can try a 3rd party component.
To quote the docs:
File uploads are not performed using normal "Ajax" techniques, that is
they are not performed using XMLHttpRequests. Instead the form is
submitted in the standard manner with the DOM element
temporarily modified to have its target set to refer to a dynamically
generated, hidden which is inserted into the document but
removed after the return data has been gathered.
To show real progress you can use onprogress callback of XMLHttpRequest:
Ext.override(Ext.data.request.Ajax, {
openRequest: function (options) {
var xhr = this.callParent(arguments);
if (options.progress) {
xhr.upload.onprogress = options.progress;
}
return xhr;
}
});
Then use like here:
Ext.Ajax.request({
url: '/upload/files',
rawData: data,
headers: { 'Content-Type': null }, //to use content type of FormData
progress: function (e) {
console.log('progress', e.loaded / e.total);
}
});
See online demo here.
buttons: [{
text: 'Upload',
handler: function () {
var form = this.up('form').getForm();
if (form.isValid()) {
form.submit({
url: '/upload/file',
waitMsg: 'Uploading your file...',
success: function (f, a) {
var result = a.result,
data = result.data,
name = data.name,
size = data.size,
message = Ext.String.format('<b>Message:</b> {0}<br>' +
'<b>FileName:</b> {1}<br>' +
'<b>FileSize:</b> {2} bytes',
result.msg, name, size);
Ext.Msg.alert('Success', message);
},
failure: function (f, a) {
Ext.Msg.alert('Failure', a.result.msg);
}
});
}
}
}]
Live demo with progress window is here

Using PhoneGap to record audio to documents folder on iOS

As part of an iPhone app I'm creating using PhoneGap, I need to be able to use the microphone to record to a new file which is sorted in the apps document folder on the phone.
I think I have the code sorted to actually capture the recording I'm just having trouble creating a blank .wav in the documents folder to record to. According to the PhoneGap API iOS requires that the src file for the audio already exists.
Can anyone help my with the couple of lines of code needed to create this blank file? My code so far is -
function recordAudio() {
var src = "BLANK WAV IN DOCUMENTS FOLDER";
var mediaRec = new Media(src, onSuccess, onError);
// Record audio
mediaRec.startRecord();
// Stop recording after 10 sec
var recTime = 0;
var recInterval = setInterval(function() {
recTime = recTime + 1;
if (recTime >= 10) {
clearInterval(recInterval);
mediaRec.stopRecord();
}
}, 1000);
}
function onSuccess() {
console.log("recordAudio():Audio Success");
}
// onError Callback
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
$('#record-button').
bind('tap', function(){
recordAudio();
})
You may need to create the file first using the File API.
document.addEventListener("deviceready", function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, function fail(){});
}, false);
var gotFS = function (fileSystem) {
fileSystem.root.getFile("blank.wav",
{ create: true, exclusive: false }, //create if it does not exist
function success(entry) {
var src = entry.toURI();
console.log(src); //logs blank.wav's path starting with file://
},
function fail() {}
);
};
tried using something like this?
var src = "blank.wav"; instead of "BLANK WAV IN DOCUMENTS FOLDER" ?

Jeditable CANCEL callback from AJAX callback?

I see some answers for the Jeditable plugin to use a callback function from AJAX using complete callback function.
I know that the Jeditable has a callback function for the SUBMIT button, so I would like to know if there is a way to have a callback for the CANCEL button? I haven't found on the plugin docs.
Thanks for reply,
Carlos
PD. This is the source I see for COMPLETE from AJAX callback:
$("#editable_text").editable(submitEdit, {
indicator : "Saving...",
tooltip : "Click to edit...",
name : "Editable.FieldName",
id : "elementid",
type : "text",
});
function submitEdit(value, settings)
{
var edits = new Object();
var origvalue = this.revert;
var textbox = this;
var result = value;
edits[settings.name] = [value];
var returned = $.ajax({
url: "http://URLTOPOSTTO",
type: "POST",
data : edits,
dataType : "json",
complete : function (xhr, textStatus)
{
var response = $.secureEvalJSON(xhr.responseText);
if (response.Message != "")
{
alert(Message);
}
}
});
return(result);
}
Yes, there is a "onreset" parameter that is called when clicking cancel, or more generally, before jEditable resets the control back to the state before it was clicked. Add this to your code:
$("#editable_text").editable(submitEdit, {
//...
onreset: jeditableReset,
//...
});
function jeditableReset(settings, original) {
// whatever you need to do here
}
This is documented in the header of the jquery.jeditable.js file.
Another note - if you don't submit on blur (you don't appear to be in the sample), the onreset event will fire then too.