Skip to main content
Enterprise Agile Planning Image

This post is from the CollabNet VersionOne blog and has not been updated since the original publish date.

Last Updated Feb 07, 2013 — Enterprise Agile Planning expert

How To Update a User Story with the VersionOne REST Data API in JSFiddle with jQuery, JSON, HTTP POST, and 20 Lines of Code

Enterprise Agile Planning
Developing Custom VersionOne Apps 101 Series GuideIn the last article, How To Query the VersionOne REST Data API for User Stories in JSFiddle with jQuery, JSON, HTTP GET, and 9 Lines of Code, we used HTTP GET, jQuery's implicit HTTP method, to query a specific User Story. Now, let's use a simple HTTP POST with jQuery to update the same story.

In this article, you will

  • Use the JSFiddle online editor
  • Use jQuery.ajax to issue an HTTP POST request to the VersionOne Data API to update a User Story

What you’ll need

  • Google Chrome. While it should work, I have not tested this in other browsers, so if you run into any snags, please let me know in the comments.

Fire Up a New JSFiddle

  • Open a brand new window or tab in Chrome and navigate to http://www.JSFiddle.net
  • From the left side, under Choose Framework, leave onLoad preselected
  • Select the most recent version of jQuery
  • Type the following 20 lines of code into the JavaScript panel, then press Run
var url = "http://eval.versionone.net/platformtest/rest/1.v1/Data/Story/1154";
var headers = { Authorization: "Basic " + btoa("admin:admin"), Accept: "haljson" };
var storyDto = {
 Description: prompt("Enter a description", "Changing description at time of " + $.now()),
 Estimate: prompt("Enter an estimate of 1 to 5", "2")
};
var settings = {
 url: url,
 type: "POST",
 data: JSON.stringify(storyDto),
 dataType: "json",
 contentType: "haljson",
 headers: headers
};
$.ajax(settings).done(function(data) {
 beautifulJson = JSON.stringify(data, null, 4);
 $("body").html("<pre>" + beautifulJson + "</pre>");
}).fail(function(jqXHR) {
 $("body").html(jqXHR.responseText);
});

Expected JSON Output

After running it, you should see something like this:
{
    "Description": "Changing description at time of 1359615935655",
    "Estimate": "2",
    "_links": {
        "self": {
            "href": "/platformtest/rest/1.v1/Data/Story/1154/1609",
            "id": "Story:1154:1609"
        }
    }
}

Understand the jQuery $.ajax options

This time, we pass a few more settings to jQuery, such as the POST HTTP method, and, of course, a "stringified" DTO object with two properties that will overwrite those properties on the remote Story asset. The dataType and contentType options tell jQuery what the format coming back is, and the server what the incoming content format is, respectively. Note that "haljson" is itself simply JSON data, but the server formats it consistent the current proposed HAL+JSON standard format for hypermedia APIs. We'll discuss that in later articles.The the live JSFiddle

Next up

Let's revisit querying and do some HTML rendering this time, shall we? Read How To Use jQuery to GET a User Story in JSON Format from the VersionOne REST Data API and Render it as HTML next.

More from the Blog

View more
Apr 08, 2021

Making IT services more agile

Enterprise Agile Planning
The agile revolution completely transformed how we create digital prod ...
Read More
Feb 14, 2021

Reflecting on the 20th anniversary of the Agile Manifesto

Enterprise Agile Planning
Over the past 20 years, it’s been amazing to watch an idea from ...
Read More
Feb 08, 2021

How does agile apply to an entire organization?

Enterprise Agile Planning
Before we dive into the main subject of this blog post, it is importan ...
Read More
Feb 03, 2021

It took a pandemic to realize why digital transformation actually matters

Enterprise Agile Planning
Before anyone had ever heard of COVID-19, businesses across the globe ...
Read More
Contact Us