EasyUI Forum
May 08, 2024, 03:46:01 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Form - REST Client (POST,PUT,DELETE,GET)  (Read 13219 times)
Daretzki
Newbie
*
Posts: 4


View Profile
« on: December 29, 2013, 05:23:44 AM »

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
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: December 29, 2013, 05:19:33 PM »

Please refer to this tutorial http://www.jeasyui.com/tutorial/form/form1.php.
Logged
Daretzki
Newbie
*
Posts: 4


View Profile
« Reply #2 on: December 30, 2013, 03:26:24 AM »

Hi,
Thank you.
How to modify example above to send REST "PUT" and "DELETE" to modify and delete record (not POST) ?

Darek
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: December 30, 2013, 05:45:30 PM »

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);
}
});

Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!