I have a "view" that is binded to a viewmodel, what i want is reset that viewmodel whenever i click the backbutton and then re-initialize/re-bind it again so the values are cleared.

I followed the documentation for MVVM
http://docs.kendoui.com/getting-started/mobile/mvvm

and i used the data-show attribute to call a function that clears my viewmodel but it doesnt work. 

Hi

I am using bar and column charts to represent my data. The issue is when the data is large, the number of bars increases and is difficult to view the data. when i view in iphone it  is still worse. i used pan and zoom for the bar chart but it is ok in browsers and not in iphone(Drag is difficult in iphone). the pan and zoom is also not working fine for column charts. can you provide me with a solution?

Hey All,

Sorry if this has been asked before but I just can't work out how to do it.

I have an area graph that is loaded dynamically through ajax (see attached image).

I can set the value axis based on decimal values but what I am really hoping to be able to do is say I want a value lines to be every X pixels rather than setting the interval as a value.

My problem is the data range on the graph can vary greatly so I can't choose a value that will fit.

If this is not possible is it possible to skip every second value line (or even label) so they don't feel so cramped?

I came across a way to extend views inside scheduler widget: http://jsbin.com/ucaB/3/edit

Now when I started exploring this by overriding startDate (just like endDate) the kendo widget threw an error. So I am curious have you exposed the members of the Views so that we know which fields we can override?

Hi Telerik,

Just a brief heads-up, there is a listView with an endless scroll enabled. The listView is binded with a dataSource which has a custom transport.read function.

Firstly, what is a preferred approach if one would like to clear all data from the list? Calling dataSource.data([]) will remove all items, but will simultaneously completely break the endless scroll. Is there any API call which I possibly missed? (I do not know if dataSource.remove(oneModelItem) is supported in such scenarion, but anyway going through the whole dataset would be at least inefficient)

Secondly, due to the problem above I tried to delete the listview (by calling listview.destroy() and removing it's html content together with a parent nodes/wrappers) and then instantiate it again. I double checked that there is no markup left from the old listview before creating a new one. Because the first datasource had some data in it I created a new one with the same transport.read etc.

It all seemed to work, but I noticed that there are too many requests to the backend. For testing purposes I have subscribed to a requestStart event on datasources as well as added a creation timestamp to them, just to ease their identification. In such a configuration logs show that there are several dataSources requesting data from the backend even though only one (the last one) is binded with a listView.

It seems that even though a listView is destroyed binding between view's scroller and the dataSource survives. This causes problems mentioned above if a new pair of a listView-dataSource is created and binded within the same scroller instance.

It might be that I stumbled upon a bug, but it can be that I missed something as well. Any suggestions will be more than welcome.

Regards,
Przemek

@EDIT: I just realized that simple call to dataSource.read() could do the trick as it refreshes data and requests the first page even if more pages have been loaded, but it does not reset listview/scroller position. Instead, it stays at the same position and jumps after first interaction with a scroller. Sometimes, while doing this it breaks completely the listview component.

I am looking at using a background image to use on the window.  

I currently would like to put an image as a background and make it about A4 size so if someone wishes to print it, then it could be possible. However even if I reference an image off the internet it still does not show, however the colour does.  

I have tried to simply use your kendo window mvc demo code but no luck. I have added a Div referenced test to simply add an image 

Do you have any ideas?

Thanks

@(Html.Kendo().Window()
    .Name("window")
    .Title("About Alvar Aalto")
    .Content(@<text>

<div class="test">
        <p>
            Alvar Aalto is one of the greatest names in modern architecture and design.
            Glassblowers at the iittala factory still meticulously handcraft the legendary
            vases that are variations on one theme, fluid organic shapes that let the end user
            ecide the use. Interpretations of the shape in new colors and materials add to the
            growing Alvar Aalto Collection that remains true to his original design.
        </p>

        <p>
            Born Hugo Alvar Henrik Aalto (February 3, 1898 - May 11, 1976) in Kuortane, Finland,
            was noted for his humanistic approach to modernism. He studied architecture at the
            Helsinki University of Technology from 1916 to 1921. In 1924 he married architect
            Aino Marsio.
        </p>

        <p>
            Alvar Aalto was one of the first and most influential architects of the Scandinavian
            modern movement, and a member of the Congres Internationaux d'Architecture Moderne.
            Major architectural works include the Finlandia Hall in Helsinki, Finland,
            and the campus of Helsinki University of Technology.
        </p>

        <p>
            Source:
            <a href="http://www.aalto.com/about-alvar-aalto.html" title="About Alvar Aalto">www.aalto.com</a>
        </p>
    </div>
    </text>)
    .Draggable()
    .Resizable()
    .Width(600)
    .Actions(actions => actions.Pin().Minimize().Maximize().Close())
    .Events(ev => ev.Close("onClose"))
)

<span id="undo" style="display:none" class="k-button">Click here to open the window.</span>

<script>
    function onClose() {
        $("#undo").show();
    }

    $(document).ready(function() {
        $("#undo").bind("click", function() {
                $("#window").data("kendoWindow").open();
                $("#undo").hide();
            });
    });
</script>

<style scoped>
    #example
    {
        min-height:500px;
    }

    #undo {
        text-align: center;
        position: absolute;
        white-space: nowrap;
        padding: 1em;
        cursor: pointer;
    }
   
    .test
    {
background-image:url("http://blog.felho.hu/wp-content/debuggingsuckststingrocks.png");
background-color:#cccccc;
width:200px;
height:200px;
}

</style>

We have an ASP.NET MVC application using jQuery Unobtrusive Validation and NumericTextBox. We are seeing some odd behavior with respect to the automatic field highlighting that the validation provides.

The NumericTextBox generates a <span> with two <input type="text"> elements inside. One appears to be the formatted/read-only version of the input; the other appears to be the actual input box the user types in.

jQuery Unobtrusive Validation assigns the CSS class "input-validation-error" to any input field with a client-side validation error. The problem is, it only assigns it to the box that the user types into. So while the field has focus, you see a nice border on the field as expected (see attachment: cursor_in_field.png). However, when the user moves to a different field, while the validation message stays present, the field border is lost because the input field is technically hidden (see attachment: cursor_out_of_field.png).

Further, if client-side validation passes but some server-side validation fails, you get a "double border" around the field - because the <span> element gets the CSS class "input-validation-error" AND the input elements (both) get the class (see attachment: server_val_fail.png).

If you put the cursor into the field and take it back out again, the client-side validation fires and removes the "input-validation-error" class from the two input elements... but the span element doesn't get cleaned up (see attachment: server_val_fail_after_click.png).

I have the kendo.aspnetmvc.js and the kendo.web.js being included in my project. The behavior of the controls otherwise seems to work very well. Am I missing something?

 My page have two grids called grid1,grid2,I only want to style the grid1,not grid2.I use the css style in the header like  this,but  it seems that both grid changed.
.k-grid td {
color:red;
  padding: 0px;
   }
I try to write like this,but failed.
.GridTd {
color:red;
  padding: 0px;
    }
$("#grid1 td").addClass("GridTd "); //failed,I debug with firebug and find that the td style is used by default style(.k-grid td),not GridTd Style.
$("#grid1 k-grid   td").addClass("GridTd ");// faied

.k-grid td {    border-style: solid;    border-width: 0 0 0 1px;    line-height: 1.6em;    overflow: hidden;  
 padding: 0.4em 0.6em;   text-overflow: ellipsis;    vertical-align: middle;}.
GridTd {  color:red;   padding: 0;}

Is it possible to add an image to the chart title?

/Jakob

I'm using the Web kendo grid with the options: pageable, scrollable, filterable and sortable all set to true and selectable set to multiple, row (see below)
 I've extended the grid with a checkbox selection column (through some event handling) which all works like a charm and improves the usability for touch devices by allot.

On desktop (mouse input) all works very nice. But on touch devices the instinct of people is to "Swipe to scroll" to browse through the grid. But since selectable is set to multiple, row (which i believes causes this behavior) this is no longer possible. A selection of displayed rows is made during a Swipe causing users to be forced to use the scrollbar (Very bad usability)

Is there a way to keep the multiple row selection option but without drag/swipe selection (through Ctrl/Shift clicks) so "Swipe to scroll" remains possible