Learn XQuery

XQuery Source — Updating Relational Data

Once you start the Photo Search demonstration, you need to log in. This section describes the XQuery code that's used both to generate the HTML for the Photo Search login page and to perform login functions.

The Log In Page

As shown in the following illustration, the Log In page is generated by two XQuery files — loging.xquery and toolbar.xquery. The login.xquery file, which you can see in the URL displayed in the browser's Address field, is the file directly responsible for generating the Log In page.

Enter an ID and click Login to get started

Note, though, that the DataDirect XQuery logo and the toolbar come from the toolbar module, which is imported from toolbar.xquery. (The XQuery code from login.xquery that calls toolbar.xquery is highlighted in the preceding illustration.) Because the toolbar is a modularized component of the Photo Search application, you'll see this import statement at the start of the XQuery for most of the pages in the application. Values for the toolbar functions (View Source, Get Web Services, Learn More) change depending on the specific XQuery that is importing the XML fragments from toolbar.xquery, as you can see in the following code:

declare option ddtek:serialize "method=html";
declare variable $toolbar := toolbar:function("login.html", "/photo-search",
"http://www.xquery.com/examples/web-service-example/photo-search/index.html");

Creating a New User

So far, what we've seen is pretty straightforward usage of XQuery. Let's take a closer look at the login functionality defined in the HTML inside login.xquery, where we first see how DataDirect XQuery can be used to update a relational database.

<html>
    <head>
         {$toolbar/head/link}
            <title>Photo Search powered by DataDirect XQuery</title>
    </head>
    <script type="text/javascript" src="ajax.js"/>
    <script type="text/javascript">
            function checkLogin(){{
                            login = this.document.getElementById("login").value;
                            if(login != ""){{
                                    ajax_insertUser(login);
                                    this.window.open("main.xquery?login=" + login, "_self");
                            }}
            }}
    </script>
...

As you can see, the second <script type="text/javascript"> element defines an inline function, function checkLogin(). If the User Name field is not empty, the ajax_insertUser() function defined in the ajax.js is called, passing the login value as the parameter.

The ajax.js Javascript

The Javascript file ajax.js is just a library of Javascript functions, like ajax_insertUser():

function ajax_insertUser(login)
{
return ajax_xmlhttp("POST", "insertUser.xquery?login=" + login, false, null);
}

The ajax_insertUser() function concatenates the URL with insertUser.xquery?login= with the login value provided by the user — so, we have http://examples.xquery.com/photo-search/insertUser.xquery?login=ohenry, for example. Next, let's look at insertUser.xquery to see what it does with the login value.

The insertUser.xquery Query

The insertUser.xquery is, as the name suggests, responsible for adding new users to the database. This is accomplished using the proprietary DataDirect XQuery ddtek:sql-insert function to insert a single record into a database table.

declare variable $login as xs:string external;

if(not(exists(collection("users")/users[login = $login]))) then
ddtek:sql-insert("users", "login", $login)
else ()

Here, the ddtek:sql-insert function is being used to insert the user name value ($login) into the "login" column of the "users" table.

Once the user name is added to the database, the ajax_insertUser() function opens a new URL for main.xquery, again creating the URL by concatenating the query name with the user name (login) value — http://examples.xquery.com/photo-search/main.xquery?login=ohenry, for example. The URL is opened in the same browser ("_self"):

...
    <script type="text/javascript">
            function checkLogin(){{
                            login = this.document.getElementById("login").value;
                            if(login != ""){{
                                    ajax_insertUser(login);
                                    this.window.open("main.xquery?login=" + login, "_self");
                            }}
            }}
    </script>
...

It is main.xquery that provides the search and query-listing capabilities of the Photo Search demonstration application.

What's Next?

Now that you have seen how you can use XQuery to update a relational database, let's take a look at the heart of the Photo Search application — searching Flickr photos using DataDirect XQuery and a Flickr Web service. There you'll learn how the XQueryWebService framework was used to implement this search functionality.

Next: "Searching Flickr Photos" Prev: "Updating Relational Data"

Feeds

Multimedia

Newsletter