Telerik Forums
Kendo UI for jQuery Forum
1 answer
506 views
Hello to everyone, I'm getting trouble with odata and datasource. I've an entity wich has a lot of date time fields wich are exposed by a grid. When I try to make an update i got this error: 
400 Bad Request
 
The field xxxx cannot be converted to DateTime etc etc...... string is not a valid date time value.  
Looking to POST request I've seen that the key /value pairs have this format: 
"Expiry_Date":"/Date(-6847804800000)/" 
I got this exception:
 "type": "System.FormatException", "stacktrace": " in System.DateTimeParse.Parse(String s, DateTimeFormatInfo dtfi, DateTimeStyles styles)\r\n in System.Convert.ToDateTime(String value, IFormatProvider provider)\r\n in System.String.System.IConvertible.ToDateTime(IFormatProvider provider)\r\n in System.Convert.ChangeType(Object value, Type conversionType, IFormatProvider provider)\r\n in System.Data.Services.Serializers.JsonDeserializer.ConvertValues(Object value, String propertyName, Type typeToBeConverted, DataServiceProviderWrapper provider)" 

Below there is the datasource and grid definitions:

var dataSource = new kendo.data.DataSource({
    type: "odata",
    serverPaging: true,
    serverSorting: true,
    serverFiltering: true,
    pageSize: 20,
    batch: false,
    schema: {
        model: {
            id: "No_",
            fields: {
                No_: { type: "string" },
                Customer_WR_Code: { type: "string" },
                Description: { type: "string" },
                State: { type: "string" },
                Creation_Date: { type: "date" },
                Creation_Time: { type: "date" },
                Closing_Date: { type: "date" },
                Closing_Time: { type: "date" },
                Cancelling_Date: { type: "date" },
                Cancelling_Time: { type: "date" },
                Expiry_Date: { type: "date" },
                Appointment_Begin_Date: { type: "date" },
                Appointment_Begin_Time: { type: "date" },
                Appointment_End_Time: { type: "date" },
                Appointment_End_Date: { type: "date" },
                DateTime_Field_1: { type: "date" },
                DateTime_Field_2: { type: "date" },
                Date_Field_1: {type:"date"},
                Date_Field_2: {type:"date"}
 
            }
        }
    },
    transport: {
        read: "WCFDB.svc/View_Work_Request",
        update: {
            url: "WCFDB.svc/View_Work_Request",
            type: "POST",
            dataType: "json"
        }       
    }
 
});


$("#grid").kendoGrid({
             dataSource: dataSource,
             height: 550,
             pageable: {
                 refresh: true,
                 pageSizes: true
             },
             reorderable: true,
             editable: "inline",
             sortable: true,
             filterable: true,
             columnMenu: true,              
             navigatable: false,
             resizable: true,
             toolbar: kendo.template($("#tmplToolBar").html()),
             change: function (e) {
                 var grid = $("#grid").data("kendoGrid");
                 var model = grid.dataItem(grid.select());
                 refreshTab(model);
             },
             dataBound: function (e) { var item = e.sender.dataSource.at(0); refreshTab(item); },
             selectable: "row",
             columns: kendoGridColumns               
         });

Here the service:


[JSONPSupportBehavior]
 public class WCFDB : DataService<WOMContainer>
 {
     // Questo metodo viene chiamato solo una volta per inizializzare i criteri a livello di servizio.
     public static void InitializeService(DataServiceConfiguration config)
     {
         // TODO: impostare regole per indicare i set di entità e le operazioni del servizio visibili, aggiornabili e così via.
         // Esempi:
         config.SetEntitySetPageSize("*", 20);       
         config.SetEntitySetAccessRule("*", EntitySetRights.All);
         config.SetServiceOperationAccessRule("*", ServiceOperationRights.All);
         config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2;
         config.UseVerboseErrors = true;   
     }
     ................................
     ................................
     ................................
     ................................



Seminda
Top achievements
Rank 1
 answered on 20 Jul 2012
1 answer
229 views
With the following template content for my list view...
<div class="list-view">
  <input type="text" data-bind="value:shoppingList_main" name="shoppingList_main" required="required" validationMessage="required" />
               <span data-for="shoppingList_main" class="k-invalid-msg"></span>
               <br />
  <input data-role="datepicker" type="text" data-bind="value:shoppingList_date" name="shoppingList_date" required="required" validationMessage="required" />
               <span data-for="shoppingList_date" class="k-invalid-msg"></span>
                <div class="edit-buttons">
               <a class="k-button k-button-icontext k-update-button" href="\\"><span class="k-icon k-update"></span>Save</a>
             <a class="k-button k-button-icontext k-cancel-button" href="\\"><span class="k-icon k-cancel"></span>Cancel</a>
        </div>
            </div>

...
I get a date picker on my display and when I edit an item, it sets the display, and it sets the value in my datasource object, but the ajax request to the server doesn't send the date property...

 Here is my datasource and list View js....

<script>
jQuery(function () {
shoppingLists_datasource = new kendo.data.DataSource({
pageSize:4,
schema:{
model: {
id: 'familyShoppingList_id',
fields: {
familyShoppingList_id: { editable: false, nullable: true },
shoppingList_main: { editable: true},
shoppingList_date: { editable: true}
}
}
},
transport:{
read:{
url:'/apps/wpd/apps/shopping/index.cfc?method=getShoppingLists',
dataType: 'json'
},
create:{
url:'/apps/wpd/apps/shopping/index.cfc?method=saveShoppingList',
dataType: 'json'
},
update:{
url:'/apps/wpd/apps/shopping/index.cfc?method=saveShoppingList',
dataType: 'json'
},
destroy:{
url:'/apps/wpd/apps/shopping/index.cfc?method=removeShoppingList',
dataType: 'json'
}
}
})
})
</script>

<script>
var shoppingLists_listView;
jQuery(function () {
shoppingLists_listView = jQuery("#shoppingLists").kendoListView({
dataSource: shoppingLists_datasource,
template: kendo.template($("#viewTemplate").html()),
editTemplate: kendo.template($("#editTemplate").html())
})
.delegate(".k-edit-button", "click", function(e) {
shoppingLists_listView.edit($(this).closest(".list-view"));
e.preventDefault();
})
.delegate(".k-delete-button", "click", confirmDel)
.delegate(".k-update-button", "click", function(e) {
shoppingLists_listView.save();
e.preventDefault();
})
.delegate(".k-cancel-button", "click", function(e) {
shoppingLists_listView.cancel();
e.preventDefault();
})
.data("kendoListView")
})
</script>

...

Any idea how to get this working round  trip w/ the datePicker? For now I just required the field, and used a date pattern, but date picker would be a much better option
Martin Kelly
Top achievements
Rank 1
 answered on 20 Jul 2012
0 answers
82 views
Hi
Greeting!!
I am facing an issue of focus in grid view, scenario like:

1. Developing an financial portal, there is a watch list and consists of scrips in grid.
2. Select grid and press any key for invoking new window and when window is closed then FOCUS shifted and does not go back to grid again,
Please help me to resolve the issue.

Thanks in advance

Regards
Manash 
 
manash
Top achievements
Rank 1
 asked on 20 Jul 2012
0 answers
194 views
Hi
Greetings!!
In Tabstrip we are facing an issue of focus, scenario is:

1. we have 3 tabstrip, A, B,C
2. by default focus is in Tab A,
3. when data pushed from backend to Tab B, then the focus is not shifting from A to B automatically, so unable to view the data displayed in Tab B because of no indication. So please help me to resolve the issue.

Thanks in advance.

Regards
Manash
manash
Top achievements
Rank 1
 asked on 20 Jul 2012
1 answer
122 views
Hi,

Does the Panelbar widget support multiselect?

Regards,
Sarvesh
Iliana Dyankova
Telerik team
 answered on 20 Jul 2012
2 answers
383 views
I have a kendo Window with an order entry screen at the time of page load. At the bottom , i have a dock menu. On the click of the dock menu the same window comes to the front, but a new instance is not created. the code is as below.
window at page load:
<div id="window" style="width: 1200px;">
               <span class="Orders">
                    <div id="Workspace">
                        <div id="tabstrip" style="width: 1200px; height: 260px;">
                        <ul>
                            <li class="k-state-active">Equity </li>
                            <li>Futures </li>
                            <li>Options </li>
                            <li>CFD </li>
                            <li>Forex </li>
                        </ul>
                        <div>
                            <span class="Equity">
            </span>
        </div>
    </div>
</div>
</span>
</div>

the new instance of this window should open up on a click of button which is as below
function OpenOrderEntry() {
            var window = $("#window")
            if (!window.data("kendoWindow")) {
                // window not yet initialized
                window.kendoWindow({
                    width: "1300px",
                    height: "280px",
                    modal: false,
                    resizable: true,
                    actions: ["Minimize", "Maximize", "Close"],
                    title: "OrderEntry"
                });
            } else {
                // reopening window
                window.data("kendoWindow")
            .open(); // open the window
            }
        }

i need some help as i need multiple instances of the same window.
Pooja
Top achievements
Rank 1
 answered on 20 Jul 2012
1 answer
831 views
Hello,

I'm using the ASP.NET MVC helpers for KendoUI, and have version 2012.2.710.340 included in my project. I'm trying to add a toolbar to the grid, so the user can filter the data. I have copied code form the sample, but it's not working.

My grid markup in the Razor view looks like this...
@(Html.Kendo().Grid(Model)
           .Name("AllTickets")
           .DataSource(ds => ds.Server().Model(m => m.Id(t => t.ID)))
           .ToolBar(toolbar => toolbar.Template(
             @<text>
                Site:
                @(Html.Kendo().DropDownList()
                                                  .Name("SiteFilter")
                                                  .DataTextField("SiteName")
                                                  .DataValueField("ID")
                                                  .OptionLabel("Any")
                                                  .DataSource(dataSource => dataSource.Read("GetSitesForView""Home"))
                                                  .Events(events => events.Change("change"))
                    )
              </text>
                                 ))
           .Columns(cols => {
             cols.Bound(t => t.ID).Title("ID").Title("Ticket ID").Filterable(true).Width(50);
             cols.Bound(t => t.Site).Title("Site").Filterable(true);
             cols.Bound(t => t.DhrNumber).Title("DHR Number").Filterable(true).Width(100);
             cols.Bound(t => t.Room).Title("Room").Filterable(true);
             cols.Bound(t => t.ShortSummary).Title("Ticket Description").Filterable(true);
             cols.Bound(t => t.Status).Title("Ticket Status").Filterable(true).Width(80);
           })
    )

The grid itself displays fine, but the toolbar doesn't. You can see how it looks here...


As you can see, I have a text box instead of a dropdown.

Anyone any ideas? I've spent hours on this, and just can't see what I've done wrong.

Thanks
Rosen
Telerik team
 answered on 20 Jul 2012
0 answers
81 views
Please help me i want to use time picker in editable grid
Karan
Top achievements
Rank 1
 asked on 20 Jul 2012
0 answers
94 views
In my application there are 2 grid .Using first grid(A) we can add  row to second grid(B) so .I have develop first grid as a popup .
So I can edit recede from grid A and there is a command button to add  record to Grid B . It is working without any issue .

But now I have another Button(Create New ) in the page which I used to reload Grid A and Grid B. When I click Create New  then Load popup Grid A and click command button to add  record to Grid B .It is adding two rows to Grid B(It is adding previously added record also )

 see attached source code also 

http://jsfiddle.net/dineshpdn/z3c73/4/

pls suggest.... 
Dinesh
Top achievements
Rank 1
 asked on 20 Jul 2012
0 answers
109 views
Hi!

There is a problem with 'vertical' menu and <div> container. Example:

<div id="menu"></div>
<p><br/><br/><br/><br/></p>
<ul id="menu-2"></ul>
 
 
<script>
    $(function()  {
 
        var m = $('#menu, #menu-2').kendoMenu({
 
            dataSource: [
                {
                    text: "Baseball", imageUrl: "../../content/shared/icons/sports/baseball.png",
                    items: [
                        { text: "Top News", imageUrl: "../../content/shared/icons/16/star.png" },
                        { text: "Photo Galleries", imageUrl: "../../content/shared/icons/16/photo.png" },
                        { text: "Videos Records", imageUrl: "../../content/shared/icons/16/video.png" },
                        { text: "Radio Records", imageUrl: "../../content/shared/icons/16/speaker.png" }
                    ]
                },
                {
                    text: "Golf", imageUrl: "../../content/shared/icons/sports/golf.png",
                    items: [
                        { text: "Top News", imageUrl: "../../content/shared/icons/16/star.png" },
                        { text: "Photo Galleries", imageUrl: "../../content/shared/icons/16/photo.png" },
                        { text: "Videos Records", imageUrl: "../../content/shared/icons/16/video.png" },
                        { text: "Radio Records", imageUrl: "../../content/shared/icons/16/speaker.png" }
                    ]
                },
                {
                    text: "Swimming", imageUrl: "../../content/shared/icons/sports/swimming.png",
                    items: [
                        { text: "Top News", imageUrl: "../../content/shared/icons/16/star.png" },
                        { text: "Photo Galleries", imageUrl: "../../content/shared/icons/16/photo.png" }
                    ]
                },
                {
                    text: "Snowboarding", imageUrl: "../../content/shared/icons/sports/snowboarding.png",
                    items: [
                        { text: "Photo Galleries", imageUrl: "../../content/shared/icons/16/photo.png" },
                        { text: "Videos Records", imageUrl: "../../content/shared/icons/16/video.png" }
                    ]
                }
            ],
            orientation: 'vertical'
        });
    });
</script>
 
<style>
    #menu-2
    {
        width: 300px;
    }
 
</style>

Results in attach.

<ul> container works fine, but not <div>.

Problem is with this rule in kendo.common.css:

ul.k-menu-vertical > .k-item
{
    display: block;
    float: none;
    border-width: 0;
}

I added "div.k-menu-vertical" with same rules and it works fine.
Constantine
Top achievements
Rank 1
 asked on 20 Jul 2012
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?