or
<!DOCTYPE html><html><head> <title>Demo</title> <link href="styles/kendo.common.min.css" rel="stylesheet" /> <link href="styles/kendo.default.min.css" rel="stylesheet" /> <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" /> <link href="styles/index.css" rel="stylesheet" /> <script src="js/jquery.min.js"></script> <script src="js/kendo.all.min.js"></script></head><!-- Contenu des pages chargées par le paneau left--><body> <div data-role="view" id="drawer-home" data-layout="drawer-layout" data-title="Inbox"> </div> <div data-role="view" id="drawer-starred" data-layout="drawer-layout" data-title="Starred Items"> </div> <div data-role="view" id="drawer-drafts" data-layout="drawer-layout" data-title="Drafts"> </div><!-- // Paneau Left--><div data-role="drawer" id="my-drawer" style="width: 270px" data-views="['/', 'drawer-home', 'drawer-starred', 'drawer-drafts']"> <ul data-role="listview" data-type="group"> <li>Menu <ul> <li><a href="#drawer-home" data-transition="none">m1</a></li> <li><a href="#drawer-starred" data-transition="none">m2</a></li> <li><a href="#drawer-drafts" data-transition="none">m3</a></li> </ul> </li> </ul></div><!-- Headers--><div class="Head" data-role="layout" data-id="drawer-layout"> <header data-role="header"> <div class="" data-role="navbar"> <a data-role="button" data-rel="drawer" href="#my-drawer" data-icon="drawer-button" data-align="left"></a> <span id="compagnyName">Demo</span> <a data-role="button" onClick="changeHead()" data-icon="drawer-button" data-align="right"></a> </div> </header></div><div class="HeadSearching" data-role="layout" data-id="drawer-layout"> <header data-role="header"> <div data-role="navbar"> <a data-role="button" data-rel="drawer" href="#my-drawer" data-icon="drawer-button" data-align="left"></a> <input type="text" id="city" name="city" class="k-textbox" placeholder="Ville" data-align="center" /> <select name="country" id="country" data-align="right"> <option>France</option> <option>Angleterre</option> <option>Luxembourg</option> <option>Espagne</option> </select> </div> </header></div><script> var app = new kendo.mobile.Application(document.body); $('.HeadSearching').remove();</script><script> function changeHead() { alert('header replace'); $('.head').replaceWith('.HeadSearching'); }</script></body></html>var dataSourceStatistics = new kendo.data.DataSource({ transport: { read: { data: { f:'getCustomerStats', fromDate:function () { return "2012-01-01"; }, toDate:function () { return "2012-06-19"; }, custStats:null } }, update: { } }, schema: { data: function(data) { return data.result.custStats.Record; }, total: function(data) { return data.result.custStats.Record.length; }, model:{ id: "EmployeeId", fields: { Employee: { editable: false }, EmployeeId: { editable: false }, ValueCandE: { type: "number", defaultValue: 0 }, ValueE: { type: "number", defaultValue: 0 }, ValueEandCandM: { type: "Number" }, ValueEandM: { type: "Number" } } } }});