Print Page - Form - REST Client (POST,PUT,DELETE,GET)

Hello Guys,

First, i would like to thank you for great job. EasyUI is very usefull and complex.
I would like to ask about implementation of classical REST Client in EasyUI, similar to simple REST Client in jQuery like below. How to implement it in EasyUI
I have simple form with input "name" and "id" and butto Save:

Code:


/* Form with *Save* button */

$('#btnSave').click(function() {
	if ($('#PersonId').val() == '')
		addPerson();
	else
		updatePerson();
	return false;
});

after click btnSave all form's data are serialized with function:

Code:


/ * Helper function to serialize all the form fields into a JSON string */

function formToJSON() {
	return JSON.stringify({
		"id": $('#personId').val(), 
		"name": $('#name').val(), 
		});
}

... and than Form's data are updated by function "updatePerson" like below:

Code:


/* root url for REST server */
var rootURL = http://localhost/api/person;

/* value of person's name which should be updated with PUT methot
var personId = $('#personId').val();

function updatePerson() {
	console.log('updatePerson');
	$.ajax({
		type: 'PUT',
		contentType: 'application/json',
		url: rootURL + '/' + personId,   /* PUT generate update REST url like http://localhost/api/person/2 (update person id=2)
		dataType: "json",
		data: formToJSON(),
		success: function(data, textStatus, jqXHR){
			alert('Person updated successfully');
		},
		error: function(jqXHR, textStatus, errorThrown){
			alert('updatePerson error: ' + textStatus);
		}
	});

Question: How to do it with Form in EasyUI? How to implement REST client like above?
Thank you

Darek

Most browsers support only GET and POST. When using the form plugin to submit a form, only the 'GET' or 'POST' method are available. Other http methods such as 'PUT', 'DELETE' must be simulated by sending additional parameters in request. Another way to do this is to use native jQuery ajax.

Code:

var data = $('#ff').serialize();
$.ajax({
	type:'PUT',
	url:'...',
	data: data,
	success:function(result){
		console.log(result);
	}
});

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Daretzki on December 29, 2013, 05:23:44 AM