or
1 answer
384 views
I followed the tutorial, part 2 hello services. I wanted to extend the example and use it in a real world app that I am putting together. But I am having a issue. Here is my json data returned from my service:
Here is my js:
I want the datasource in an external var so I can ref other bit of information in it. In the end, I want a page with the customer name and customer id and the grid with each branch location and available quantity. Everything I've been reading suggest the datasource can not be a complex object. Is this true? What would be the best approach for me to take to get my results?
Thanks!
[{"CustomerId":"60506","CustomerName":"WILLIAMS COMFORT AIR ","PartNumber":"34.120. ","Vnd":"PV","SellPrice":" 1.45","UM":"EA ","Branches":[{"Id":2,"AvailQty":0,"Status":"A","Location":"St. Louis"},{"Id":3,"AvailQty":100,"Status":"A","Location":"Paducah"},{"Id":4,"AvailQty":138,"Status":"A","Location":"Ft. Wayne"},{"Id":5,"AvailQty":685,"Status":"A","Location":"Indianapolis"},{"Id":6,"AvailQty":185,"Status":"A","Location":"Louisville"},{"Id":7,"AvailQty":132,"Status":"A","Location":"Lexington"},{"Id":8,"AvailQty":2,"Status":"A","Location":"Evansville"}]}]<script> var dataSource = null; $(function () { }); function Lookup() { var customer = $("#customer").val(); if (customer == "") { customer = "60506"; } dataSource = new kendo.data.DataSource({ transport: { read: { url: "api/part/", data: { partnumber: $("#part").val(), customer: customer } } } }); dataSource.read(); $("#partsGrid").kendoGrid({ groupable: true, sortable: true, dataSource: { data: dataSource.data()[0].Branches, schema: "Branches"/*{ model: mySchema }*/ }/*, columns: [{ field: "CustomerId", title: "Id" }, { field : "CustomerName", title : "Name" }]*/ }); }</script>Thanks!
Daniel
Telerik team
answered
on
23 Sep 2013
2 answers
94 views
Hi
I have bar charts and i am implementing drill downs in the chart. There are cases where there will be no data in the drill down and at such times the screen will be blank with no indications. Is there a way to fix it?
I have bar charts and i am implementing drill downs in the chart. There are cases where there will be no data in the drill down and at such times the screen will be blank with no indications. Is there a way to fix it?
13 answers
415 views
This:
<div id="splitter">
<div id="left">Left pane</div>
<div id="right"><iframe></iframe></div>
</div>
allows moving the splitter over the left, but gets lost when hovering over the iframe area.
How can you capture the mouse or set the z-index or whatever to capture the resize over the iframe.
[btw, it works if you are above or below the iframe part - just not over]
thx
<div id="splitter">
<div id="left">Left pane</div>
<div id="right"><iframe></iframe></div>
</div>
allows moving the splitter over the left, but gets lost when hovering over the iframe area.
How can you capture the mouse or set the z-index or whatever to capture the resize over the iframe.
[btw, it works if you are above or below the iframe part - just not over]
thx
Dimo
Telerik team
answered
on
23 Sep 2013
4 answers
241 views
Hello Dimo,
thanks for your reply, which allowed me a leap forward.
Now I understand that to get events from the kendo window in the code-behind I must append the window to the form and
why initially the window is outside.
I added appendTo("form#myform") as configuration option in the creation of the window.The window has a button.
Now I have only one window and I get the button click event in the code-behind.
I have a further question though:
1.
Still I think I'm confusing jquery appendTo and kendowindow appendTo.
The kendowindow appendTo(form) is a configuration option when I create the window. If I create the window without this option,
in the javascript button handler I will call always the jquery appendTo(form) which will always duplicate the window correct ?
So My only option then is to appendTo(form) when I create the window, correct ?
2.
Now the close doesn't give any error but I have the following situation:
Javascript handler
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#dialogLogout").kendoWindow({
draggable: true,
height: "300px",
modal: true,
resizable: false,
width: "600px",
actions: ["Minimize", "Maximize", "Close"],
appendTo: "form#form1"
});
var wnd = $("#dialogLogout").data("kendoWindow");
$("#btnLogoutConfirmOK").bind("click", function () {
// window.parent.$("#dialogLogout").data("kendoWindow").close();
// $("#dialogLogout").closest(".k-window-content").data("kendoWindow").close();
$("#dialogLogout").data("kendoWindow").close();
});
});
</script>
The code behind is something like this (I added a sleep of 5 seconds to simulate a long operation).
protected void btnLogoutConfirmOK_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep((int)System.TimeSpan.FromSeconds(5).TotalMilliseconds);
}
The behavior seems
I click the button, the javascript handler is called,
The window closes, either of the 3 close statements give the same effect,
the server-side handler is called, waits for 5 seconds, it returns and forces the reopen of the window.
How can I close the window programmatically ?
Thank you for your kind attention,
best regards
Marco
thanks for your reply, which allowed me a leap forward.
Now I understand that to get events from the kendo window in the code-behind I must append the window to the form and
why initially the window is outside.
I added appendTo("form#myform") as configuration option in the creation of the window.The window has a button.
Now I have only one window and I get the button click event in the code-behind.
I have a further question though:
1.
Still I think I'm confusing jquery appendTo and kendowindow appendTo.
The kendowindow appendTo(form) is a configuration option when I create the window. If I create the window without this option,
in the javascript button handler I will call always the jquery appendTo(form) which will always duplicate the window correct ?
So My only option then is to appendTo(form) when I create the window, correct ?
2.
Now the close doesn't give any error but I have the following situation:
Javascript handler
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#dialogLogout").kendoWindow({
draggable: true,
height: "300px",
modal: true,
resizable: false,
width: "600px",
actions: ["Minimize", "Maximize", "Close"],
appendTo: "form#form1"
});
var wnd = $("#dialogLogout").data("kendoWindow");
$("#btnLogoutConfirmOK").bind("click", function () {
// window.parent.$("#dialogLogout").data("kendoWindow").close();
// $("#dialogLogout").closest(".k-window-content").data("kendoWindow").close();
$("#dialogLogout").data("kendoWindow").close();
});
});
</script>
The code behind is something like this (I added a sleep of 5 seconds to simulate a long operation).
protected void btnLogoutConfirmOK_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep((int)System.TimeSpan.FromSeconds(5).TotalMilliseconds);
}
The behavior seems
I click the button, the javascript handler is called,
The window closes, either of the 3 close statements give the same effect,
the server-side handler is called, waits for 5 seconds, it returns and forces the reopen of the window.
How can I close the window programmatically ?
Thank you for your kind attention,
best regards
Marco
2 answers
177 views
Hi guys, as per title, I have setup a simple demo menu from the examples and added a select event. This works in Firefox 24, Chrome 29 (29.0.1547.76), but the event does not fire in IE 11.0.9600 UNLESS you select Compatibility Mode, then all is fine.
Code:
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="Content/Css/default.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<!-- Common Kendo UI Web CSS -->
<link href="Content/Css/kendo.common.min.css" rel="stylesheet" />
<!-- Default Kendo UI Web theme CSS -->
<link href="Content/Css/kendo.default.min.css" rel="stylesheet" />
<!-- Kendo UI Web combined JavaScript -->
<script type="text/javascript" src="js/debug/kendo.web.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#menu").kendoMenu({
select: function (e) {
// handle event
alert('clicked');
}
});
});
</script>
</head>
<body>
<ul id="menu">
<li>Normal Item
<ul>
<li><span class="k-sprite icon-class"></span>Item with a Sprite</li>
<li><img src="Icons/contacts.gif" />Item with an Icon</li>
</ul>
</li>
<li><a href="http://www.google.com">Navigation Item</a></li>
<li class="k-state-active">Active Item</li>
<li>Template Item
<div class="k-group k-content">
Test button - <a class="k-button">Button</a>
</div>
</li>
</ul>
</body>
Any ideas please?
Simon
Code:
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="Content/Css/default.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<!-- Common Kendo UI Web CSS -->
<link href="Content/Css/kendo.common.min.css" rel="stylesheet" />
<!-- Default Kendo UI Web theme CSS -->
<link href="Content/Css/kendo.default.min.css" rel="stylesheet" />
<!-- Kendo UI Web combined JavaScript -->
<script type="text/javascript" src="js/debug/kendo.web.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#menu").kendoMenu({
select: function (e) {
// handle event
alert('clicked');
}
});
});
</script>
</head>
<body>
<ul id="menu">
<li>Normal Item
<ul>
<li><span class="k-sprite icon-class"></span>Item with a Sprite</li>
<li><img src="Icons/contacts.gif" />Item with an Icon</li>
</ul>
</li>
<li><a href="http://www.google.com">Navigation Item</a></li>
<li class="k-state-active">Active Item</li>
<li>Template Item
<div class="k-group k-content">
Test button - <a class="k-button">Button</a>
</div>
</li>
</ul>
</body>
Any ideas please?
Simon
2 answers
409 views
is there a way to sort a ListView or the DataSource?
don't want to use group because i don't need the title of it.
i'm getting the data from sqlite and i don't have sorting information in DB, i need to generate it first.
don't want to use group because i don't need the title of it.
i'm getting the data from sqlite and i don't have sorting information in DB, i need to generate it first.
domiSchenk
Top achievements
Rank 1
Rank 1
answered
on
23 Sep 2013
3 answers
262 views
Is there something I can do to force a keyboard to disappear when a drawer is opened? I haven't tested on iOS yet, but on android with my app I have an issue if an input has focus and the keyboard is shown swiping to open the drawer will leave the keyboard open. It was my understanding that this is a function of the input still having focus. I have tried a few different techniques to dismiss the keyboard, '$( document.activeElement ).blur();' didn't work and neither did '$( "input:focus" ).blur();' I read a post on stack overflow where someone tried setting focus on a checkbox to cause the keyboard to be removed, but that didn't help either.
Anybody know of a way to handle this?
-David
Anybody know of a way to handle this?
-David
Petyo
Telerik team
answered
on
23 Sep 2013
1 answer
91 views
When will the theme builder be updated?
There's no scheduler in there at all, and I find I can change my colors, but then it's missing some on the merge. So if I style out all the blue on "flat" and combine it all with the template there's still blue elements.
Can you also enhance it such that it'll annotate the elements on the page that the style will change?...like if I hover on the theme element\color border appear overlayed on the page elements?
Steve
There's no scheduler in there at all, and I find I can change my colors, but then it's missing some on the merge. So if I style out all the blue on "flat" and combine it all with the template there's still blue elements.
Can you also enhance it such that it'll annotate the elements on the page that the style will change?...like if I hover on the theme element\color border appear overlayed on the page elements?
Steve
Alex Gyoshev
Telerik team
answered
on
23 Sep 2013
3 answers
216 views
I want to retrieve bar code in byte array form, is this possible?
If not what other options could be?
Please reply ASAP.
Thanks,
Mahesh A
If not what other options could be?
Please reply ASAP.
Thanks,
Mahesh A
Petur Subev
Telerik team
answered
on
23 Sep 2013
1 answer
95 views
We are using the grid in a MVC app. I can get the Read, Update and Delete functions to work without issue. However every time we try to do an insert the entity being passed to the controller is null. Here is the code:
OData Controller:
Index.cshtml:
I have found tons of articles and examples using the ActionLinks, but nothing that would seem to tell me why this call to Create would not work.
Thanks for any help you can provide.
Chuck
OData Controller:
protected override BroadcastEventViewModel CreateEntity(BroadcastEventViewModel entity) { var bcEvent = new Model.BroadcastEvent() { Id = entity.Id, Name = entity.Name, StartDate = entity.StartDate, EndDate = entity.EndDate }; _repository.InsertBroadcastEvent(bcEvent); return entity; }var crudServiceBaseUrl = "/odata/BroadcastEvents"; var pledgesModel = kendo.observable({ dataSource: broadcastEventDataSource = new kendo.data.DataSource({ type: "odata", transport: { create: { url: crudServiceBaseUrl, dataType: "json", }, read: { url: crudServiceBaseUrl, dataType: "json" }, update: { url: function (data) { return crudServiceBaseUrl + "(" + data.Id + ")"; }, dataType: "json" }, destroy: { url: function (data) { return crudServiceBaseUrl + "(" + data.Id + ")"; }, dataType: "json" } }, batch: false, serverPaging: true, serverSorting: true, serverFiltering: true, pageSize: 5, schema: { data: function (data) { return data.value; }, total: function (data) { return data["odata.count"]; }, errors: function (data) { }, model: { id: "Id", fields: { Id: { type: "number", editable: false, nullable: true }, Name: { type: "string" }, StartDate: { type: "datetime" }, EndDate: { type: "datetime" }, } } }, error: function (e) { var response = e.xhr.responseJSON; var message = response.Message; //if (e.xhr.responseJSON["odata.error"].Message != null) { // message = e.xhr.responseJSON["odata.error"].Message; //} alert(message + "\n\n"); } }) }); $("#broadcastEventGrid").kendoGrid({ dataSource: broadcastEventDataSource, toolbar: ["create", "save", "cancel"], sortable: false, pageable: true, filterable: false, columns: [ { field: "Id", title: "ID", width: 150 }, { field: "Name", title: "Name", width: 200 }, { field: "StartDate", title: "Start Date", width: 200 }, { field: "EndDate", title: "End Date", width: 200 }, { command: ["edit", { name: "Details", click: function (e) { // var tr = $(e.target).closest("tr"); //var data = this.dataItem(tr); alert("Details for: " + e.target); } }], title: "Action", } ], editable: { createAt: "bottom", mode: "inline" } });Thanks for any help you can provide.
Chuck
Nikolay Rusev
Telerik team
answered
on
23 Sep 2013
