Bining radio to boolean property

[Andrey]

Hello,

It looks like following code works ok if createNew : "false", but fails when createNew : false. Is there any workaround?

<input type="radio" value="true" name="type" data-bind="checked: createNew" />
<input type="radio" value="false" name="type"" data-bind="checked: createNew" />

[Atanas Korchev]

Hello,

 Thank you for reporting this. Right now only binding to "false" would work. We will add support for boolean values for the next official release.

Regards,
Atanas Korchev
the Telerik team

[Chris]

** EDIT **

To see these issues happening first, see this jsFiddle:

http://jsfiddle.net/Xxn22/1/

I understand *why* this doesn't work, due to the data being per row, rather than an overall ViewModel, but how on earth are we supposed to calculate simple visibility of objects? All I'm literally trying to achieve is to show the Download link if a variable matches a certain string.

Original post:

I wondered if this was originally the same issue as I'm having, but it turns out not to be... I've currently got a row template, such as:

<script id="gridRowTemplate" type="text/x-kendo-template">
<td><a data-bind="visible: isEnhancementReport" href="/EnhancementReport.aspx">Download</a></td>
</script>

And my view model (with all the bindings set correctly etc as I have a click event working with a different function):

isEnhancementReport: function() { return "true"; }

This does not work. I've tried, true as in the boolean term, not working either.

I've even tried:

isEnhancementReport: true;


And even this does not work... there must be support for templates in MVVM as my click event works. What's different with the visible/enabled bindings?

*Edit*

With further testing, even this doesn't work and automatically sets the anchor tag to display:none

<td><a data-bind="visible: true" href="/EnhancementReport.aspx">Download</a></td>

Very frustrating.

[Atanas Korchev]

Hello,

 The context of the template is not the root view model. It is the current item from the array specified via the source binding. This is described in our documentation here.

 <a data-bind="visible: true" 

will never work. Kendo MVVM binding expressions do not accept executable JavaScript code.

All the best,
Atanas Korchev
the Telerik team

[Chris]

Hi Atanas,

Thank you for your reply. It's understood about the contexts, but I find no tutorials anywhere or examples that achieve what I'm trying to do, which is basically access the ViewModel from the context of a row template.

Do you have any suggestions on this?

[Atanas Korchev]

Hi,

 The root view model is not accessible in templates when binding text/value/html/attr. You can only attach events to methods of the root view models as shown here: http://demos.kendoui.com/web/mvvm/source.html 

Regards,
Atanas Korchev
the Telerik team

[Chris]

Sorry to be a pain, but even if I wasn't using MVVM here, do you know how I'd achieve my goal in any way whatsoever?

<td># if (ListLoadState.Code === "Test") <a href="/EnhancementReport.aspx">Download</a> #</td>

This doesn't work either, even when the ListLoadState.Code does equal "Test". It doesn't work if I state if (true) either. #= and #: completely error out the template.

[Atanas Korchev]

Hi,

 The original topic of this thread was about binding a radio button to a boolean property of the view-model. I don't think your question is related to this. Please open a new forum thread.

All the best,
Atanas Korchev
the Telerik team

[Brandon Peterson]

Are boolean values now supported ? In Kendo 2014.1.318 I am still getting the string values. Perhaps I am missing a data-type attribute or something similar to accomplish this?

<ul class="radio">

    <li>

        <label>
               <input name="processed" type="radio" value="true" data-bind="checked: homeWarranty.planProcessed" />
               <span>YES</span>
          </label>

    </li>

    <li>

        <label>
               <input name="processed" type="radio" value="false" data-bind="checked: homeWarranty.planProcessed" />
               <span>NO</span>
          </label>

    </li>

</ul>

[Atanas Korchev]

Hello Brandon,

Boolean values are still not supported. I have created a github issue for this and we will look into implementing it.

Right now you can use a function to parse the boolean values. Here is how: http://dojo.telerik.com/amaSE

Regards,
Atanas Korchev
Telerik

 

 

[Peter]

I have the opposite problem.
I bind to the text "true" and it does not show checked 
<input type="checkbox" data-bind="checked: Value" />
The UI works within initial null values, but when I download database values which are string (eg "true/false") then the checkbox is always unchecked

[Peter]

At this stage, I presume you fixed the old situation by removing compatibility with strings? And that now only bools are valid?

[Atanas Korchev]

Hello,

We haven't fixed or implemented anything yet. Boolean values are not supported and the radio button value is always a string. Here is a demo: http://dojo.telerik.com/@korchev/IJoSe

Regards,
Atanas Korchev
Telerik

 

 

[Drazen]

Dear Atanas,

I am going through this thread and do not see the answer for the original question posted, and I am afraid I have the same issue.

Let's say we have a list of checkboxes to select items, and we have a radio button in each row to select a default item.

The problem is there is no way to do the bindings, since both things need to be in one template which has datasource = items.

For binding a radio group I'd need a separate property ('defaultItem' - which should be out of datasource feeding the template), so I have no access to.

So how to achieve a two way binding of this list of checkboxes and radio group?

Blagodarim and thank you very much!

 

 

[Daniel]

Hello,

The original post seems to be regarding type specific binding which is already supported as demonstrated in this demo. Unfortunately, I am not sure if I understand the problem based on the description. Could you provide the code that you are using and more detailed information about the issue?

Regards,
Daniel
Telerik

 

 

[Drazen]

Thanks for your response, and sorry for the confusion.
I have resolved the issue I had.

I was confused with the scope of a template's data source, and luckily found out that even if my template is bound to a collection that is a property of the viewModel I still have access to other properties of the viewModel at the root level.

The requirement was to have two columns, first one with checkboxes that allow multi item selection and a second one with radio buttons to choose a default item.

Feel free to delete my previous post if it is out of the subject of this thread.

I was struggling why my radio group cannot be bound to a boolean flag as part of a collection of objects like this one:

var item = kendo.observable({

ItemId: "1",
IsSelected: true,
IsDefault: false

});

After understanding how radio group binding works I realized that it's property should go out of the collection to a viewModel root level:

viewModel = kendo.observable({

items: [],
DefaultItemId: "1"

});

However that looked like an issue because my template seemed to be working only on the 'items' scope, so I wouldn't have an access to a 'DefaultItemId' property which seemed to be out of scope

<table id="elements" class="template-table" data-template="group-template" data-bind="source: items" ></table>

However that was not correct so I was able to use:
<script id="group-template" type="text/x-kendo-template">
<tr class="border-bottom" data-contextidauto="{c}userregionassociation-datarow">             

<td class="isSelectedTD" ><input type="checkbox" data-bind="checked: IsSelected" /></td>             
<td class="isDefaultTD" ><input type="radio" name="defaultRegion" value="#= ItemId#" data-bind="checked: DefaultItemId"/></td>