# BirthYear App

The app will calculate a user's birthyear and display it after he/she entered his/her name and age.

## Demo

[**Import BirthYear App to your Monaca Account**](https://monaca.mobi/ja/directimport?pid=64081412e788858b3ca02f45)

**Tested Environment**

* Android 11.0
* iOS 14.3

![](/files/-Mfasnz5Flo61sSuM7Oa)

## File Components

![](/files/-MfassCZ4wC_1Pzhxd4M)

| File            | Description                            |
| --------------- | -------------------------------------- |
| `index.html`    | The startup Page                       |
| `css/style.css` | The stylesheet used in the application |

## Required JS/CSS Components

* `jQuery`   

## HTML Explanation

The following contents of the HTML body of `index.html` file is for displaying 2 textboxes for the user to input his/her name and age, and a button to calculate his/her birthyear.

```markup
...
  <div data-role="page" id="TopPage">
      <header data-role="header" data-position="fixed">
          <h1>BirthYear App</h1>
      </header>
      <section data-role="content">

          What's your name?
          <input type="text" id="myname" class="input-text" style="width: 40%">

          How old are you?
          <input type="text" id="myage" class="input-text" style="width: 20%">

          <a class="button" onclick="calculate();">calculate your birth year!</a>
      </section>
  </div>
...
```

## JavaScript Explanation

This code creates a function called `calculate`.

After entering your age and name, it stores them in two variables called `myname` and `myage` respectively. It then goes on to calculate your birth year based on today's date, and stores it in a variable called `birthyear`.

Finally it stores the message contents in a variable called `text`, calls the `navigator.notification.alert` function and displays the result as a popup.

The `navigator.notification.alert` function is a Core Cordova Plugins function that displays a popup dialog box on the screen. The third argument displays the text `Welcome to Monaca!` as the title of the dialog box.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://en.docs.monaca.io/sampleapp/samples/age-calc.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.