Develop Reference

How To Retrieve More Than One "GetValue" From JSON/AJAX search

Ok, I'm struggeling with JSON, AJAX, Javascript and PHP.
Well, actually its only Javascript.
I want to have a input field which operates as a AutoSearch field.
I am using currently EasyAutoComplete.
But that doesnt really matter. What does matter is, that I have to choose one type from the JSON array to be searched. But I want to search both.
Just to make things clear:
- the user should be able to type in "abc" and "123" and find either the number "123456" or "School abc".
- When the user clicks on the result, in both cases the field value should be the number.
Javascript:
$(document).ready(function(){
var options = {
url: function(phrase){
console.log("autocomplete/autocomplete.php?term="+phrase);
return "autocomplete/autocomplete.php?term="+phrase;
},
highlightPhrase: false,
getValue: "instanz_id",
template: {
type: "description",
fields: {
description: "schulname"
}
},
list: {
hideAnimation: {
type: "slide",
time: 400,
callback: function(){}
},
match:{
enabled: true
}
}
};
$("#autocomplete").easyAutocomplete(options);
});
My database structure looks like:
"instanz_id", "schulname"
"123456", "DemoSchule"
Right now, if I type in "123" my JSON return string looks like this:
[{"instanz_id":"123456","schulname":"DemoSchule"}]
And my searchlist: "123456 - DemoSchule". When I click on it, 123456 is the new value of the input field.
How can I get the same item in the searchlist when typing e.g. "Dem" ?
I can change the getValue to "schulname" but then I cannot search using the number...
Can please someone send me in the right direction?

Kendo UI custom grid popup editor window only opens once

I would like to use a custom window as popup editor of a Kendo UI Grid. Its content will be complex with search fields and a grid to display search results. To do that, I don't want to use the Kendo template mechanism but a real popup window.
While doing tests with custom editor I faced an issue. Even with a very basic and simple scenario (just the create command), I'm only able to open the editor once. The second time I get an error, the editor doesn't show up anymore and the grid becomes empty.
Here is my HTML code :
<div id="main-content">
<div id="custom-window">
</div>
<table id="my-table-grid">
</table>
</div>
The JavaScript part :
function openCustomWindow(e) {
e.preventDefault();
myWindow.center().open();
}
function editorWindowClosed(e) {
myGrid.cancelRow();
}
var myWindow = $("#custom-window").kendoWindow({
modal: true,
resizable: false,
title: "Test",
visible: false,
close: editorWindowClosed
}).data("kendoWindow");
var dummyDataSource = new kendo.data.DataSource(
{
schema : {
model : {
id: "id",
fields: {
postion: { type: "number"},
name: { type: "string"},
}
}
}
});
dummyDataSource.add({postion: 1, name: "gswin"});
var myGrid = $("#my-table-grid").kendoGrid({
dataSource: dummyDataSource,
toolbar: [ {
name: "create",
text: "Create"
} ],
editable: {
mode: "popup",
window: {
animation: false,
open: openCustomWindow,
}
},
columns: [
{
field: "postion",
title: "Postion"
},
{
field: "name",
title: "Name"
}
]
}).data("kendoGrid");
The error message in the JavaScript console :
Uncaught TypeError: Cannot read property 'uid' of
undefinedut.ui.DataBoundWidget.extend.cancelRow #
kendo.all.min.js:29ut.ui.DataBoundWidget.extend.addRow #
kendo.all.min.js:29(anonymous function) #
kendo.all.min.js:29jQuery.event.dispatch #
jquery-2.1.3.js:4430jQuery.event.add.elemData.handle #
jquery-2.1.3.js:4116
And finally a jsfiddle link to show what I'm doing. (The popup is empty because I just want to fix the open / close mechanism before going any further)
I don't understand why I get this error, I expected to be able to open / close the popup as many time as I wanted. The default editor popup is working fine.

One of my colleague found the solution (thanks to him).
Actually this piece of code
editable: {
mode: "popup",
window: {
animation: false,
open: openCustomWindow,
}
}
is designed to configure the default popup...
The right way to use a custom popup is the following :
editable :true,
edit: openCustomWindow,
With this approach it's also better to use
function editorWindowClosed(e) {
myGrid.cancelChanges();
}
Instead of
function editorWindowClosed(e) {
myGrid.cancelRow();
}
Working jsfiddle link

Actually the approach in my previous answer solved my issue but is causing another issue. The grid becomes editable but in the default mode (which is "inline").
Doing this
editable: "popup",
edit: openCustomWindow
has fixed this other issue but is now displaying 2 popups.
I finally succeeded to hide the default popup and only show my custom popup but it ended with the orginal issue described in initial question...
Considering all those informations I arrived to the conclusion that working with a custom popup window is definitely not an option. I'll start working with teamplates instead.
Another solution would have been to use a template to override the toolbar with a custom "Add" button and use a custom command for edition. But at this point I consider that too "tricky".

To prevent Kendo UI custom grid popup editor window, define the editable property:
editable:
{
mode: "popup",
window: {
animation: false,
open: updateRowEventHandler
}
} // skip edit property
Then paste preventDefault() at the beginning of the handler:
function updateRowEventHandler(e) {
e.preventDefault(); //

How to reset onyx.Picker to pre selected state

I have an onyx.Picker which before selection displays a "Click to Select" button prompting the user for action. As is the expected behavior, once the user picks an option, they can not revert back to the "Click to Select" display. However, I need to be able to programmatically reset the form, in which case, the picker should once again revert to it's original state.
I have figured out that I can remove the picked option by calling this.$.PickerName.setSelected(null) However, the UI does not revert back to the "Click to Select" display as would be expected. How can I reset the picker completely?
Fiddle : http://jsfiddle.net/trex005/2amLu1r4/

As far as i am aware, setSelected() on the picker expects you to pass it a reference to the control (picker's clientControls) which you want to set dynamically ,so passing null will do nothing. Once an item is selected, the list of items closes, but the item stays selected and the pickerButton displays the choice that was made. So, all you have to do is this. this.$.pickerButton.setContent('Click to Select'); which will reset the pickerButton content.
http://jsfiddle.net/scrs3Le5/1/
enyo.create({
components: [{
kind: "onyx.PickerDecorator",
name: "DecoratorName",
components: [{
name:'pickerButton',
style: 'min-height:2.5rem;min-width:330px;',
content: "Click to Select"
}, {
kind: 'onyx.Picker',
name: 'PickerName',
components: [
{content: "Is broken"},
{content: "Is not cool"},
{content: "Is very very very very very very very cool!"}
]
}]
}, {
kind: 'Button',
ontap: 'ResetPicker',
content: 'ResetPicker'
}],
ResetPicker: function () {
//this.$.PickerName.setSelected(null);
this.$.pickerButton.setContent('Click to Select');
},
rendered: function () {
this.inherited(arguments);
}
}).renderInto(document.body);
Hope that helps!

Kendo Grid : Default value 1 in cell in inline edit mode, how to change it?

I have following config foo column in grid:
field:
actionName: {
editable: true,
nullable: true,
defaultValue: {"name" : "TEST123"},
type: "object"
},
Column:
{
field :"actionName",
title : $translate.instant('ACTIONNAME'),
width: "200px",
editor: GlobalHelperService.getActionNamesListForAutocomplete,
template: '#: data.actionName.name #',
filterable: { cell: { operator:"contains"
}
}
},
Which works almost fine, but if i clicked on cell item i always got following value (see. image below), instead of the text defined in template attribute.
How can i solve it please?
Many thanks for any advice.

It might not be the cleanest way, but you could use the edit event like I do in this blog post.
$("#grid").kendoGrid({
edit: onEdit
});
function onEdit(editEvent) {
// Ignore edits of existing rows.
if(!editEvent.model.isNew()) { return; }
editEvent.model.set("actionName", {name: "TEST123"});
}
Although as I note in that post, setting the default value with .set() might not work in this case, and you might need to edit the text in the edit box directly:
editEvent.container
.find("[name=actionName]")
.val("TEST123")
.trigger("change");

Incorrect display of values from the Look up SharePoint column field

Everything hi, I use search of sharepoint the list, I see information in case of a choice, but I can't understand to copy field value, look for in other, I instead of values quit an ID (1, 2, 3, 4...), it is necessary that in the field of "Title", it was copied in case of a choice information from the "Select" field why so occurs? I.e. if selected User from the list, User in the field shall be shown.
here code:
ExecuteOrDelayUntilScriptLoaded(LoadSLNCascade, "SP.js");
function LoadSLNCascade() {
$('#countries').SLN_SPcascadingdropdown(
{
relationshipList: "List",
relationshipParentList: "List",
relationshipParentListColumn: "First",
relationshipListChildColumn: "First",
relationshipListParentColumn: "Seccond",
childDropDown: "cities",
autoFillParentDropDownList: true,
defaulFillChildDropDownList: false,
promptText: "-- Select Value --"
});
}
$('#countries').change(function() {
$('#TitleField').val($(this).val());
});

This answer:
$(document).ready(function() {
$("#list").change(function() {
$("#field").val($('option:selected', this).text());
});
});