Parse & JS: Objects and records

This entry is part 6 of 25 in the series Parse & Javascript

parse_db

Try The Code

You do not have to configure or set up a new Class called TestObject before running this code. Your Parse app lazily creates this Class for you when it first encounters it.

There are also a few fields you don’t need to specify that are provided as a convenience. objectId is a unique identifier for each saved object.

createdAt and updatedAt represent the time that each object was created and last modified in the cloud.

Each of these fields is filled in by Parse, so they don’t exist on a Parse.Object until a save operation has completed.

Parse & JS: Parse.Object

This entry is part 7 of 25 in the series Parse & Javascript

Storing data on Parse is built around a Parse.Object. Each Parse.Object contains key-value pairs of JSON-compatible data.

In this example, the key is foo and the value is bar.  In database, a key is also known as a column.

<!doctype html>
<head>
    <title>My Parse App</title>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
    <script type='text/javascript' src='http://www.parsecdn.com/js/parse-1.2.17.min.js'></script>
</head>

<body>

<div>
    <div style='display:none' class='error'>
        <h1>Failed to connect to Parse database</h1>
    </div>

    <div style='display:none' class='success'>
        <h1>Successfully connected to parse database and insert a record</h1>
    </div>
</div>

<script>
    Parse.initialize('5d3sro43zBGj8AMYqWND5bFYMzAan7f5P5euZm7M', 'hlRZZqAylA7Fmah4Kk6ma8WK7QCT4cHrxjafnnkI');
    var TestObject = Parse.Object.extend('TestObject');
    var testObject = new TestObject();
    testObject.save({foo: 'bar'}, {
        success: function (object) {
            $('.success').show();
        },
        error: function (model, error) {
            $('.error').show();
        }
    });
</script>

</body>
</html>

Parse recommends that you NameYourClassesLikeThis and nameYourKeysLikeThis, just to keep your code looking pretty.

In this example, I have used TestObject as the class name and foo as the key.

To create a new subclass, use the Parse.Object.extend method as in:

var TestObject = Parse.Object.extend('TestObject');

Parse & Javascript: Insert a record

This entry is part 8 of 25 in the series Parse & Javascript

Say you are an independent filmmaker and you want to keep track of the movies you have made.  Let’s make an App to do that.

<!doctype html>
<head>
    <title>My Parse App</title>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
    <script type='text/javascript' src='http://www.parsecdn.com/js/parse-1.2.17.min.js'></script>
</head>

<body>

<div>
    <div style='display:none' class='error'>
        <h1>Failed to connect to Parse database</h1>
    </div>

    <div style='display:none' class='success'>
        <h1>Successfully inserted a movie record</h1>
    </div>
</div>

<script>
    Parse.initialize('5d3sro43zBGj8AMYqWND5bFYMzAan7f5P5euZm7M', 'hlRZZqAylA7Fmah4Kk6ma8WK7QCT4cHrxjafnnkI');
    var MovieObject = Parse.Object.extend('MovieObject');
    var movieObject = new MovieObject();

    movieObject.set('titleName', 'Dallas Buyers Club' );
    movieObject.set('actorName', 'Matthew McConaughey');
    movieObject.set('releaseYear', 2013);

    movieObject.save(null, {
        success: function (object) {
            $('.success').show();
        },
        error: function (model, error) {
            $('.error').show();
        }
    })

</script>

</body>
</html>
Try The Code

Once you have ran the above script, you can check in the Data Browser in Parse if the record is correctly inserted.

parse_record1

We take note of the 2 lines below.

Below here the simple syntax to create a new subclass of Parse.Object.

var MovieObject = Parse.Object.extend("MovieObject");

Here, we create a new instance of that class.

var movieObject = new MovieObject();

Parse & JS: Insert a record using save method

This entry is part 9 of 25 in the series Parse & Javascript

If you prefer, you can set attributes directly in your call to save instead to save a record.

<!doctype html>
<head>
    <title>My Parse App</title>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
    <script type='text/javascript' src='http://www.parsecdn.com/js/parse-1.2.17.min.js'></script>
</head>

<body>

<div>
    <div style='display:none' class='error'>
        <h1>Failed to connect to Parse database</h1>
    </div>

    <div style='display:none' class='success'>
        <h1>Successfully inserted a movie record</h1>
    </div>
</div>

<script>
    Parse.initialize('5d3sro43zBGj8AMYqWND5bFYMzAan7f5P5euZm7M', 'hlRZZqAylA7Fmah4Kk6ma8WK7QCT4cHrxjafnnkI');
    var MovieObject = Parse.Object.extend('MovieObject');
    var movieObject = new MovieObject();

    movieObject.save({
        titleName: 'Dallas Buyers Club',
        actorName: 'Matthew McConaughey',
        releaseYear: 2013
    }, {
        success: function (movieObject) {
            $('.success').show();
        },
        error: function (movieObject, error) {
            $('.error').show();
        }
    })

</script>

</body>
</html>
Try The Code

For Parse, on each save, it will create a unique objectId for each record.

parse_record2

Parse & JS: Retrieving object using objectid

This entry is part 10 of 25 in the series Parse & Javascript

If you have the objectId, you can retrieve a single Parse.Object using a Parse.Query.

<!doctype html>
<head>
    <title>My Parse App</title>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
    <script type='text/javascript' src='http://www.parsecdn.com/js/parse-1.2.17.min.js'></script>
</head>

<body>

<div>
    <div style='display:none' class='error'>
        <h1>objectid not found</h1>
    </div>

    <div style='display:none' class='success'>
        <h1>Successfully found the objectid</h1>
    </div>
</div>

<script>
    Parse.initialize('5d3sro43zBGj8AMYqWND5bFYMzAan7f5P5euZm7M', 'hlRZZqAylA7Fmah4Kk6ma8WK7QCT4cHrxjafnnkI');
    var MovieObject = Parse.Object.extend('MovieObject');
    var movieObject = new MovieObject();

    var query = new Parse.Query(MovieObject);
    query.get('KpM9EZvArG', {
        success: function (movieObject) {
            $('.success').show();
            alert(movieObject.get('titleName'));
        },
        error: function (movieObject, error) {
            $('.error').show();
        }
    });

</script>

</body>
</html>
Try The Code

We first pass the objectid into query.get and once the object is found, we can retrieve other key value of the object or record.

In this example, the value of the titleName key is retrieved by

movieObject.get('titleName')