What is a client-side template?

options_0This post is an introduction to learn about client-side templates and It’s not always good to reinvent the wheel, and that applies to this article too.

I have found a very good article that explain what I wanted to write here, is called From The Server To The ClientClient-Side Templating. I truly recommend to read this article in detail if you want learn how to deliver dynamic content via client-side and maximize code reusability and maintainability using JavaScript/jQuery, HTML, CSS, Ajax, JSON and of course, client-side templates.

Also, my teammate, Osvaldo Flores, has wrote about the same topic, he focused on Trimpath that is still our current JavaScript Templating engine here on Base22, but as all has to evolve, we are currently working on a new version of our assets using dust as our new engine, but that is another topic.

If you want to see a live demo of this client-side development technique, please visit our website Base22.com, there we use our xWidgets assets to show dynamic content that live in IBM WCM v8.

Future readings:

Hope you find this information useful!!

How to submit a Google Form with ajax

google_driveKudos to my colleague, Ernesto Rivera, who finally discover how to  submit a Google Form (data) using Ajax, I just help partially and share with you the link to our solution.

In summary: in our scenario we don’t wanted to show the default Google Form since it doesn’t looks nice in our design but we need the Spreadsheet that Google Forms use.

Also, we detected two cases on witch Google Forms works:

  1. In old Forms (we assume before Google Drive), Google send the data to a Google Spreadsheet directly:
    • https://spreadsheets1.google.com/formResponse?formkey=id-form
  2. In new Forms Google use the Form itself and no the Spreadsheet to send the data:
    • https://docs.google.co/forms/d/id-form/formResponse

If you want to see how it’s done, read Sending data to Google docs from your web page, using your own form and AJAX! in the Base22 Knowledge Wiki.

We really hope you find this information useful.

Genus Media Upshot API: How to…

Genus“Developed by Genus Technologies, an IBM Premier Partner. Genus Media Upshot is built on the foundation of IBM Enterprise Content Management, providing a highly scalable, secure platform for global asset management. Tight integration with WebSphere Portal and IBM Connections provides a streamlined, simple solution to store once and deliver rich media assets anywhere.”

In this how to… post I will share the links to the Base22.com public knowledge wiki posts where I have documented some of the actions that can be coded using the Genus Media Upshot API via jQuery Ajax.

I really hope you find this information useful.

How to convert a value to JSON string

jsonI’m working on a project where we use JSON arrays to send data to an API via JavaScript code, but we need to be sure that the data that we are sending is correctly encoded. Specially, with characters like: \, @, double quote, etc.

I found some alternatives, like the escape() function, but at the end, a friend suggested me that we should use JSON.stringify() instead, since we are working with JSON, and was the perfect solution!!.

Here is an example of how you can use JSON.stringify() using jQuery Ajax:

var strData = "{'content' :" + JSON.stringify(txtComment) + "}";

$j.ajax({
	url : url,
    type : "POST",
    async : false,
    data : strData,
    contentType : "application/json",
    statusCode : {
    	200 : function() {
            console.log("added");
       	}
    }
});

Note: console.log can throw errors in IE, they are there for illustrative purposes only and should be changed as required.

So, sending a text like: “This” is a message, using the previous code, the text will be converted as:

{'content' :"\"this\" is a message"}

And now it can be correctly interpreted by the API.

I really hope you find this information useful.

jQuery live event on iPhone doesn’t work

jQueryProblem
On a HTML5 iPhone web application where I have been working  I used jQuery live event to dynamically catch the click event of each element on a list (ul) generated by an Ajax call, all works perfect on FireFox and Safari (Web), but on an iPhone and on the iOS Simulator iPhone the live event refused to work!!…

Cause
There is an issue on the mobile version of Safari that does not attach the click events to some DOM elements.

You can find the complete solution we implemented on the Base22.com public knowledge wiki post: jQuery live event on iPhone doesn’t work

I really hope you find this information useful.

IBM Connections 4 API: How to…


IBM Connections 4

“IBM Connections is a social software platform that enables organizations to engage the right people, drive innovation, and deliver results”.

In this how to… post I will share the links to Base22.com public knowledge wiki posts where I have documented how to use Atom APIs provided with IBM® Connections 4 in specific scenarios using jQuery Ajax.

I really hope you find this information useful.

Note: Tested to work with IBM Connections 4.x; may work with previous versions.

Blogs


Forums


Following API


Profiles


Save / Remove an Item


Wiki


Files