Hack: using live bindings outside templates

re: Hack: using live bindings outside templates

Bertrand Le Roy — Tue, 21 Oct 2008 05:11:56 GMT

@Corey: yes, you can use it purely on the client-side but there is little documentation for that currently. There is a specific download for just the client files on the releases page. The scripts that you need are CommonToolkitScripts, DateTimeScripts, PopupExtender, AnimationScripts, ThreadingScripts. You'll also need the calendar css and of course the CalendarBehavior script. The behavior can be instantiated using $create.

re: Hack: using live bindings outside templates

Corey J gaudin — Tue, 21 Oct 2008 04:55:58 GMT

Bertrand,

Can you utilize that Calendar completely Client-side? I have used it Server Side, but I am using it on the latest blog post (using Client Template and MVC ASP.NET) on polymorphicview.blogspot.com/.../update-to-json-service-provider-using.html

I am trying to bind a client side only Calendar control to that textbox that doesnt mess up the Live Template binding to it. The jQuery Datepicker breaks the Template Binding to it. I figured the Calendar Picker built into AJAX Toolkit would work, but have no idea how to utilize it completely client-side.

Any ideas?

re: Hack: using live bindings outside templates

Bertrand Le Roy — Tue, 21 Oct 2008 04:18:06 GMT

@Corey: I haven't tried the jQuery Datepicker but you can absolutely 2-way bind a textbox to a date. The trick is to use a convert function and a convertBack function on the binding to go from date to string and from string to date. The functions can use String.format and Date.parseLocale. We do have a date picker in the Ajax Control Toolkit: the Calendar behavior. www.asp.net/.../Calendar.aspx

re: Hack: using live bindings outside templates

Corey J gaudin — Tue, 21 Oct 2008 01:12:02 GMT

How do you 2-way bind a date to a textbox control? When I utilize this AJAX Client Templating to bind to a textbox and add the jQuery Datepicker, it goes all nuts. Changing the Date on the textbox changes it to a string and doesnt really 2-way bind correctly. Is there some Datepicker associated with this library I can use to test so that it maps to and from the Javascript Object seamlessly?

re: Hack: using live bindings outside templates

Drew Marsh — Sun, 19 Oct 2008 19:37:08 GMT

Bertrand,

Yeah, a coworker gave it a shot shortly after he saw my comment and we saw that it worked. I deserve a smack for not trying it before asking. :P It's just that it's not shown anywhere in the Road Map being used that way and it's always talked about in the context of templates so I thought maybe we regressed somehow.

Anywho, glad to see it works and looking forward to new info @ the PDC next week!

Cheers,

Drew

re: Hack: using live bindings outside templates

Bertrand Le Roy — Thu, 16 Oct 2008 06:31:02 GMT

@Drew: I'm certainly not going to smack you but the exact code that is in your comment will work just fine provided you write the button and textbox controls (or re-use the old ones from Futures). The sys:attach attributes will work just anywhere and once it's been parsed the rest of the tag is fully activated. It's a binding on its own that will need to be in a template.

re: Hack: using live bindings outside templates

Bertrand Le Roy — Thu, 16 Oct 2008 05:49:19 GMT

@gramic: just looking at all attributes on all elements will kill initial performance. The way activate works, it only has to look at one thing on each element: sys:attach. I hope this clarifies.

re: Hack: using live bindings outside templates

gramic — Wed, 15 Oct 2008 10:15:57 GMT

Using markup that way is much better then using Sys.Binding class from code. I saw that it is possible to set sys:activate="*" at the parent tag of the template.

Even that I thought about a way to data bind without creation of any template compilation but just parse properties.

As in your example: the DOM elements are already created and the data binding markup is in the properties too. Maybe just tracing the DOM properties and do the Data Binding will suffice and will not take the performance away.

re: Hack: using live bindings outside templates

Mojtaabaa — Wed, 15 Oct 2008 04:43:34 GMT

thanks for the article.i am digesting it! ;)

re: Hack: using live bindings outside templates

Drew Marsh — Tue, 14 Oct 2008 23:04:23 GMT

Totally! So what's the solution for the simple scenario that I want to have an <input type=text/> in my page and an <input type=submit> and want to hook up the TextBox and Button controls to those to have some behavior? In XMLScript I would have done:

<page>

</components>

</page>

</script>

Now I would expect to just be able to do:

Where "doSomething" is just a global JS method in my page that does some processing in response to the click event like grab the textbox and check to make sure it has a valid value first.

AFAIK this scenario just isn't possible anymore, so unless you're doing templating the markup extensions are completely useless, right? Therefore you're forced to write JavaScript to $create the static controls on your page.

Thanks,

Drew

P.S. Admittedly I haven't had time to tinker enough with the new bits to know for sure, so feel free to smack me and point me to a sample if it is indeed possible. ;)