or
0 answers
107 views
How can I make the tabs appear to the right instead of to the left?
TIA
TIA
4 answers
251 views
What is the recommended way to have a kendoWindow listen for the dragEnd event?
1 answer
149 views
See html source below. When I put a menu and a grid control below it inside a window, dropping the menu causes it to display underneath the grid. But when the menu and grid are not inside a window, it displays as it should. It does this is all browsers.
<!doctype html>
<html>
<head>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$(".myWindow").kendoWindow();
$(".myMenu").kendoMenu();
$(".myGrid").kendoGrid();
});
</script>
</head>
<body>
<ul class="myMenu">
<li>Menu
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
</li>
</ul>
<table class="myGrid">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
</tr>
</thead>
</table>
<div class="myWindow">
<ul class="myMenu">
<li>Menu
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
</li>
</ul>
<table class="myGrid">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
</tr>
</thead>
</table>
</div>
</body>
</html>
<!doctype html>
<html>
<head>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$(".myWindow").kendoWindow();
$(".myMenu").kendoMenu();
$(".myGrid").kendoGrid();
});
</script>
</head>
<body>
<ul class="myMenu">
<li>Menu
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
</li>
</ul>
<table class="myGrid">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
</tr>
</thead>
</table>
<div class="myWindow">
<ul class="myMenu">
<li>Menu
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
</li>
</ul>
<table class="myGrid">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
</tr>
</thead>
</table>
</div>
</body>
</html>
1 answer
221 views
Hi,
I'm trying to create an Hierarchy Grid with Local Data and I can't manage to pass the father ID to the Client Detail Template
for example
@(Html.Kendo().Grid(Model.Employees)
.Name("Employees")
.Columns(columns =>
{
columns.Bound(e => e.FirstName).Width(140);
columns.Bound(e => e.LastName).Width(140);
columns.Bound(e => e.Title).Width(200);
columns.Bound(e => e.Country).Width(200);
columns.Bound(e => e.City);
})
.ClientDetailTemplateId("employeesTemplate")
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Sortable()
)
<script id="employeesTemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid(Model.Orders.Where(o=>o.employeeID == "#=EmployeeID#" ) )
//************* NOT WORKING *************
.Name("Orders_#=EmployeeID#")
.Columns(columns =>
{
columns.Bound(o => o.OrderID).Width(101);
columns.Bound(o => o.ShipCountry).Width(140);
columns.Bound(o => o.ShipAddress).Width(200);
columns.Bound(o => o.ShipName).Width(200);
})
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Pageable()
.Sortable()
.ToClientTemplate()
)
</script>
Please Help
I'm trying to create an Hierarchy Grid with Local Data and I can't manage to pass the father ID to the Client Detail Template
for example
@(Html.Kendo().Grid(Model.Employees)
.Name("Employees")
.Columns(columns =>
{
columns.Bound(e => e.FirstName).Width(140);
columns.Bound(e => e.LastName).Width(140);
columns.Bound(e => e.Title).Width(200);
columns.Bound(e => e.Country).Width(200);
columns.Bound(e => e.City);
})
.ClientDetailTemplateId("employeesTemplate")
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Sortable()
)
<script id="employeesTemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid(Model.Orders.Where(o=>o.employeeID == "#=EmployeeID#" ) )
//************* NOT WORKING *************
.Name("Orders_#=EmployeeID#")
.Columns(columns =>
{
columns.Bound(o => o.OrderID).Width(101);
columns.Bound(o => o.ShipCountry).Width(140);
columns.Bound(o => o.ShipAddress).Width(200);
columns.Bound(o => o.ShipName).Width(200);
})
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
)
.Pageable()
.Sortable()
.ToClientTemplate()
)
</script>
0 answers
111 views
I have a rather simple kendoUpload button and it mostly works fine,
but in IE9 the user needs to double click the button to get the file
browser window to display.
Also, the user can only click on the button label - clicking (or double
clicking) on the larger button image has no effect.
Here's the code:
Thanks!
but in IE9 the user needs to double click the button to get the file
browser window to display.
Also, the user can only click on the button label - clicking (or double
clicking) on the larger button image has no effect.
Here's the code:
<a href="javascript:void(0)"> <input id="FileName" name="FileName" type="file" /> <script> jQuery(function () { jQuery("#FileName").kendoUpload(); }); </script> </a>Thanks!
bergonom
Top achievements
Rank 1
Rank 1
asked
on
16 Oct 2012
1 answer
1.3K+ views
Hi,
Does any one know, how can I change the "Filter" icon that comes on grid columns when filtering is enabled ?
I have tried to change it but it appears that image is displayed dynamically by kendo during grid rendering.
Thanks
Does any one know, how can I change the "Filter" icon that comes on grid columns when filtering is enabled ?
I have tried to change it but it appears that image is displayed dynamically by kendo during grid rendering.
Thanks
0 answers
129 views
Is it possible to validate RadTextBox with Kendo UI Validation?
My code looks like this:
<script type="text/javascript">
$(document).ready(function () {
$("#contact").kendoWindow({
actions: ["Maximize", "Minimize", "Close"],
title: "Contact...",
visible: false
}).data("kendoWindow");
$("#contact").kendoWindow('open');
$("#contact").kendoValidator();
</script>
...
<div id="contact">
<table>
<tr>
<td>Name :</td>
<td>
<telerik:RadTextBox ID="tbFullName" runat="server" CssClass="k-textbox" EmptyMessage="Please enter your name" ClientIDMode="Static"></telerik:RadTextBox></td>
<td><span class="k-invalid-msg" data-for="tbFullName"></span></td>
</tr>
</table>
</div>
For testing purposes, I tried kendoWindow() so that I can be sure that all links are ok and Kendo Window worked perfekt.
But unfortunately Kendo Validation didn't works for me with RadTextBox. If I use <input> tags intead of RadTextBox
everything works fine.
I hope that someone can help me. Thanks in advance.
My code looks like this:
<script type="text/javascript">
$(document).ready(function () {
$("#contact").kendoWindow({
actions: ["Maximize", "Minimize", "Close"],
title: "Contact...",
visible: false
}).data("kendoWindow");
$("#contact").kendoWindow('open');
$("#contact").kendoValidator();
</script>
...
<div id="contact">
<table>
<tr>
<td>Name :</td>
<td>
<telerik:RadTextBox ID="tbFullName" runat="server" CssClass="k-textbox" EmptyMessage="Please enter your name" ClientIDMode="Static"></telerik:RadTextBox></td>
<td><span class="k-invalid-msg" data-for="tbFullName"></span></td>
</tr>
</table>
</div>
For testing purposes, I tried kendoWindow() so that I can be sure that all links are ok and Kendo Window worked perfekt.
But unfortunately Kendo Validation didn't works for me with RadTextBox. If I use <input> tags intead of RadTextBox
everything works fine.
I hope that someone can help me. Thanks in advance.
Christian
Top achievements
Rank 1
Rank 1
asked
on
16 Oct 2012
2 answers
224 views
Hi there,
I am abusing the popover for a menu-like view. So I have my popover which has a listview with some menu entries. Now I'd like to navigate to a different view when clicking an entry. It works, but the new view is loaded INSIDE the popover. Instead I want it to load in the "PARENT" view. How can I achieve that?
This is how the hierarchy looks like:
I am abusing the popover for a menu-like view. So I have my popover which has a listview with some menu entries. Now I'd like to navigate to a different view when clicking an entry. It works, but the new view is loaded INSIDE the popover. Instead I want it to load in the "PARENT" view. How can I achieve that?
This is how the hierarchy looks like:
<div data-role="view"> <!-- this would be the view to load the new view --> <div data-role="popover"> <div data-role="view"> <!-- this is where it's loaded into --> <ul data-role="listview"> <li><a href="view/TabView.html">Tab</a></li> </ul> </div> </div></div>
//edit: I noticed the following behavior when playing around with the listview's links:
<li><a data-transition="fade" href="view/TabView.html">inside</a></li> //opens inside the popover
<li><a data-rel="external" data-transition="fade" href="view/TabView.html">ext</a></li> //doesnt open at all on the phone
<li><a data-rel="external" data-transition="fade" href="#view/TabView.html">ext</a></li> //(notice the #) doesnt open at all on the phone but has exactly the desired behavior on the desktop
any suggestions?
Dennis
Top achievements
Rank 1
Rank 1
answered
on
16 Oct 2012
0 answers
83 views
i validate the the text box entry by checking the data existence in database . I write a json validation function in custom validation area .. and return proper data and validation also work . But it not show validation message when i first time escape the textbox ,It show wthen i click in text box 2nd time and escape again.. Please find put the reason and help me to do remote validation.
jQUERY
-----------
<script language="javascript" type="text/javascript">
var b1 = new Boolean(1);
var b2 = new Boolean(1);
var R_rank=null;
$(document).ready(function () {
//Culture Declaration for Date Validation
kendo.culture("en-GB");
//KendoUi Validation
var validatable = $("#ApplicationNo").kendoValidator({
onfocusout: false,
onkeyup: false,
rules: {
ApplicationNo: function (input) {
$.post("/Home/CheckAppNo", { ApplicationNo: $("#ApplicationNo").val() }, function (data) { b1 = data; })
return b1;
}
},
messages: {
ApplicationNo: "Already Exist"
}
}).data("kendoValidator");
var validatable = $("#ReferredBy").kendoValidator({
onfocusout: false,
onkeyup: false,
rules: {
//ApplicationNo: function (input) { return CheckApplicationNo(); }input.val() === "2";
ReferredBy: function (input) {
$.post("/Home/ReferrerDetails", { InternalCode: $("#ReferredBy").val() }, function (data) {
R_rank = data.R_rank;
if (R_rank == null) { b2 = false; }
else { b2 = true; }
})
return b2;
}
},
messages: {
ReferredBy: "This is not a valid code "
}
}).data("kendoValidator");
//KendoUi Validation in submit button click
var validatable = $(".k-content").kendoValidator().data("kendoValidator");
$("#SubmitAgent").click(function () {
if (validatable.validate()) {
}
else {
//alert("Check The Data.");
e.preventDefault();
}
});
function CheckApplicationNo(input1) {
return {
b1: $.post("/Home/CheckAppNo", { ApplicationNo: $(input1).val() }, function (data) { return data; })
}
}
});
</script>
CSHTML
---------------
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.BranchCode)
</td>
<td class="EditTextBoxTD">
@(Html.Kendo().DropDownList()
.Name("BranchCode")
.OptionLabel("Select Branch...")
.DataTextField("BranchName")
.DataValueField("ID")
//.BindTo(ViewBag.Branch)
.DataSource(source =>
{
source.Read(read =>
{
read.Action("ShowBranch", "Home");
});
})
)
@* @Html.ValidationMessageFor(model => model.BranchCode)*@
@* <span style="color:Red">Name</span>*@
</td>
</tr>
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.ReferredBy)
</td>
<td class="EditTextBoxTD">
<input type="text" id="ReferredBy" name="ReferredBy" class="k-textbox" />
<span id="R_name" style="color: red">
</span><span id="R_rank" style="color: red"></span><input type="hidden" id="R_Ranks" name="R_Ranks" />
</td>
</tr>
<tr>
<td class="EditlableTD">
Rank
</td>
<td class="EditTextBoxTD">
<script>
function filterRank() {
return {
R_Ranks: $("#R_Ranks").val()
};
}
</script>
@(Html.Kendo().DropDownList()
.Name("Rank")
.OptionLabel("Select Rank...")
.DataTextField("Rk_Name")
.DataValueField("Rk_InternalCode")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("ShowSelectedRank", "Home")
.Data("filterRank");
})
.ServerFiltering(true);
})
.Enable(true)
.AutoBind(false)
//.CascadeFrom("BranchCode")
.HtmlAttributes(new {style="width:200px;" })
)
@* <span style="color:Red">Name</span>*@
</td>
</tr>
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.ApplicationNo)
</td>
<td class="EditTextBoxTD">
<input id="ApplicationNo" name="ApplicationNo" class="k-textbox" />
</td>
</tr>
jQUERY
-----------
<script language="javascript" type="text/javascript">
var b1 = new Boolean(1);
var b2 = new Boolean(1);
var R_rank=null;
$(document).ready(function () {
//Culture Declaration for Date Validation
kendo.culture("en-GB");
//KendoUi Validation
var validatable = $("#ApplicationNo").kendoValidator({
onfocusout: false,
onkeyup: false,
rules: {
ApplicationNo: function (input) {
$.post("/Home/CheckAppNo", { ApplicationNo: $("#ApplicationNo").val() }, function (data) { b1 = data; })
return b1;
}
},
messages: {
ApplicationNo: "Already Exist"
}
}).data("kendoValidator");
var validatable = $("#ReferredBy").kendoValidator({
onfocusout: false,
onkeyup: false,
rules: {
//ApplicationNo: function (input) { return CheckApplicationNo(); }input.val() === "2";
ReferredBy: function (input) {
$.post("/Home/ReferrerDetails", { InternalCode: $("#ReferredBy").val() }, function (data) {
R_rank = data.R_rank;
if (R_rank == null) { b2 = false; }
else { b2 = true; }
})
return b2;
}
},
messages: {
ReferredBy: "This is not a valid code "
}
}).data("kendoValidator");
//KendoUi Validation in submit button click
var validatable = $(".k-content").kendoValidator().data("kendoValidator");
$("#SubmitAgent").click(function () {
if (validatable.validate()) {
}
else {
//alert("Check The Data.");
e.preventDefault();
}
});
function CheckApplicationNo(input1) {
return {
b1: $.post("/Home/CheckAppNo", { ApplicationNo: $(input1).val() }, function (data) { return data; })
}
}
});
</script>
CSHTML
---------------
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.BranchCode)
</td>
<td class="EditTextBoxTD">
@(Html.Kendo().DropDownList()
.Name("BranchCode")
.OptionLabel("Select Branch...")
.DataTextField("BranchName")
.DataValueField("ID")
//.BindTo(ViewBag.Branch)
.DataSource(source =>
{
source.Read(read =>
{
read.Action("ShowBranch", "Home");
});
})
)
@* @Html.ValidationMessageFor(model => model.BranchCode)*@
@* <span style="color:Red">Name</span>*@
</td>
</tr>
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.ReferredBy)
</td>
<td class="EditTextBoxTD">
<input type="text" id="ReferredBy" name="ReferredBy" class="k-textbox" />
<span id="R_name" style="color: red">
</span><span id="R_rank" style="color: red"></span><input type="hidden" id="R_Ranks" name="R_Ranks" />
</td>
</tr>
<tr>
<td class="EditlableTD">
Rank
</td>
<td class="EditTextBoxTD">
<script>
function filterRank() {
return {
R_Ranks: $("#R_Ranks").val()
};
}
</script>
@(Html.Kendo().DropDownList()
.Name("Rank")
.OptionLabel("Select Rank...")
.DataTextField("Rk_Name")
.DataValueField("Rk_InternalCode")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("ShowSelectedRank", "Home")
.Data("filterRank");
})
.ServerFiltering(true);
})
.Enable(true)
.AutoBind(false)
//.CascadeFrom("BranchCode")
.HtmlAttributes(new {style="width:200px;" })
)
@* <span style="color:Red">Name</span>*@
</td>
</tr>
<tr>
<td class="EditlableTD">
@Html.LabelFor(model => model.ApplicationNo)
</td>
<td class="EditTextBoxTD">
<input id="ApplicationNo" name="ApplicationNo" class="k-textbox" />
</td>
</tr>
Pinaki
Top achievements
Rank 1
Rank 1
asked
on
16 Oct 2012
0 answers
77 views
I'm curious if there is a way to see the final generated URL the datasource transport uses when there are filters in place.
We have tests around using this grid and interacting with the WCF Data Service and we'd like the URL to be a verification point.
We have tests around using this grid and interacting with the WCF Data Service and we'd like the URL to be a verification point.
Dennis
Top achievements
Rank 1
Rank 1
asked
on
16 Oct 2012
