I’, using Kendo ui autocomplete control un a Project. The autocomplete gets the data from a WCF service returning data in JSON format.
In the html page I put this code:
$("#txtAutocomplete").kendoAutoComplete({
filter: "contains",
minLength: 3,
dataSource: {
type: "json",
serverFiltering: true,
serverPaging: true,
pageSize: 20,
transport: {
read: "http://localhost:52054/MyService.svc/Autocomplete"
}
}
});
The WCF service can be called like:
http://localhost:52054/MyService.svc/Autocomplete/anyword
And it responds with an json file like this:
["abc1","abc2","abc3"]
But the autocomplete don’t Works, and I get multiple syntax errors in jquery.min.js
Any suggestion?
Thanks for your time!
Related
I would like to remove url option from the vue-dropzone, because I have my own logic in afterComplete function, that transfers the file and then makes an action to different API - meaning - As I'm loading the files manually, I don't need the post request here at all. However, after removing that option, the error occurs:
Error: No URL provided.
Dropzone:
<vue-dropzone
id="image-upload"
ref="imgDropZone"
:use-custom-slot="true"
:options="dropzoneOptions"
#vdropzone-thumbnail="filesAdded"
#vdropzone-complete="afterComplete"
>
<BaseButton>
Add images
</BaseButton>
</vue-dropzone>
Dropzone options:
dropzoneOptions: {
thumbnailWidth: 150,
thumbnailHeight: 150,
addRemoveLinks: false,
autoProcessQueue: false,
// should stay?
url: "https://httpbin.org/post",
acceptedFiles: ".jpg, .jpeg, .png"
}
Finally I ended up creating my own endpoint that returns mocked down response, only to satisfy dropzone:
files: {
file: ""
}
Maybe this is not the final, complete solution, but something you can do to get this working properly.
Having a HTTP rest like API that is rendering HAL responses (like spring-data-rest) i am searching for the best way to integrate an angular client that is using jquery datatables.
Is there any way to do this without lot of work?
I've been searching without success about this topic even when both datatables and spring-data-rest are very popular.
This is a 2 years old question, but here is how to do it:
$(document).ready(function() {
/* Init the files table */
var filesTable = $("#tags").DataTable({
"processing": true,
"ajax": {
"url": "/api/v2/tag/search/findCategoryTags",
"dataSrc": "_embedded.tags"
},
"columns": [
{ "data": "name" },
{ "data": "id" }
]
});
});
Use the dataSrc property for the Ajax. More info here.
One of the problems here is that you need to deal with the incompatibility of the pagination and sorting scheme on the spring-data-rest (HAL) and Datatables. Take a look at the function datatable2Rest (...) in this link:
https://github.com/gcase/spring-data-rest-datatable-example/blob/master/spring-data-rest-datatables.md
I am trying to dynamically retrieve the url after clicking on an item in a list.
The objective is to open the html page corresponding to clicked element.
Here is the code used:
Ext.define('FirstApp.view.Details',{
extend:'Ext.Panel',
xtype:'details',
requires: ['Ext.Ajax'],
config: {
listeners: {
activate: 'onActivate'
},
url: 'MyHtml.html' // Work fine if statically
url: '{link}', // But this doesn't work dynamically
tpl:'<h1>{link}</h1>' // However the desired data is displayed right here
},
onActivate: function(me, container) {
Ext.Ajax.request({
url: this.getUrl(),
method: "GET",
success: function(response, request) {
me.setHtml(response.responseText);
},
failure: function(response, request) {
me.setHtml("failed -- response: " + response.responseText);
}
});
}
Do you have an idea?
Thanks in advance for your help.
{link} works in tpl because the tpl property handles the string like an XTemplate. Your (custom) url property is just handled like a string.
Where exactly is {link} coming from? Since you are using a standard panel, I can only assume you are setting the data property on the panel with this link value. If so, just set the url at the same time via setUrl. Otherwise add a listener on updatedata, so that whenever your template data changes the listener is called and you can update the url.
I'm having strange problem with my store inside ExtJS. My ASP.NET MVC3 controller returns JSON:
My store:
Ext.define('MyApp.store.Users', {
extend: 'Ext.data.Store',
config: {
// I know the model works
model: 'MyApp.model.User',
storeId: 'Users',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'users/read',
reader: {
type: 'json',
root: 'users'
// also tried this
rootProperty: 'users'
}
}
}
});
Now, when I connect this store to the grid inside ExtJS 4.2.1, the grid shows TWO rows but without data. When I console.log(store) I see the data only inside raw property, not inside data property.
Does anyone know what's the problem? Why isn't there any mapping? The grid's dataIndex is also the same as Models fields (I've done this a thousand times with PHP, I don't know where is the problem here.)
One more thing I've tried. I've tried renderer: function(value) { console.log(value); } inside grid's columns and I was just getting undefined.
Edit: this is how the JSON actually looks like:
Try using root: 'users' not rootProperty. If not specified root defaults to ''.
Sencha Docs
SENCHA what the hell?! Sencha Touch 2 always says put everything in config?
Now when I do that in ExtJS, everything breaks?
I removed everything from config: {} and now it works great.
I'm using jquery datatables (datables.net) and I want to multiple columns filtering. My form is prepackaged and prepared. I do not want to use datables input filtering genereator.
any ideas?
you can use fnServerParams here the doc + example
another example :
$(document).ready(function() {
$('#example').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "script/server_showapply.php",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "nameOfparam", "value": $('#idOfInputForm').val() } );
}
});
});
the server-side :
you should have or something like (depends on server) Request['nameOfparam'] that will have the value of input from your form
for each ajax request of datatable that sends to you, all internal params (sEcho, iTotalRecords... + your custom params here "nameofparam", you can see them in the log network with your browser (ex Chrome F12 > Network > your request > header request > param send)).
Is it help you?