Questions on Kendo UI for jQuery Forum

1 answer

126 views

Dynamic sliders

Was wondering if sliders can be recreated on the fly.

Let me expand on this. I have two sliders. Slider Parent and Slider Children.

When a slider "change" event occurs on Slider Parent I want it to recreate the Slider Children so that the max parameter in the object can change and the input changes it ticks accordingly in the UI. That is, the one slider recalibrates the max or min of the otehr sliders properties....

I have tried quite a few things but I think this is an ability that has to be made into a method in the slider software. No?

Slider

answered on 03 Jan 2012

1 answer

86 views

Bug with <div></div> vs <div />?

I think I found a bug in either KendoUI or jQuery, I am not good enough in either to be sure which. I tend to like short code so I have taken to removing the closing tag in most of my HTML have have no direct content, so I would do: <div /> rather than <div></div>. With both the Kendo Grid and Template they generate different html depending on which syntax I use.

<div id="manGrid" class="col4" style="width: 800px; height: 500px; background-color: Green !important; "></div>
<p>Hello World</p>
<br /><br />
<div id="radGrid" class="col4" style="width: 800px; height: 500px; background-color: Yellow !important; " ></div>

Yields:
<div id="manGrid" class="col4" style="width: 800px; height: 500px; background-color: Green !important; "></div>
<p>Hello World</p>
<br>
<br>
<div id="radGrid" class="col4 k-grid k-widget" style="width: 800px; height: 500px; background-color: Yellow !important; " tabindex="0">

This would be the expected behavior, but the syntax I prefer give me.

Where as:
<div id="manGrid" class="col4" style="width: 800px; height: 500px; background-color: Green !important; " />
<p>Hello World</p>
<br /><br />
<div id="radGrid" class="col4" style="width: 800px; height: 500px; background-color: Yellow !important; " />

Yields:

<div id="manGrid" class="col4" style="width: 800px; height: 500px; background-color: Green !important; ">
<p>Hello World</p>
<br>
<br>
<div id="radGrid" class="col4 k-grid k-widget" style="width: 800px; height: 500px; background-color: Yellow !important; " tabindex="0">
</div>

Both have the same javascript code. The first div is replaced with a template while the second is replaced with a grid. The problem being is the second becomes a child of the first with the <div /> sentax, while they are peers with the <div></div> sentax.

Thanks
Randy

General Discussions

answered on 03 Jan 2012

0 answers

106 views

Documentation

Your documentation on this product is pretty sparse. Do you have plans to enhance? Thanks.

I'm also trying to figure out why i would choose your mobile product over jquerymobile. Can you help me here?

General Discussions

asked on 03 Jan 2012

1 answer

4.7K+ views

Drop Down display text

Hello, I'm curious if there is a way to have the drop down display one line of text constantly. I want to drop down to always display "Please select a field" no matter what is selected from the list below. Once the user makes a selection a field is added to a form and the user can again select another field so it doesn't make sense for the "Please select a field" message to be replaced with the chosen field. It would just be confusing.

Right now I have it set up so that element 0 is the "Please select" message and a bit of javascript that on change does what it's supposed to do and then selects element 0. This works, however there is a "Please select" item that the user sees along with the list of choices. It's far from ideal.

$(document).ready(function () {

SetupForm();

// Kendo Combo Box

$("#fieldToAdd").kendoDropDownList({ index: 0, change: onChange });

function onChange() {

var fieldToAdd = $("#fieldToAdd").data("kendoDropDownList");

value = fieldToAdd.value();

text = fieldToAdd.text();

if (value >= 0) AddFieldOnForm(value, text);

fieldToAdd.select(0);

}

}

<select id="fieldToAdd" class="inputfields" title="test" style="width: 152;">

<option value="-1" style="text-align: center;">Add Field</option>

<option value="5">Checkbox</option>

<option value="9">Checklist</option>

<option value="8">File Upload</option>

<option value="10">Label</option>

<option value="6">Multiple Choice</option>

<option value="7">Picklist</option>

<option value="12">CRM Picklist</option>

<option value="1">Text Single-line</option>

<option value="2">Text Multi-line Small</option>

<option value="3">Text Multi-line Medium</option>

<option value="4">Text Multi-line Large</option>

<option value="11">Subscription Management</option>

<option value="13">Star Rating</option>

<option value="14">Image</option>

</select>

EDIT: An acceptable solution would also be to disable the option from being visible when the drop down is expanded but still be able to programatically select it.

DropDownList

answered on 02 Jan 2012

15 answers

825 views

Data pulled from MySQL in JSON is not being displayed.

I have been browsing similar problems on these forums for a couple hours now, trying different things but I
cannot get the Grid to populate with a JSON datasource pulled from MySQL.

The view_inventory.php returns the json correctly if viewed through the browser. (Set to RETURN json, tried print and echo as well)

I know my way around js a bit, but this is getting past my learning point.

Any help would be appreciated.

EDIT: With some fiddling I got the grid to show up, but I only get a spinning "waiting" in the box, no data. Revised code below.

$(document).ready(function() {

$("#grid").kendoGrid({

dataSource: {

transport: {

read: {

url: "bin/view_inventory.php",

dataType: "json"

}

},

height: 250,

scrollable: true,

sortable: true,

filterable: true,

pageable: true,

columns: [

{

field: "id",

title: "ID"

},

{

field: "type",

title: "Type"

},

{

field: "name",

title: "Name"

},

{

field: "descripton",

title: "Description"

},

{

field: "price",

title: "Price"

},

{

field: "account",

title: "Account"

}

]

});

Data Source

answered on 02 Jan 2012

7 answers

220 views

Query options are not allowed

Hi
I successfully created a dataService with EF4 and OData enable
my uri is http://myserver/sa2.Web/sa2-Web-DomainService1.svc/OData/UserSet
And i successfully see the data using the OdataExplorer
http://www.odata.org/developers/odata-sdk

But when I try to retrieve the data to kendoGrid i obtain an error

<script type="text/javascript">
$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "http://myserver/sa2.Web/sa2-Web-DomainService1.svc/OData/UserSet"
}
},
columns: ["Id", "name"]
});
});
</script>

The table name is User with 2 columns Id and name

Could you help ?????
Thanks
Fred

This XML file does not appear to have any style information associated with it. The document tree is shown below.

<error xmlns="http://schemas.microsoft.com/ado/2007/08/dataservices/metadata">
<code/>
<message xml:lang="en-US">Query options are not allowed.</message>
</error>

Data Source

answered on 02 Jan 2012

0 answers

145 views

check box column in kendo grid

Can anyone give the simple example with chceck box column ,Tag All and Tag Range and UnTag All options

Grid

asked on 02 Jan 2012

0 answers

145 views

Treeview selected node in mvc 3

Hi,

I'm using kendo treeview with mvc 3 and create the treeview with product categories using unordered list. So i can expand the selected category but also want to select the selected category node. I can get the selected categories id and its "<li>" but even if i add ".k-state-selected" class to that <li> section, the node does not get selected. What else i can use to select the node that i want? Is adding that class to specified <li> element not enough?

Thanks

TreeView

asked on 02 Jan 2012

11 answers

280 views

oData google-like filter

With the Kendo DS and oData, is there a way to configure this so it searches all words not just an exact string?

Like if this is the text in the DB

"This is the string I want to find"

In the autocomplete I want to type
"string find" (without the quotes obviously)

Doable somehow?? I have it set to a contains filter already...

AutoComplete

answered on 31 Dec 2011

1 answer

267 views

Validation Message Placement Options

What options are there to adjust or define the placement location?

The form I am using is on our main page and only has two fields: username, password. They are inside a graphical container and the default placement pushes the images out of alignment.

Can we switch it to a window/modal or ideally have it show the error message to the right side of the fields, but outside of the current table?

I've reviewed the current Demo, Docs, and Forum but do not see any details on placement of the error messages.

Validation

answered on 31 Dec 2011