Real Software Forums

I want to add the datepicker example to a form and have it show and hide when a field has focus and loses focus.

So far I haven't been able to figure out how to show and hide the picker dynamically.

I tried adding this code in the FrameworkPropertyChanged handler.

Case "Visible"
if ControlAvailableInBrowser then
if value then
ExecuteJavaScript("$('#" + Me.ControlID + "').datepicker('_show');")
else
ExecuteJavaScript("$('#" + Me.ControlID + "').datepicker('_hide');")
end if
end if

The code executes when expected but produces this error in the browser.

Could not execute returned javascript: 'undefined' is not an object (evaluating '$.datepicker["_"+a+"Datepicker"].apply')
Source: $('#AJCvs7iy').datepicker('_show');

$('#AJCvs7iy').datepicker('_show');

RS.comm.ajax.begin();

I don't do a lot of javascript, but it seems from the error message that the code isn't executed directly as it would be in a static html page. Looking in the safari inspector I can see there is a div with the id shown in the source line, so I'm not sure why the object is undefined. How can I trace this down.

So with some more searching I figured out how to get the datepicker to attach to my textfield. I simplified things and just added the jquery js links in the app html header.

Then I was able to execute the javascript to attach the datepicker. I ditched the websdk example entirely.

Now the problem is how do I get the framework to recognize there should be a text changed event?

It seems that even when I manually ask for the text the web framework doesn't know it's there. I have to manually edit the date in the textfield before I can get that text from realbasic code?

So it turns out what I was looking for was the action method of the textfield.

So I was able to get the datepicker working without using the SDK quite simply.

The jquery includes go in to the app.htmlheader

<link type="text/css" href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/jquery-ui.css' rel="Stylesheet" media="all" />
<script type="text/javascript" src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script type="text/javascript" src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.js'></script>

In the shown event of the textfield

me.executejavascript "$('#"+me.ControlID+"_inner').datepicker({onSelect: function() {RS.controls['" + me.controlID + "'].action();}});"

If someone more familiar with the SDK would explain how to make this fit into the sanctioned APIs that would be great. I'm still a bit lost as to how to package this. I'm pretty happy with the simplicity and functionality of it now, but it would be nice if it didn't break in the future.

BTW, what are you guys using to debug JS?