Hi there,

Since browsers have restrictions on the number of connections per domain/proxy, is there anyway that I could configure the upload widget to limit the maximum number of concurrent upload connections? This would allow other ajax calls to work while my long running asyn upload is running (which may range from 1-20 files).

Thank you!

If you guys can create a widget using a canvas that will allow a user to export canvas contents to a .png and/or .jpg file locally and/or a specific location on a server, suddenly, native apps become less important and the need to target WP7, W8/Metro, iOS and Android is mitigated (to a large extent).

Example: display a canvas, load pre-existing image, user draws lines over image, save image and user-input into new bitmap file (somewhere).

Furthermore, override the events that fire when a user touches a screen causing zoom-in/out and scrolling. Touching/dragging inside the "canvas widget" should invoke event to allow for manipulating that control/widget content only, similar to mouse-down, mouse-move and mouse-up...

Wrap that into a HTML5 widget...I'm signing up to Kendo right away.

Hello –

In an attempt to keep our Data and Business Logic on the server, we are generating our ViewModel data on the server and transporting them to the browser via using JSON. Once received, we extend that data onto a kendo.observable object using jquery's extend() method and then bind that to our DOM using the kendo.bind method. When we change the value of any input, we refresh the ViewModel by sending it back to the server. The server processes or commits any changes that it detects and sends us an updated ViewModel with any updated data/results. Yes, we realize that sending the entire ViewModel back, instead of just what changed could be considered inefficient, but we’re still in Proof-of-Concept mode.

The Problem

For the most part, our methodology seems to be working on all properties using simple data types (e.g. string, integer, decimals, etc). However, once we start introducing collections (or arrays), we start running into issues.

Scenario 1 – It Works!

Code can be seen and run at this JS Fiddle:
http://jsfiddle.net/mikejoseph23/QuGgy/

Since interacting with a web service would be tricky using, JS Fiddle, I’m emulating the same thing that’s happening by creating 3 different sets of data which represents ViewModels being pulled from the server in JSON format. The Refresh button simply cycles through them, but once implemented, this method would be requesting an updated ViewModel data set on the server based on any changes passed in.

Pressing the Refresh button works as expected. I can rebind to an updated viewModel (kendo observable) object with no problem.

Scenario 2 – FAIL!

Code can be seen and run at this JS Fiddle:
http://jsfiddle.net/mikejoseph23/wcPNp/

In this next sample, I changed the ViewModel data to use the following structure instead and instead of binding to individual input elements, I’m binding to a select dropdown.

The first press of the Refresh button works as expected, but the second press gives me the following error in Chrome:

Kendo.all.min.js:11
Uncaught TypeError: Object Negril, Jamaica,Cancun, Mexico,Key West, FL has no method 'unbind'

I can’t figure out why! Any help or advice would be greatly appreciated!

Thanks!!

I'm trying to integrate with an existing component feeding Json data in cross site environment. The grid works in Chrome, but fails to populate in IE. Using version 9 of Internet Explorer. I provided several examples below to demonstrate which code works and which doesn't.

I also attached the code with supporting files.

Please help.



<script>
// Code downloaded from http://demos.kendoui.com/web/grid/index.html
var alerts = 
{
"startIndex":0,
"count":25,
"entry": [
{"AlertId": 111},
{"AlertId": 222},
{"AlertId": 333},
{"AlertId": 444},
{"AlertId": 555},
{"AlertId": 666},
{"AlertId": 777}
]
};

$(document).ready(function() {
// Example 1. Works. Taken from http://docs.kendoui.com/howto/bind-the-grid-to-remote-data.
var ds1 = new kendo.data.DataSource({
transport: {
read: {
url: "https://api.instagram.com/v1/media/popular?client_id=4e0171f9fcfc4015bb6300ed91fbf719&count=2",
dataType: "jsonp"
}
},
pageSize: 5,
schema: {
 data: "data"
}
});

// Example 2. Fails in IE and Chrome with jsonp. No headers, no data.
// Works in Chrome and fails in IE with json.
var ds2 = new kendo.data.DataSource({
transport: {
read: {
url: "http://10.60.71.140/CoreRESTServices/Core.svc/alerts?fields=AlertId",
dataType: "jsonp"
}
},
pageSize: 5,
schema: {
 data: "entry"
}
});

// Example 3. Fails in IE, and works in Chrome. IE headers, but no data.
var ds3 = new kendo.data.DataSource({
type: "jsonp",
transport: {
read: {
url: "http://10.60.71.140/CoreRESTServices/Core.svc/alerts?fields=AlertId"
}
},
pageSize: 5,
schema: {
data: "entry"
}
});

// Example 4. Works.
var ds4 = new kendo.data.DataSource({
data: alerts,
pageSize: 5,
schema: {
 data: "entry"
}
});


// Initialize the grid.
$("#grid").kendoGrid({
dataSource: ds4
});
});
</script>

When using local data, my drop down list properly displays the value text in a field that contains the lookup value (integer).  However, when I try using a kendo.data.datasource to get the values from a database, the control no longer works for the basic grid display (the dropdown does populate correctly when in edit mode or adding a new record).

I'm missing something, but not sure what.  Here is the code:

           <div id="grid">

            </div>

 

<script>

             

    //works

    var relationshipDataSourcex = [{ kiRelationship: 2, RelationshipText: 'Item 2' },{ kiRelationship: 3, RelationshipText: 'Item 3'}, { kiRelationship: 4, RelationshipText: 'Item 4'}, { kiRelationship: 5, RelationshipText: 'Item 5'}]

     

    // does not work when getRelationship function called from grid (returns N/A), works when grid is in edit/insert mode

    var relationshipDataSource = new kendo.data.DataSource({

                transport: {

                    read: {

                        url: "data/relationshiplistJson.asp",

                        dataType: "json"

                            }

                            },

                schema: {

                data: "relationshiplist",

                    model: {

                        id: "kiRelationship",

                        fields: {

                            kiRelationship: { type: "number" },

                            RelationshipText: { type: "string" }

                                     

                            }

                    }

                }

                });

     

        // read does not seem to matter      

       // relationshipDataSource.read

       relationshipDataSource.query

 

        function getRelationship(kiRelationship) {

        for (var i = 0; i < relationshipDataSource.length; i++) {

            if (relationshipDataSource[i].kiRelationship == kiRelationship) {

                return relationshipDataSource[i].RelationshipText;

            }

        }

        return "N/A";

        }  

 

    function relationshipDropDownEditor(container, options) {

        $('<input data-text-field="RelationshipText" data-value-field="kiRelationship" data-bind="value:kiRelationship" />')

            .appendTo(container)

            .kendoDropDownList({

                autoBind: false,

                dataSource: relationshipDataSource

            });

    };  

                   

    $(document).ready(function () {

                relationshipDataSource.read();

                dataSource = new kendo.data.DataSource({

                transport: {

                    read: {

                        url: "data/respondentlistJson",

                        dataType: "json"

                        },

                    update: {

                        url: "data/respondentlistUpdate",

                        dataType: "POST"    ,                      

                        },

                     create: {

                        url:  "data/respondentlistUpdate",

                        dataType: "POST"

                    },

                    parameterMap: function(options, operation) {

                        if (operation !== "read" && options.models) {

                            return {models: kendo.stringify(options.models)};

                        }

                    }

                },

                batch: true,

                pageSize: 50,

                autoSync: false,

                             

                schema: {

                data: "respondentlist",

                    model: {

                        id: "kiRespondent",

                        fields: {

                            kiRelationship: { type: "number", editable: true, defaultvalue: 2 },

                            cName: { type: "string" ,validation: { required: true } },

                            cEmail: {type: "string"},

                            }

                    }

                }

            });

 

        $("#grid").kendoGrid({

            dataSource: dataSource,

            selectable: "row",

            pageable: true,

            sortable: true,

            scrollable: true,

            height: 800,

            toolbar: ["create"],

            columns: [

                { field: "cName", title: "Respondent Name", format: "{0:c}", width: "150px"} ,

                { field: "cEmail", title: "Email", format: "{0:c}", width: "150px"} ,

                { field: "kiRelationship", width: "150px",

                            editor: relationshipDropDownEditor,

                            template: '#= getRelationship(kiRelationship) #'

                            },

                                                  

                { command: ["edit", "destroy"], title: " ", width: "210px" }],

                editable: "inline" 

        });

               

    });

                 

</script>

I have been using an older version of kendo ui mobile, due to a bug I found in the old version of Kendo ui mobile, I had to upgrade to the latest in the latest one (went from v2012.2.913 to v2012.3.1114).  I have been using the mockjax library to mock the server responses to ajax calls, however in the latest version the mock is not getting hit.  Am I doing something improper in the code or is there a better way to accomplish this testing?

Here is an example of my previous setup:
mockjax:

View model code with a datasource

I am trying to work up a mobile app similar to your sushi demo.  I've attached a stripped version of what I'm working on.  I'm having a problem getting the data I want to edit to display.  For my data I am using a temporary webapi app to feed the mobile app data.  I'm getting data just fine and retrieve the record object I want, but can't set the values I need to edit.  The function below is where I get the data, and it is there, but I can't set the values.  When the view displays, the fields are empty.  I tried setting up like the sushi demo with it's detail view and template, but calling view.scrollerContent.html with the template and data never worked for me, it would not even display the view.  How else can I either set the values for edit or use a template to do this?  Thanks.

  function getCompanyPackageForEdit(e) { 
     var view = e.view; 
     var package = dsPackage.get(view.params.id); 
     //alert("package: " + package.Description + " default weight: " + package.DefaultWeightFactor + " weight: " + package.WeightFactor); 
 
     $("#editDefaultWeight").html(package.DefaultWeightFactor); 
     $("#editWeight").html(package.WeightFactor); 
     $("#editMaxCount").html(package.MaxCountPerDay); 
 
  } 
   

When I run IE 9 in compatibility mode, the gradient styles are lost.  I guess this is a problem with ie8+ compatibility mode or ie7.

Is there a workaround so the gradients are shown?

Thanks

Michael

The pie chart does not seem to be able to handle negative values, the graph distorts completely if a negative value is introduced. Any way around this?

Sample data below:

   var data_by_location = [
                          { "location": "IN", "year": 2012, "month": 1, "revenue": 18228 },
                          { "location": "TX", "year": 2012, "month": 1, "revenue": 15014 },
                          { "location": "KY", "year": 2012, "month": 1, "revenue": 16898 },
                          { "location": "MI", "year": 2012, "month": 1, "revenue": 12186 },
                          { "location": "CA", "year": 2012, "month": 1, "revenue": -9945 }
                          ]

I'm including the code for the pie chart below but everything is pretty standard:

  $(document).ready(function () {
                $("#piechart").kendoChart({
                    dataSource: data_by_location,
                    seriesDefaults: {
                        type: "pie",
                        labels: {
                            visible: true,
                            template: "#= category # - #=kendo.format('{0:p}', percentage) # "
                                 }
                    },
                    title: {
                        text: "Monthly Revenue per Location"
                    },
                    legend: {
                        position: "bottom"
                    },
                    series: [{
                        field: "revenue",
                        categoryField: "location"
                    }],
                    tooltip: {
                        visible: true,
                        format: "N0"
                    }
                });

Hi , I 'd like to ask if its possible to have a single footer with icons centered in a page with splitview and how , so far I have only managed to have 2 separate footer for splitview page