type=page
status=published
title=The jsonpmodel Example Application
next=jsonp007.html
prev=jsonp005.html
~~~~~~
=The jsonpmodel Example Application


[[BABEDFCG]]

[[the-jsonpmodel-example-application]]
The jsonpmodel Example Application
----------------------------------

This section describes how to build and run the `jsonpmodel` example
application. This example is a web application that demonstrates how to
create an object model from form data, how to parse JSON data, and how
write JSON data using the object model API.

The `jsonpmodel` example application is in the
tut-install`/examples/web/jsonp/jsonpmodel` directory.

The following topics are addressed here:

* link:#CEGHHCCC[Components of the jsonpmodel Example Application]
* link:#CEGEFHFH[Running the jsonpmodel Example Application]

[[CEGHHCCC]]

[[components-of-the-jsonpmodel-example-application]]
Components of the jsonpmodel Example Application
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The `jsonpmodel` example application contains the following files.

* Three JavaServer Faces pages.

** The `index.xhtml` page contains a form to collect information.

** The `modelcreated.xhtml` page contains a text area that displays JSON
data.

** The `parsejson.xhtml` page contains a table that shows the elements
of the object model.
* The `ObjectModelBean.java` managed bean, which is a session-scoped
managed bean that stores the data from the form and directs the
navigation between the Facelets pages. This file also contains code that
uses the JSON object model API.

The code used in `ObjectModelBean.java` to create an object model from
the data in the form is similar to the example in
link:jsonp003.html#BABIGIAF[Creating an Object Model from Application
Code]. The code to write JSON output from the model is similar to the
example in link:jsonp003.html#BABHEJFF[Writing an Object Model to a
Stream]. The code to navigate the object model tree is similar to the
example in link:jsonp003.html#BABJHEHG[Navigating an Object Model].

[[CEGEFHFH]]

[[running-the-jsonpmodel-example-application]]
Running the jsonpmodel Example Application
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

This section describes how to run the `jsonpmodel` example application
using NetBeans IDE and from the command line.

The following topics are addressed here:

* link:#CEGFECCB[To Run the jsonpmodel Example Application Using
NetBeans IDE]
* link:#CEGGJBFA[To Run the jsonpmodel Example Application Using Maven]

[[CEGFECCB]]

[[to-run-the-jsonpmodel-example-application-using-netbeans-ide]]
To Run the jsonpmodel Example Application Using NetBeans IDE
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

1.  Make sure that GlassFish Server has been started (see
link:usingexamples002.html#BNADI[Starting and Stopping GlassFish
Server]).
2.  From the File menu, choose Open Project.
3.  In the Open Project dialog box, navigate to:
+
[source,oac_no_warn]
----
tut-install/examples/web/jsonp
----
4.  Select the `jsonpmodel` folder.
5.  Click Open Project.
6.  In the Projects tab, right-click the `jsonpmodel` project and select
Run.
+
This command builds and packages the application into a WAR file
(`jsonpmodel.war`) located in the `target` directory, deploys it to the
server, and opens a web browser window with the following URL:
+
[source,oac_no_warn]
----
http://localhost:8080/jsonpmodel/
----
7.  Edit the data on the page and click Create a JSON Object to submit
the form. The following page shows a JSON object that contains the data
from the form.
8.  Click Parse JSON. The following page contains a table that lists the
nodes of the object model tree.

[[CEGGJBFA]]

[[to-run-the-jsonpmodel-example-application-using-maven]]
To Run the jsonpmodel Example Application Using Maven
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

1.  Make sure that GlassFish Server has been started (see
link:usingexamples002.html#BNADI[Starting and Stopping GlassFish
Server]).
2.  In a terminal window, go to:
+
[source,oac_no_warn]
----
tut-install/examples/web/jsonp/jsonpmodel
----
3.  Enter the following command to deploy the application:
+
[source,oac_no_warn]
----
mvn install
----
4.  Open a web browser window and enter the following address:
+
[source,oac_no_warn]
----
http://localhost:8080/jsonpmodel/
----
5.  Edit the data on the page and click Create a JSON Object to submit
the form. The following page shows a JSON object that contains the data
from the form.
6.  Click Parse JSON. The following page contains a table that lists the
nodes of the object model tree.


