Hi,

I have two grids and what to dag items from "A" to "B" grid, also need to drag-drop within grid "B".

I looked at the treeview drag-drop example but not sure how to do this with Grid, also I don't want to move items from "A" to "B", more copy from "A" to "B".

A simple example would be great.

Two datepickers one the same page. Every time i try to set the first one to Jabuary it's jumping to the previous december:
<input id="datepickerF" value="" style="width:150px;">
<input id="datepickerT" value="" style="width:150px;">


$(document).ready(function() {

 $("#datepickerF").kendoDatePicker({
            
                        // defines the start view
                        startView: "year",

                        // defines when the calendar should return date
                        depth: "year",

                        // display month and year in the input
                        format: "MMMM yyyy",
          
                    });
 $("#datepickerT").kendoDatePicker({
                
      // defines the start view
                        startView: "year",

                        // defines when the calendar should return date
                        depth: "year",

                        // display month and year in the input
                        format: "MMMM yyyy",
                        });
    });



Marcus

I'm trying to filter a data source with the data bound to a remote source as per the Grid/Remote-data.html sample.
I've made some mods and nothing seems to happen. I'm trying to filters the results by ShipName.

I'm using a XML file returned from my server with a Data Source. The XML returned only contains a smidge of info on each item.

When applying a filter, is it possible if the filtering is done on the server, filter by a field that is not returned to the data source?
E.G. XML file doesn't contain weight of an item and I would like to apply a filter by weight?

Let's say I want to pre-expand a panel. How would I go about doing that? I tried to utilize the methods per the guide, but with all my efforts I still can't manage to do this. Could I get a direct example in basic html/javascript for how to pre-expand a panel or another method that panels support? I just don't get it :-/ (not a big js guy.)

I want to use kendo ui to crate multiple  bar charts in a page.  I am using the theme: "BlueOpal", however ,only the first chart has blue color, all the others are just black. I tested this page on IE, safari, opera, all work.
Is there anyone can give me a fix,thanks.

The code is blow:

function createChart()
  {                    
      $("#tabstrip-1").kendoChart({theme: "BlueOpal",
                              legend: { position: "bottom"},
                              seriesDefaults: { type: "column"},
                               series: [{ name:"samples", data: [58276, 57987, 96199, 59018, 54371, 73841, 71390], color:"red"}],
                              valueAxis: { labels: {format: "{0}"  }},
                              categoryAxis: { categories: ['2011/11/17', '2011/11/18', '2011/11/19', '2011/11/20', '2011/11/21', '2011/11/22', '2011/11/23'], labels:{rotation:3, format: "{0:C}"}},
                              tooltip: { visible: true, format: "{0}"}
                              });
                              
$("#tabstrip-2").kendoChart({theme: "BlueOpal",
                              legend: { position: "bottom"},
                              seriesDefaults: { type: "column"},
                               series: [{ name:"samples", data: [58276, 57987, 96199, 59018, 54371, 73841, 71390]}],
                              valueAxis: { labels: {format: "{0}"  }},
                              categoryAxis: { categories: ['2011/11/17', '2011/11/18', '2011/11/19', '2011/11/20', '2011/11/21', '2011/11/22', '2011/11/23'], labels:{rotation:2, format: "{0:C}"}},
                              tooltip: { visible: true, format: "{0}"}
                              });
}

I'm using the PanelTab but expanded by establishing a default item with class "k-state-active" is not working.
Any suggestions?

Script:

With Kendo UI, can one build apps for capturing GPS coordinates, saving to a database along with picture and text?  And also plotting multiple GPS points onto a map such as google maps?

Hi,

I am using CodeIgniter on my backend to return a JSON result, depending on parameters sent via a POST. I wanted to directly link the result to a Grid, via a DataSource. However, I am having problems either understanding DataSources, or how they pass parameters.

In the examples, you provide:

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            // the remote service URL
            url: "http://search.twitter.com/search.json",
            // JSONP is required for cross-domain AJAX
            dataType: "jsonp",
            // additional parameters sent to the remote service
            data: {
                q: function() {
                    return $("#searchFor").val();
                }
            }
        }
    }

 If I want to test this, I simply use a browser to check " " and it returns what would appear in the DataSource above.

The problem is that CodeIgniter does not accept parameters in the form of "?q=whatever" as standard. It can, however, accept GET and POST information.

How can I do it? I have a few theories:

1. set up the DataSource correctly to pass the parameters in a GET or POST (how?)
2. do not use a DataSource, but a javascript object to bind to the Grid (seems like a waste, how is this done?)
3. extend DataSource like you did with odata to make a special class that knows how to handle parameters in GET/POST.

What would you recommend?

I'm trying to validate the data sent to the server when I run an UPDATE operation.

I'll try to be clearer. Here's the code in detail:


Kendo Script
------------------

          <script>
                $(document).ready(function() {
                    
 
                    var Item = kendo.data.Model.define({
                        id: "id_student"
                    });
                    
                    var model = null; 


      var JsonDataSource = new kendo.data.DataSource({
                        transport: {
                            read: {
                                url: "students_read.php", 
                                dataType: "JSON"
                            },
                            create: {
                                url: "students_add.php", 
                                type: "POST"
                            },
                            update: {
                                url: "students_update.php",
                                type: "POST"
                            } ,
destroy: {
                                url: "students_delete.php",
                                type: "POST"
                            }
                        },
                        schema:{
                            model: Item
                        }
                    });




                  function onChange() {
                   
    var tr = this.select();
                        var id = tr.data("id");
                        model = this.dataSource.get(id);
                   
                        $("#id").val(model.get("id_student"));         
                        $("#name").val(model.get("name"));
                                   
                    }


                 $("#grid").kendoGrid({
                        autoBind: false,
                        dataSource:JsonDataSource,
                        height: 350,
                        selectable: "row",
                        pageable: false,
                        sortable: true,
                        scrollable: true,
                        change: onChange,
                        columns: [
                                  { title : "Id", field :"id_student"},
                                  { title : "Name", field :"name"}
                                ]
                    });
                    
                    $("#btn_load").click(function() {
                        JsonDataSource.read({name: $('#search').val()});
                    });
                    
                     $("#search").keydown(function(e) {
                        if (e.keyCode === kendo.keys.ENTER) {
                            JsonDataSource.read({name: $('#search').val()});
                        }
                    });
                    
                    $("#btn_add").click(function() {
                        $('#id').val(null);
                        $('#name').val(null);
                    });
                    
                    $("#btn_save").click(function() {
                        if ($('#id').val() == ''){
                            JsonDataSource.add({ aluno: $('#name').val() });
                            JsonDataSource.sync();
                            $('#search').val($('#name').val());
                            JsonDataSource.read({name: $('#search').val()});
                        }else{
                            model.set("aluno", $('#name').val());
                            JsonDataSource.sync();
                        }
                    });
                    
                    $("#btn_delete").click(function() {
                        JsonDataSource.remove(model);
                        JsonDataSource.sync();
                    });
                
                });
            </script>


HTML tags
---------------

       <div id="example" class="k-content">
            <div>
                Search:&nbsp;&nbsp;<input id="search" name="search" />
                <button id="btn_load">Load Data</button>
            </div><br/>
            <div id="grid"></div>
            <dl>
                <dt>Student:</dt><br/>
                <dd>Id:&nbsp;&nbsp;<input id="id" name="id" readonly="readonly"/></dd><br/>
                <dd>Name:&nbsp;&nbsp;<input id="name" name="name" /></dd><br/>
                <dd><button id="btn_add">New</button>&nbsp;&nbsp;&nbsp;<button id="btn_save">Save</button>&nbsp;&nbsp;&nbsp;<button id="btn_delete">Delete</button></dd>
            </dl>
       </div>
            
PHP script (students_update.php)
--------------------------------------------
<?php


$host = "localhost";
$username = "root";
$password = "root";
$db = "school";


$id_student = $_POST["id_student"];
$name = $_POST["name"];
        
    mysql_connect($host,$username,$password);
mysql_selectdb($db);

mysql_query("UPDATE students set name = '".$name."'  WHERE id_student = '".$id_student."'");
$result = array("result" => (mysqli_affected_rows >= 0)); 

echo json_encode($result);
?>


I wonder how to implement the code above to show the result of the UPDATE operation (if there was success or failure) via an alert (). example;


if (result == true) {
  alert("Sucess Update");
}else{
  alert("Fault Update");
}


The question is: How do I do this? Anybody could implement the code? The only thing missing to complete the example that full CRUD (Kendo + PHP) and send to the community.