0

I'm creating a form in UiApp to collect user data. Based on their answers on page, I need to go to page based answer. Say I've got three pages. The user completes first page. I use a button and serverhandler to call a function that runs and if statement like:

if(value1 == s1 && value2 == s2){
app.getElementById('page1').setVisible(false);
app.getElementById('page2').setVisible(true);
}

This works fine. I'm on page two. From there the click for on the next button and that calls a syncText' function that will load the user data with this method: How To Allow Users to Review Answers before Submiting Form?

All good. The problem comes when I am on page one and I need to go to page three and syncText.

if( value1 != s1){
app.getElementById('page1').setVisible(false);
app.getElementById('page3').setVisible(true);
syncText()
}

This does not work. How can I call a function in an If Statement in Google's UiApp?

I know I could simply rewrite the function into that if statement, but my true form is far more complicated and I want to avoid repeating myself. Any Help?


Updated: So it looks like the function is being called but it can't find the values from the form. How do I get the form values into this function?

Here's a full example code:

function doGet(e){
var app = UiApp.createApplication();
var appPanel = app.createVerticalPanel();
var form = app.createFormPanel();
var panel1 = app.createGrid(4,5).setId('panel1');

 var firstNameLabel = app.createLabel("First Name:");
var firstName = app.createTextBox().setName('firstName').setId('firstName');
var lastNameLabel = app.createLabel("Last Name:");
var lastName = app.createTextBox().setName('lastName').setId('lastName');
var emailLabel = app.createLabel('Your Email');
var email = app.createTextBox().setName('email').setId('email');
 var testing = app.createServerHandler('testing').addCallbackElement(form);

var button1 = app.createButton('Go to Review');
 var info1 = app.createLabel("Please Enter First Name")
.setVisible(false)
.setStyleAttribute('color', 'red');
 var info2 = app.createLabel("Please Enter Last Name")
 .setVisible(false)
 .setStyleAttribute('color', 'red');
var info3 = app.createLabel("Please Enter Email")
.setVisible(false)
 .setStyleAttribute('color', 'red');

panel1.setWidget(0,0, firstNameLabel);
panel1.setWidget(0,1, firstName);
panel1.setWidget(0,2, lastNameLabel);
panel1.setWidget(0,3, lastName);
panel1.setWidget(1,1, info1);
panel1.setWidget(1,3, info2);
panel1.setWidget(2,0, emailLabel);
panel1.setWidget(2,1, email);
panel1.setWidget(2,3, button1);
panel1.setWidget(3,1, info3);

app.add(form);
appPanel.add(panel1);
form.add(appPanel);


var panel2 = app.createGrid(4,5).setId('panel2').setVisible(false);
var reviewFirstNameLabel = app.createLabel("First Name:");
var reviewFirstName = app.createLabel().setId('reviewFirstName');
var reviewLastNameLabel = app.createLabel("Last Name:");
var reviewLastName = app.createLabel().setId('reviewLastName');
var reviewEmailLabel = app.createLabel('Your Email:');
var reviewEmail = app.createLabel().setId('reviewEmail');
var submitButton = app.createSubmitButton('Submit');
var button2 = app.createButton('Edit Response');

panel2.setWidget(0,0, reviewFirstNameLabel); 
panel2.setWidget(0,1, reviewFirstName); 
panel2.setWidget(0,2, reviewLastNameLabel);
panel2.setWidget(0,3, reviewLastName);
panel2.setWidget(1,0, reviewEmailLabel);
panel2.setWidget(1,1, reviewEmail);
panel2.setWidget(2,0, button2);
panel2.setWidget(3,0, submitButton);
appPanel.add(panel2);

//
var editResponse = app.createClientHandler()
.forTargets(panel1).setVisible(true)
.forTargets(panel2).setVisible(false);

button1.addClickHandler(testing);
button2.addClickHandler(editResponse);

return app;
}

function syncText(e){
  var app = UiApp.getActiveApplication(); 


  app.getElementById('reviewFirstName').setText(e.parameter.firstName));
  app.getElementById('reviewLastName').setText(e.parameter.lastName);
  app.getElementById('reviewEmail').setText(e.parameter.email);
  app.getElementById('panel1').setVisible(false);
  app.getElementById('panel2').setVisible(true);
  return app;
}


function testing(e){
var app = UiApp.getActiveApplication();
var firstName = e.parameter.firstName;
var lastName = e.parameter.lastName;
var email = e.parameter.email;

if(firstName != ""){
syncText();
 }

The error now says the parameter is undefined? All of the values form the testing function check out, but I can't seem to get the values from syncText(). Any help on getting this functional?

Community
  • 1
  • 1
MartinK
  • 412
  • 1
  • 4
  • 20
  • looks fine. I suspect the logic is wrong rather than how you are calling the function. Can you post more code. Did you try if(true) { ... } - Note, you have a ; missing at the end of syncText() – eddyparkinson Feb 01 '13 at 00:33
  • How do you know that syncText() isn't being called? What does syncText do? – Phil Bozak Feb 06 '13 at 23:57
  • You know Phil, you're right. The problems I can't solve are usually occurring where I am not looking. My original problem was on a much larger project so I have created a limited example and updated it in the question. – MartinK Feb 07 '13 at 18:17
  • Have you find an answer to this? – Serge insas Feb 12 '13 at 16:09

1 Answers1

0

The better approach is to add class "page" to every page.

And to have some function like
function enablePage(page_num)

where you hide every .page object and then enable neccesary one by id.

Tigra
  • 2,611
  • 20
  • 22
  • I appreciate the difference in calling the pages this way, but it does appear to address my questions, at least not explicitly. Still the problem exists that I can't call a function from within the if statement. – MartinK Jan 31 '13 at 19:04
  • 1
    So question itself not clear to me :) Actualy I dont really see a question. – Tigra Jan 31 '13 at 19:09
  • Thanks, updated. Essentially, it will not call a function from an if statement. Is there something wrong in the code, or another way round? – MartinK Jan 31 '13 at 19:37