I want to send some parameter from client side while reading the data from server side. I am using Javascript. My code for transport part od dataSource is as follows:
transport: {
read: {
type: "POST",
dataType: "json",
url: "${pageContext.request.contextPath}/daily/statusList",
data: [{
id : $("#txtId").val(),
resId : $("#txtResId").val(),
duration : $("#duration").val()
}]
}
},
I am not getting any of this on server side. I am setting them from input textbox.
Data is should be single object not an array.
e.g.
transport: {
read: {
type: "POST",
dataType: "json",
url: "${pageContext.request.contextPath}/daily/statusList",
data: {
id : $("#txtId").val(),
resId : $("#txtResId").val(),
duration : $("#duration").val()
}
}
},
Related
I am using ajax to upload data including an image to my server side. When the image is below 1.35MB it works fine. However, for images larger then 1.35MB the other data is over written (e.g., when I
System.out.println("Level: " + request.getParameter("ssAccountLevel"));
It shows as null.
This is my code:
$.ajax({
type: "POST",
url: "ResourceAddView",
cache: false,
data : {
ssAccountLevel : sessionStorage.getItem('ssAccountLevel'),
ssAccountID : sessionStorage.getItem('ssAccountID'),
image : img2,
imageType : imageType,
resourceType: $("#resourceTypeAdd").val(),
resourceName: $("#resourceNameAdd").val(),
resourceDescription: $("#resourceDescriptionAdd").val(),
},
})
.fail (function(jqXHR, textStatus, errorThrown) {
//alert(jqXHR.responseText);
$('#ajaxGetUserServletResponse13').text('Error adding Resource.');
})
.done(function(responseJson){
$('#ajaxGetUserServletResponse13').text('Resource added.');
showResourceDataTable();
})
I resolved this issue by changing my ajax POST to json.
From:
$.ajax({
type: "POST",
url: "StoresAddView",
cache: false,
data : {
ssAccountLevel : sessionStorage.getItem('ssAccountLevel'),
ssAccountID : sessionStorage.getItem('ssAccountID'),
ssGroupID : sessionStorage.getItem('ssGroupID'),
itemNameAdd: $("#itemNameAdd").val(),
itemDescriptionAdd : $("#itemDescriptionAdd").val(),
...
To:
var data = {"ssAccountLevel" : sessionStorage.getItem('ssAccountLevel'),
"ssAccountID" : sessionStorage.getItem('ssAccountID'),
"ssGroupID" : sessionStorage.getItem('ssGroupID'),
"itemNameAdd" : $("#itemNameAdd").val(),
"itemDescriptionAdd" : $("#itemDescriptionAdd").val(),
...}
$.ajax({
type: "POST",
url: "StoresAddView",
cache: false,
contentType: "application/json",
processData: false,
data: JSON.stringify(data),
})
I do not know why this worked. Any explanation would be greatly received as to why the original code worked for smaller uploads only.
Kind regards,
Glyn
I'm using a custom edit form in KendoUI Grid. After clicking the Update button, the request sends but the form stays open.
Should I return some special response from server to dataSource?
dataSource:
{
type: "odata",
transport:
{
read:
{
url: AjaxSearch,
type: "POST",
async: false,
data:
{
"action":"search_material",
"MAT_TECH_ID" : jQuery("#MAT_TECH_ID").val(),
"MDMID" : jQuery("#MDMID").val(),
"MAT_SAP_ID" : jQuery("#MAT_SAP_ID").val(),
"MAT_NAME_RU" : jQuery("#MAT_NAME_RU").val(),
"MAT_NAME_ENG" : jQuery("#MAT_NAME_ENG").val(),
"PART_NUM" : jQuery("#PART_NUM").val(),
}
},
update:
{
url: AjaxSave,
type: "POST",
async: false,
}
},
schema: {....
I'm trying to get data from a webservice using ajax and POST method.
Ext.Ajax.request({
url: 'http://localhost......',
method:'POST',
success: function(response) { console.log(response.responseText); },
failure: function() { Ext.Msg.alert('Fail'); },
jsonData:{
/*Here I specify my request json*/
}
}
});
The above thing works fine but when i try to mimic the same in EXTJS store it responds with a error
he server responded with a status of 415 (Unsupported Media Type)
EXTJS STORE CODE
Ext.define('IWM.store.JsonTest', {
extend: 'Ext.data.Store',
autoLoad: true,
fields:['Name'],
proxy: {
type: 'ajax',
method : 'POST',
actionMethods: {
create : 'POST',
read : 'POST',
update : 'POST',
destroy: 'POST'
},
jsonData:{
/*JSON */
}
},
url: 'http://localhost......',
success: function(response) { console.log(response.responseText); },
failure:function(){console.log("failed");},
reader: {
type: 'json',
root: 'result',
successProperty: 'success'
}
}
});
First things first, try to change store config as below.
var IWMStore = new Ext.data.JsonStore({
// it seems to me you had forgotten model
model: 'YourDataModel',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
}
}
});
Example JSON value :
// here, ctgMains is the root value, CUST_ASSORT_SECTION_ID is the idProperty
{"ctgMains":[{"CUST_ASSORT_SECTION_ID":"1","CTG_SECTION":"HORECA"},{"CUST_ASSORT_SECTION_ID":"7","CTG_SECTION":"SCO"},{"CUST_ASSORT_SECTION_ID":"3","CTG_SECTION":"TRADER"}]}
Second Attempt :
Try to add headers property in your proxy definition, like below:
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
},
headers: {
'Content-type': 'application/json',
'Accept': 'application/json'
}
}
Following on from Oğuz Çelikdemir's answer, you may need to define a json writer for your proxy.
proxy: {
type: 'ajax',
url: 'http://your-url-address',
reader: {
type: 'json',
root: 'json-root-value',
idProperty: 'unique-property-in-json-file'
},
writer: {
type: 'json'
}
}
That should set the json mediatype header (assuming that's what your request is expecting).
It can Read the remote database, it can Create new items locally, but they don't actually save to the remote database. This is what adds a new item:
function addNewItem(){
dataSource.add({id:"0", petName:"Dusty", petSpecies:"Dog", petGender:"M"});
dataSource.sync();
}
$('#addPet').bind('click', addNewItem);
This ajax POST call in that function instead of the dataSource stuff adds to my database perfectly:
var object = { id:"0", petName:"Dusty", petSpecies:"Dog", petGender:"M" };
$.ajax({
type: "POST",
url: 'website/petData',
headers: { "Authorization" : "Bearer ${AccessToken}" },
contentType: "application/json",
data: JSON.stringify(object)
})
Here is my datasource code. What do I need to change? I've tried doing sooooo many different things but no luck yet.
var dataSource = new kendo.data.DataSource({
type: "everlive",
transport: {
typeName: 'petData',
read: {
url: "website/petData",
dataType: "jsonp"
},
create: {
url: 'website/petData',
dataType: "jsonp"
}
},
group: "petSpecies",
schema: {
model: {
id: "id",
fields: {
id: { type: "number"},
petName: { type: "text" },
petSpecies: { type: "text" },
petGender: { type: "text" }
}
}
}
});
So thanks to giltnerj0 and Brett's comments, I was able to google the right words, and discovered that all I needed to do was change create's dataType:jsonp to json. I'm getting some POST errors now, but it's POSTing finally and saving things to my database.
create: {
url: 'website/petData',
dataType: "json"
}
I simply want to use my own workflow for deleting a record from my grid. Is this not the proper way to do it via Javascript? The function below removes the row but refreshing the page shows the row was not actually deleted from the datasource and I do not see any requests sent in the network tab of Chrome. I should add that I am able to obtain a reference to the grid and the dataItem perfectly.
function delete(e) {
var $tr = $(e.currentTarget).closest("tr"),
grid = this,
dataItem = grid.dataItem($tr),
id = $tr.attr(kendo.attr("uid")),
model = grid.dataSource.getByUid(id);
e.preventDefault();
grid.dataSource.remove(model);
grid.dataSource.sync();
}
Edit - Here is how my datasource is defined:
$scope.contacts = new kendo.data.DataSource({
transport: {
read: {
url: apiUrl,
dataType: "json",
type: "GET"
},
update: {
url: apiUrl,
dataType: "json",
type: "POST"
},
destroy: {
url: apiUrl,
type: "DELETE"
},
create: {
url: apiUrl,
dataType: "json",
type: "POST"
}
},
pageSize: 10
});
I found something and I dont know if it works in your side.
I needed to add this line in my kendo.datasource
schema: {
model:{id:"id"}
}
and trigger like this
data_source_inspection.remove(selected.data);
data_source_inspection.sync();
this works for me.