Thursday, September 2, 2010

Getting what I need from Javascript (dumpProps)

Today I needed to access something that existed in a telerik library, essentially to do put a date selected in a calendar in a custom text box (Since I needed the text box to take M/yyyy, yyyy, and M/DD/yyyy and the input control in the nifty datePicker control wouldn't let you do that as far as I could tell).

Here's a link that will get you started
Date Picker populate a text field however while that works for calendar be careful because my script needed a different method: get_newValue.

Probably because the calendar control is only a subcontrol of the RadDatePicker Control.


function OnDateSelected(sender, eventArgs) {
//dumpProps(sender);
if(sender._clientStateFieldID.indexOf("<%= rdpStartDate.ClientID %>") != -1){
var textbox = $find("<%= rtbStartDate.ClientID %>");
}
if (sender._clientStateFieldID.indexOf("<%= rdpEndDate.ClientID %>") != -1) {
var textbox = $find("<%= rtbEndDate.ClientID %>");
}
textbox.set_value(eventArgs.get_newValue());
}


Now the way I created this was to cheat a bit, I didn't know what properties the sender would have so I decided to dump it with the following trick I found online.



function dumpProps(obj, parent) {
// Go through all the properties of the passed-in object
for (var i in obj) {
// if a parent (2nd parameter) was passed in, then use that to
// build the message. Message includes i (the object's property name)
// then the object's property value on a new line
if (parent) { var msg = parent + "." + i + "\n" + obj[i]; } else { var msg = i + "\n" + obj[i]; }
// Display the message. If the user clicks "OK", then continue. If they
// click "CANCEL" then quit this level of recursion
if (!confirm(msg)) { return; }
// If this property (i) is an object, then recursively process the object
if (typeof obj[i] == "object") {
if (parent) { dumpProps(obj[i], parent + "." + i); } else { dumpProps(obj[i], i); }
}
}
}


Next step is to move the calendar back to the text box. But this should help you find any properties of objects in those vast library's that are being used these days. Telerik or otherwise

1 comment:

  1. Cool tip! Thanks for helping people understand how to work with the Telerik client-side API. We try to document as many properities as possible for all APIs, but this is a great trick. Another option, of course, is to use a tool like Firebug in Firefox to debug your JavaScript code and inspect the "sender" object to see its properties.

    -Todd

    ReplyDelete