Questions on Kendo UI for jQuery Forum

3 answers

983 views

Hey there,

I was wondering if you can explain to me why I get the following error:

"d.name is undefined"

JS:
$(function () {
    $("#id_purchase_place").kendoAutoComplete({
        minLength:3,
        dataTextField:'name',
        dataSource:{
            serverPaging:true,
            pageSize:20,
            contentType:'application/json; charset=utf-8',
            type:'GET',
            dataType:'json',
            transport:{
                read:'/purchases/ajaxpurchase_place/'
            }
        }
    })
});

JSON RESPONSE

[{"name": "Woolies"}, {"name": "Bunnings"}]

AutoComplete

answered on 13 Sep 2012

0 answers

111 views

Where are my parents? (Passing context data to a file upload)

I have many KendoFile controls that are dynamically created using a loop. They all work, and upload files. But for each one I need to know their unique ID (which I pass back to the handler). However when the upload event fires I can't seem to traverse to find parents.

So the way I get the ID now is to register a click event, and put the val into a global variable. This works for normal uploads. But it all fails for drag and drop.

First I write one upload control per round

<asp:Repeater ID="Repeater1" runat="server">

<ItemTemplate>

<div class="roundSectionHeader">

<span class="uploadwrapper" data-roundid="<%# Eval("ID") %>">

<input type="file" ID="LayoutUpload<%# Eval("ID") %>" class="kendoFileLayout" />

</span>

</div>

</ItemTemplate>

</asp:Repeater>

Then I wire it up.

$(".kendoFileLayout").kendoUpload({

async: {

saveUrl: "../Handlers/UploadPDF.ashx",

removeUrl: "../Handlers/RemovePDF.ashx",

autoUpload: true

},

success: onSuccessLayout,

upload: function onUploadLayout(e) {

e.data = { jobid: pageValues.jobId, jobroundid: layoutRoundId, fullname: globalValues.fullName };

}

});

But to get layoutRoundId I wire a click event

$(".uploadwrapper").click(function () {

layoutRoundId = $(this).data("roundid");

});

This works, but I cannot get a good event for the drop event. Also once I am inside the kendoUpload event I seem to lose context and cannot reference parents or siblings

Upload

asked on 12 Sep 2012

0 answers

115 views

Bubble Chart: sizeField not working when data is grouped

I have a bubble chart shown below. It works ok, except the sizeField is not sizing appropriately. If I remove the grouping, the sizeField will work correctly, but I will not see the data grouped how I would like it. (Comment out the "group:" section to see difference).

Is this a bug or a problem in my code?

<script>

var Productivity = [

{

perHour: 1100,

score: 5.25,

units: 49610,

area: "Territory 31",

year: 2012

},

{

perHour: 800,

score: 8.53,

units: 304197,

area: "Territory 32",

year: 2012

},

{

perHour: 965,

score: 8.62,

units: 13403,

area: "Territory 33",

year: 2012

},

{

perHour: 785,

score: 7.97,

units: 125007,

area: "Territory 34",

year: 2012

},

{

perHour: 690,

score: 8.04,

units: 137459,

area: "Territory 36",

year: 2012

},

{

perHour: 1050,

score: 7.9,

units: 214197,

area: "Territory 42",

year: 2012

},

{

perHour: 705,

score: 5.2,

units: 95403,

area: "Territory 43",

year: 2012

},

{

perHour: 1190,

score: 9.8,

units: 425007,

area: "Territory 44",

year: 2012

},

{

perHour: 250,

score: 4.5,

units: 189592,

area: "Territory 46",

year: 2012

}

];

function createChart() {

$("#chart").kendoChart({

dataSource: {

data: Productivity

,group: {

field: "area"

}

},

series: [{

name: "Accuracy vs. Productivity",

type: "bubble",

xField: "perHour",

yField: "score",

sizeField: "units"

}]

,tooltip: {

visible: true,

format: "{2:N0} units",

opacity: 1

}

});

}

$(document).ready(function() {

setTimeout(function() {

// Initialize the chart with a delay to make sure

// the initial animation is visible

createChart();

$("#example").bind("kendo:skinChange", function(e) {

createChart();

});

}, 400);

});

</script>

Charts

asked on 12 Sep 2012

0 answers

151 views

Telerik Fluent API

Hi,

I'm having trouble using the Fluent API to create my treeview. Both Template and CheckboxTemplate do not seem to affect my nodes that have been created through BindTo. Special characters in the templates are also resulting in their escaped source code representations such as "\u0027". Can you guys please provide some advice and perhaps an example of a databound TreeView created through the Fluent API that uses checkboxes? Thanks.

Reposted in the MVC forum. Sorry. Please delete this one.

TreeView

asked on 12 Sep 2012

2 answers

336 views

load the menu dynamically using datasource or json

hi,
I want to load the menu dynamically using Hierarchical data Source.can u provide some sample code to load menu dynamically using hierarchical data Source.

Menu

answered on 12 Sep 2012

2 answers

304 views

Disable Switch

Hi, how do I disable a switch in Kendo Mobile?

I am using the following html:
<input data-role="switch" id="KeepMeSignedIn" name="KeepMeSignedIn" type="checkbox" disabled="true"></input>

Thanks in advance

Switch (Mobile)

answered on 12 Sep 2012

6 answers

346 views

Pull to refresh with endless scrolling

Hi,

Is there a way to capture the 'pullToRefresh' event so I can clear out my 'pageSize / page' variables?

The issue is this:

If you have endless scroll enabled and scroll down to load the next page, when you scroll back up and drag down to activate the pull to refresh function, the ajax request is sent with the parameters used for the pagination.

var datasource = new kendo.data.DataSource( {

serverPaging: true,

pageSize: 30,

page: 1,

transport: {

read: {

url: url,

datatype: 'jsonp'

},

parameterMap: function (options) {

console.dir( options );

var parameters = {

st: ( options.page - 1 ) * options.pageSize

}

return parameters;

}

},

schema: {

data: function (data) {

return data;

},

total: function (data) {

return data.count; // total number of items

}

} );

I need to send an offset (st) rather than a page number to the database but regardless, when I pull to refresh, I'd like to reset those values.

Thanks!

ListView (Mobile)

answered on 12 Sep 2012

0 answers

88 views

Change Page Event

Hi,

How can I drive the change page event in a pageable grid ???

Thanks in advance

Grid

asked on 12 Sep 2012

0 answers

231 views

Pattern Match

I am using the pattern attribute to do validation on a textbox I am using ^http expression to make sure the text entered starts with http but it doesn't seem to work properly. The only valid input is http exactly here is the html being rendered -

<input class="k-textbox k-textboxAd1" id="id" name="name" pattern="^http" type="text" validationmessage="Please enter a valid URL it must begin with http(s)" value="" />

Am I doing something wrong?

Validation

asked on 12 Sep 2012

2 answers

806 views

Binding custom parameter map to WebAPI

Hi,

I've been having issues binding a custom parameter map to an ASP web api method. I basicly have a kendo grid with a delete button. But by default if I click the delete button it sends the whole data source model for the row as a request. I want it to send just the ID because thats all I need. While its set to the default and I have a viewModel as a input parameter for the web api delete method with the same properties as the data source model everything works fine. I wrote a parameter map that in case of destroy only sends the userID and observed the network request. The ID gets sent fine, but the web API method returns an error that the non nullable input parameter is a null. So it didn't bind right. Anybody had experience with this?

This is the important part of my data source, where you can see the model, parameter map and destroy method, I should note that I also tried using kendo stringify on the return for the parameter map that didnt help.

var viewModel = kendo.observable({

teamMembersSource: new kendo.data.DataSource({

transport: {

read: {

url: '@(Url.Action("Get", "TeamMembers", new { Area = "API" }))',

data: {

companyID: '@(((Signuper.WebApp.Infrastructure.SignuperProfessional)User).CompanyID)'

}

},

destroy: {

url: '@(Url.Action("Delete", "TeamMembers", new { Area = "API" }))',

type: "DELETE",

datatype: "json",

},

parameterMap: function (options, type) {

if (type == "destroy") {

return { ID: options.UserID };

}

else

return options;

}

},

schema: {

model: {

id: "UserID",

fields:

{

UserID: { type: "number"},

FirstName: {type: "string"},

LastName: {type: "string"},

Gender: {type:"string"},

CompanyID: { type: "number" },

EmailAdress: { type: "string" },

IsCompanyAdmin: { type: "boolean" },

DateOfBirth: { type: "Date" }

}

},

data: "TeamMembers",

total: "TotalCount"

},

This is the code for my web Api method, pretty simple:

public dynamic Delete(long ID)

{

var user = membership.GetProfessional(ID);

if (user == null)

return new { success = false, errors = "The user that is set to be deleted cannot be found" };

if (ID == ((Signuper.WebApp.Infrastructure.SignuperUser)User).UserID)

return new { success = false, errors = "You cannot delete the currently logged in user" };  // You cant delete your own user

if (((Signuper.WebApp.Infrastructure.SignuperProfessional)User).CompanyID != user.CompanyID)

return new { success = false, errors = "You cannot delete the user of a different company" };

membership.DeleteUser(ID);

return new { success = true, errors = "You cannot delete the user of a different company" };

}

And I've attached a picture with my http request, the response is: {"Message":"The request is invalid.","MessageDetail":"The parameters dictionary contains a null entry for parameter 'ID' of non-nullable type 'System.Int64' for method 'System.Object Delete(Int64)' in 'Signuper.WebApp.Areas.API.Company.Controllers.TeamMembersController'. An optional parameter must be a reference type, a nullable type, or be declared as an optional parameter."} One final thing to note is that i first named the parameter on the web api method and in the parameter map UserID instead of ID as it is now. When it's like that I get a different webAPI error saying simply that no webAPI method that matches my parameters can be found.

Thanks in advance to anybody that can help!

Data Source

answered on 12 Sep 2012