Why are some pages when redirected when button clicked does not detect the kendo css and all other scripts as well? What Am I doing wrong?

here is my code.


JumpTo.html


<script>
    
    getCategories();
    
</script>

<div class="CouponMainDiv" data-role="page">
    <div data-role="header" id="searchdiv" role="banner">
          <h1 role="heading" id="couponheader">Coupons: Jump To...</h1> 
          <a id="backbutton" href="Coupons.html" data-role="button">Back</a>
       </div>
   </div>

<div class = "jumptocontent" data-role="content">
    
    <ul id="category-list" data-role="listview" data-style="inset">
    </ul>
    
</div>


<div data-role="footer">
                <div data-role="tabstrip">
                   <a href="index.html" data-role="button" class="footerbutton">Coupons</a>
                   <a href="index.html" data-role="button" class="footerbutton">My Wallet</a>
                   <a href="index.html" data-role="button" class="footerbutton">My Rewards</a>
                   <a href="index.html" data-role="button" class="footerbutton">Checkout</a>
                </div>
</div>

couponevents.js

function getCoupons()
{    
    console.log("SOAFDGHISELAGHLASHGLSAHNGLSIHGIOGHDSFLBHNASLDGKNASL;GHSLVNASDLGHSWGLSDG");
    
    var results = "";
    //var page = 1;
    var colorctr = 0;
    
    $.post("http://kupongi-beta.azurewebsites.net/Ajax/AvailableCoupons",{page:1},function(data){
      
      //  alert(data.item[0].ID);
        
       if ($(".coupondiv").size() > 0) {
        var colorCnt = $(".coupondiv").last().attr("class");
        colorctr = parseInt(colorCnt.split("couponcolor")[1]) + 1;
    }
    
        
        
      for (x = 0; x < data.item.length ; x++)
      {
          
          
          if (colorctr > 5) colorctr = 0;
          
        results +=  "<div id= '" + data.item[x].ID + "' class='coupondiv couponcolor"+colorctr+"'>" +
                    "<div class='indcoupon'>" +
                        "<img class='couponimg' onError='this.onerror=null;this.src=\"styles/Imgs/logo.png\"; ' src= '" + data.item[x].Img + "' />" +
                        "<span class='couponexp'>Exp. 12/31/13</span>" +
                    "</div>" +
                    "<div class='coupondescription'>" +
                        "<h3>" + data.item[x].Name + "</h3>" +
                        "<p>" + data.item[x].Description + "</p>"+
                    "</div>"+
                    "<div class='shares'>" +
                        "<img class='shareicon' src='styles/Imgs/icon_share.png'/>" +
                        "<img class='shareicon' src='styles/Imgs/icon_wallet.png'/>" +
                    "</div>" +
                "</div>";
         
          
          colorctr = colorctr + 1;
      }  
        $(".couponsdiv").append(results);
       
        
    });
    
}

function getCategories()
{     
       var categories = "";
       var currentcategory = "";
    
    $.post("http://kupongi-beta.azurewebsites.net/Ajax/GetCouponCategories",{opt:"all"}, function(data){
        
        $("#category-list li").remove();
        
        for (x = 0; x < data.length ; x++)
        {
            currentcategory = data[x].Name;
            categories += " <li><a class='categorylist-a' data-action='"+data[x].Name+"' id='"+data[x].CategoryID+"' href = 'Coupons.html'>"+ currentcategory.split(" (")[0]; +"</a></li>";
        }
        $("#category-list").append(categories);
        
    });
}
Coupons.html


<script>
     
     $(document).ready(function(){
         
        getCoupons();
         
         
     });
 </script>   
<!--HEADER DIV-->

<div class="CouponMainDiv" data-role="page">
    <div data-role="header" id="searchdiv" role="banner">
          <h1 role="heading" id="couponheader">Coupons</h1>
          <input type="text" id="txtSearch" value="Search" />
          <a id="jumptobutton" href="JumpTo.html" data-role="button">Jump To...</a>
          
       </div>
   </div>



<!--CONTENT DIV-->       
<div data-role="content" class="couponsdiv">
   
</div>
        
   
<!--FOOTER DIV-->  

    <div data-role="footer">
                <div data-role="tabstrip">
                   <a href="index.html" data-role="button" class="footerbutton">Coupons</a>
                   <a href="index.html" data-role="button" class="footerbutton">My Wallet</a>
                   <a href="index.html" data-role="button" class="footerbutton">My Rewards</a>
                   <a href="index.html" data-role="button" class="footerbutton">Checkout</a>
                </div>
            </div>

I need to resize a container when the animation completes, does no such event exist?

We have to do both a widget for a dashboard and a mobile app with icenium...both have pretty much the exact same functionality

...is there anything fundamentally WRONG with doing it all with kendo mobile (aside from extra download having to load web+mobile scripts on the website)

Steve

(1)I have used mobilethemebuilder http://demos.kendoui.com/mobilethemebuilder/index.html , but is' s only for phone not for tablets ,  not have splitview widget ,how to custom splitview ? add navbar and splitview left side  parting line like native widget ,see my attach pic

(2) comapre with kendoui mobile for ios and android,    the android theme is more clunky than ios ,  making fine detail difficult to distinguish and colors to become muted

Hi there,

 I  have grids which are use row templates to display data, when I start using the row templates, my sorting stops working. Is there anything which I'm missing. My template code is as follows

<script id="gridItemsRowTemplate" type="text/x-kendo-template">

    # var columns = $("\\#" + gridID).data("kendoGrid").columns #

    <tr data-uid="#= uid #" role ='row'>
        #for(properties in columns) {#

        #if (columns[properties].field == 'Id' || columns[properties].field == 'Hidetype') {#
            <td role="gridcell" style ="display:none;"> #data[columns[properties].field] #</td>
         #}else {#
            #if (data[columns[properties].field] != undefined) {#
            <td > #= data[columns[properties].field].val #</td>
              #}#

           #}#
        #}#
    </tr>
</script>

I'm having trouble binding the select event of a buttongroup to a method of the viewModel.

Typically, this would look something like this:

    <div>
        <ul class="location-type-buttons" data-role="buttongroup" data-index="0" data-bind="...">
            <li>Option 1</li>
            <li>Option 2</li>
            <li>Option 3</li>
            <li>Option 4</li>
        </ul>
    </div>

    <div style="position: relative;-webkit-box-flex: 1;border: 1px solid black">
        <div data-role="view" style="position: absolute;">Option 1 Title</div>
        <div data-role="view" style="position: absolute;">Option 2 Title</div>
        <div data-role="view" style="position: absolute;">Option 3 Title</div>
        <div data-role="view" style="position: absolute;">Option 4 Title</div>
    </div>

When I use data-bind="click: doSelect", the views appear correctly but nothing happens (the buttongroup has a select event instead of a click event).

When I use data-bind:"select: doSelect", the titles of the four views appear simultaneously, and the event handler is still not called.

What am I missing here?  Thanks!

I have a Kendo grid generated using the ASP.NET MVC Wrapper on my cshtml page. I bind the columns using a GridColumnSettings[] prepared in the Action method for the controller and pushed to the ASP.NET page through the ViewData structure.


  .Columns(columns =>
                            {
                                columns.LoadSettings((GridColumnSettings[])ViewData["OrderReviewGrid"]);
                            })

The action methods builds the GridColumnSettings[ ] programmaticaly. After the grid is rendered for the first time, the GridColumnSettings[ ] for this particular grid are saved in the user's Profile. Any changes to the column settings on the UI e.g Column Resize, Hide, Show etc are captured and sent back on the server and updated in the saved GridColumnSettings[ ] in the user's profile.

The intention here is to be able to get the saved configuration the next time the user visit's the page.

But on the following request to the page, when the Grid is created, this time the GridColumnsSettings[] is loaded from the cached copy in the user's profile. When this is pushed to the ASP.NET page,  I get the following exception on the ASP page during the MVC Wrapper execution.

I have inspected the two structures, the default created, and the one saved and retrieved from the profile. They are exactly the same in terms of field-by-field compare.

Thanks in Advance if anyone can find what's going wrong.

Exception Details:

An item with the same key has already been added.
at System.ThrowHelper.ThrowArgumentException(ExceptionResource resource) at System.Collections.Generic.Dictionary`2.Insert(TKey key, TValue value, Boolean add) at System.Web.Routing.RouteValueDictionary.Add(String key, Object value) at Kendo.Mvc.UI.GridBoundColumn`2.CreateHeaderBuilderCore() at Kendo.Mvc.UI.GridColumnBase`1.CreateHeaderBuilder() at Kendo.Mvc.UI.Html.GridCellBuilderFactory.CreateHeaderCellBuilder(IGridColumn column) at System.Linq.Enumerable.WhereSelectEnumerableIterator`2.MoveNext() at Kendo.Mvc.UI.Html.GridRowBuilder.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridRowBuilderDecoratorBase.CreateRow() at Kendo.Mvc.UI.Html.GridDataSectionBuilder.CreateHeader(GridRenderingData data) at Kendo.Mvc.UI.Html.GridScrollingHtmlBuilder.CreateHeader(GridRenderingData renderingData) at Kendo.Mvc.UI.Html.GridHtmlBuilder.AppendHeader(IHtmlNode container, GridRenderingData renderingData) at Kendo.Mvc.UI.Html.GridScrollingHtmlBuilder.AppendData(IHtmlNode div, GridRenderingData renderingData) at Kendo.Mvc.UI.Html.GridHtmlBuilder.CreateGrid(IDictionary`2 htmlAttributes, GridFunctionalData functionalData, GridRenderingData renderingData) at Kendo.Mvc.UI.Grid`1.WriteHtml(HtmlTextWriter writer) at Kendo.Mvc.UI.WidgetBase.ToHtmlString() at Kendo.Mvc.UI.Fluent.WidgetBuilderBase`2.ToHtmlString() at System.Web.HttpUtility.HtmlEncode(Object value) at System.Web.WebPages.WebPageBase.Write(Object value) at ASP._Page_Areas_FR_Views_OrderReview_Index_cshtml.Execute() in 

Hi - I'm brand new to Kendo, and trying to figure some things out.

One being how can I display a title on a grid?  I don't see a configuration attribute for anything like "header" or "Title"

I attached a screen shot of what I'm thinking of.

Thanks for any help.

Lisa

Hi I want to use K-Block and K-Header to style some portlets.

I want the K-Header to contain some right aligned buttons (expand, minimize and close)

However, currently they overflow the header height and setting the height of the portlet header statically doesn't lend itself to modularity and style changes.

Any ideas?

I have a listview of a few inputs. I click on the first one in my list and it brings up the keyboard.  I enter some text and click the <next> button in the keyboard and it moves to the next input in the listview while shifting the view up a little to bring the input into view (since the keyboard hides it).

I enter some text and repeat until all of my inputs are done and I click away to remove the keyboard from view.  
The problem is that the view seems stuck and if I try to swipe to scroll to the top it just springs back down.  I can't get the view to stay at the top of the screen.  This only happens when using the <next> button in the keyboard.

If I click into an input and choose <prev> it will cycle up to the top of the inputs but it never truly gets to the top of the view.

Any one know what is going on here or know of a resolution?

Thanks

Robert