PC v MAC webdialog populate

Dan Rathbun

[floatr:j2u13kn5]

[/floatr:j2u13kn5]TIG.. I did some checking over at the Apple Discussions

Did a search on "input type=checkbox"
and got a couple of hits with sample code.

It looks like these guys are using "0" and "1"
as the checked property value:

%(#804000)[<TD><input type="checkbox" name="AutoLogin"]%(#BF4000)[**value="1"**]%(#804000)[>Automatic Login</TD>]

URL:Topic : Safari ... cannot redirect to locations starting with "(null):" -- What?

%(#804000)[<label for="cb_cookieuser_navbar"> <input type="checkbox" name="cookieuser"]%(#BF4000)[**value="1"**]%(#804000)[tabindex="103" id="cb_cookieuser_navbar" accesskey="c" />Remember Me?</label>]

URL: Topic : Safari Browser does not play well with vbulletin forums (save login?)!

TIG

Dan, thanks. I have checked="checked" [i.e. checked] and checked=null [i.e. false] working fine on a PC and I'm waiting for feedback from some MAC testers...
The value= attribute is separate from the checkbox= issue - So I can get SUp to read the 'value' from the item I have to set its value='true' or 'false' according to the item's checked state - this is fine... BUT as I want to change the checked status of a checkbox with js (perhaps because some other checkbox changes these should not be checked either) then I change the value and checked together - fine on PC but fails on a MAC - though the jury's out on checked=null till the feedback arrives...
If the null option fails on the MAC I'll look at testing the value='0' / '1' alternatives

I really can't seen where this is falling over........

thomthom

have you considerd using a framework that will take care of these crossplatform issues for you? They are great time savers. Lets you focus on the making.

TIG

I am currently getting favorable results for the MAC testers using checked="checked" and checked=null !!!
The PC version already worked... so I'll report back when the jury's verdict is finalized.

TIG

I think I have the solution

document.getElementById("myCheckBox").setAttribute("checked", "checked");
document.getElementById("myCheckBox").setAttribute("checked", null);
document.getElementById("myCheckBox").removeAttribute("checked");

The first line 'checks' a checkbox in js... BUT... to 'uncheck' it the second AND third lines are needed
Some browsers/OSs want you to set its value to something 'false' [like null or false or ''], BUT some other browsers/OSs will take any setting at all to be 'true' and will therefore still 'check' it irregardless... so the only way to then 'uncheck' it is to remove its 'checked' attribute completely as in the third line!
Combining the last two lines should 'uncheck' a checkbox in most browsers/OSs ?
On a PC the second alone works but the third alone fails [and is ignored].
On a MAC the second alone fails but the third alone works.
Combining them should work 'cross-platform'

Dan Rathbun

Hmmm... I'll bet we also have differing behaviour in regard to the defaultChecked and defaultValue properties on the two platforms.

defaultChecked
http://msdn.microsoft.com/en-us/library/ms533715(v=VS.85).aspx

defaultValue
http://msdn.microsoft.com/en-us/library/ms533718(v=VS.85).aspx

Dan Rathbun

@tig said:

document.getElementById("myCheckBox").removeAttribute("checked");
>

On a PC the second alone works but the third alone fails [and is ignored].

Acording to:
http://msdn.microsoft.com/en-us/library/ms533556(v=VS.85).aspx
the above using "removeAttribute("checked")" is supposed to work on PC but in IE8 mode.

You never said what PC browser ver that the tests were done on, and if you tried IE8 mode.

TIG

It has to be multi-browser and platform including IE7 etc ?
I think this latest fix works for everything so far...

Dan Rathbun

IE7(I haven't upgraded to IE8 yet.)

Results the same for both:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Transitional//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 STRICT//EN" "http://www.w3.org/TR/html4/strict.dtd">

ID="myCheckBox"

Check the checkbox:
%(#408000)[WORKS]: myCheckBox.setAttribute('checked',**1**); %(#408000)[WORKS]: myCheckBox.setAttribute('checked',**'any string'**); %(#408000)[WORKS]: myCheckBox.setAttribute('checked',**true**); %(#408000)[WORKS]: myCheckBox.checked=**true**; %(#804000)[FAILS]: myCheckBox.defaultChecked=**true**;

Uncheck the checkbox:
%(#408000)[WORKS]: myCheckBox.setAttribute('checked',**0**); %(#408000)[WORKS]: myCheckBox.setAttribute('checked',**null**); %(#408000)[WORKS]: myCheckBox.setAttribute('checked',**false**); %(#408000)[WORKS]: myCheckBox.checked=**false**; %(#804000)[FAILS]: myCheckBox.defaultChecked=**false**; %(#804000)[FAILS]: myCheckBox.removeAttribute(**'checked'**);

TIG

This is as expected - the checking is easy just set the 'checked' attribute to something 'positive' for a PC [or 'anything at all' for say a MAC - which causes the MAC's 'unchecking' conundrum]...
So it's the 'unchecking' that is the pain...
The myCheckBox.setAttribute('checked',null); will work on most platforms [like the PC] but the myCheckBox.('checked'); fails on the PC - however, but since that's after the ' =null' version has worked it's no matter...
The will work on some platforms after the preceding myCheckBox.setAttribute('checked',null); has just failed [e.g. a MAC where ' =null' actually checks the box ! then the removeAttribute successfully unchecks it].

I haven't tried the exact myCheckBox.checked=true; / myCheckBox.checked=false on a MAC test... but I suspect it'd fail as myCheckBox.setAttribute('checked',false); does fail...

This is all too convoluted - but at least I seem to have a workaround that works on all tested platforms.

Dan Rathbun

Have you tried the integers 0 | 1 on the Mac yet?

It's so weird.. checked is supposed to be a boolean.

I'd consider this a Webkit bug.
Does anyone know if there is a website specific to webkit? Forums, BugReports, etc?

Dan Rathbun

@dan rathbun said:

I'd consider this a Webkit bug.
Does anyone know if there is a website specific to webkit? Forums, BugReports, etc?

To answer myself .. (to myself I says..)

WebKit

Open Source Web Browser Engine

WebKit (webkit.org)

[url=https://bugs.webkit.org/query.cgi?format=specific&product=WebKit:1174kw44]The Webkit Bugzilla[/url:1174kw44]

A search on "checkbox" gets 59 open hits. I did not see what had been closed.

TIG

I also noticed belatedly that the disabled attribute works fine on a PC when set as true/'true'/'disabled' and conversely is ignored when set to false/'false' etc BUT on a MAC it must be set to ' disabled' [or any other value including false!] and to ignore it you must use removeAttribute('disabled') rather like the fix for the checkbox attribute... BUT weirdly on a PC the removeAttribute('disabled') also works, when it didn't for the checked attribute

TIG

To recap:
When using checkboxes and radio button toggles in your webdialog html code you can set an item's value attribute to ' true' or ' false' when they are clicked by using a callback e.g.
onclick="if(this.checked)(window.location='skp:itemx@true');else(window.location='skp:itemx@false')
and in the ruby def itemx(checked) you say

if checked=="true"
  js=("document.getElementById(\"itemx\").setAttribute(\"value\",\"true\");")
  @dlg.execute_script(js)
else
  js=("document.getElementById(\"itemx\").setAttribute(\"value\",\"false\");")
  @dlg.execute_script(js)
end
### etc

then when you close the dialog/tool your def deactivate() gets all of the values for the items [using values={} #loop through the list of items...# values[id]=@dlg.get_element_value(id) - it's often better to hash it for later use] and puts them into model [or SUp] as attributes so they are used the next time you open the tool...
You can use the html's onclick= or onChange= to save values from textboxes or the state of 'toggles' like this.
These toggles should be boolean = true/false BUT they behave oddly on different platforms/browsers
The problem arises when you want to auto-set checkboxes and radio buttons at launch, or when some other toggle is changed - e.g. some checkboxes are auto-checked if the parent one has been checked too etc.
Your html should start with all checkboxes unchecked - i.e NO checkbox= property at all in field.
Your code then adds something like
js=("document.getElementById(\"itemx\").setAttribute(\"checked\",\"checked\");") @dlg.execute_script(js) if it's to be checked [this works on all platforms] BUT if it's to be unchecked then for a PC you should use
js=("document.getElementById(\"itemx\").setAttribute(\"checked\",null);") @dlg.execute_script(js) unfortunately on a MAC this get read as true and it'll stay checked! So you need to add the extra line after this
[ruby:1pgs0rem]js=("document.getElementById("itemx").removeAttribute("checked");")
@dlg.execute_script(js)[/ruby:1pgs0rem] this will work on a MAC but fail on most PCs - this way you make it unchecked one way or another !!!
Similarly if you have fields that are disabledif certain toggles are met then you'd expect something similar - it's not quite the same [start with NO [ruby:1pgs0rem]disabled=[/ruby:1pgs0rem] property for any field]...
[ruby:1pgs0rem]js=("document.getElementById("itemx").setAttribute("disabled","disabled");")
@dlg.execute_script(js)[/ruby:1pgs0rem] if it's to be disabled [this works on ALL platforms] BUT if it's to be enabled then for a PC OR a MAC you should use
[ruby:1pgs0rem]js=("document.getElementById("itemx").removeAttribute("disabled");")
@dlg.execute_script(js)[/ruby:1pgs0rem] which works for both platforms this time
So to recap the recap - for toggled settings [ruby:1pgs0rem]checked/radio/disabled[/ruby:1pgs0rem] to become [ruby:1pgs0rem]inactive[/ruby:1pgs0rem] you should use
[ruby:1pgs0rem].setAttribute("checked",null)...[/ruby:1pgs0rem] then [ruby:1pgs0rem].removeAttribute("checked")[/ruby:1pgs0rem] for checkbox or radio
[ruby:1pgs0rem].removeAttribute("disabled")[/ruby:1pgs0rem] for any item - for cross-platform compatibility...
and to enable them [perversely 'disabled' needs to be 'enabled' !!] use
[ruby:1pgs0rem].setAttribute("checked","checked") or .setAttribute("disabled","disabled")[/ruby:1pgs0rem]
for all platforms - the values like "checked" or "disabled" ensure suitability on all platforms and for XHTML too.

Dan Rathbun

Sounds like it's time for a revsion to the "Lost Manual"

@tig said:

To recap:
When using checkboxes and radio button toggles in your webdialog html code you can set an item's value attribute to ' true' or ' false' when they are clicked by using a callback e.g.

onclick="if(this.checked)(window.location='skp:itemx@true');else(window.location='skp:itemx@false')"

why a callback?

I do this all in Js:
%(#8000BF)[onclick="if(this.checked){this.value='1'}else{this.value='0'};"]
or whatever values you want to set them to be (I like logic 0|1 myself.)

I mean if your not going to poll all the control values until a user click's the OK or Close button, it seems to me that the callbacks are added work.

TIG

I appreciate that if the only thing you want to do is 'set' a value [or 'remove' it] you can do it directly in js, BUT I do the callback when it does lots of other things to do too, then the value setting is just part of it - the sample if/else code is a pared down version...

Also I've found that even using =1/=0 for true/false goes wrong in some setups, but "checked"/removing_the_attribute for true/false then works instead...

thomthom

Yes - that is what I do as well - I use the JS onclick event to set the checkbox value to reflect the state of the checkbox.

And this is a great example for using frameworks - with jQuery I just make a live onclick event so all checkboxes created will behave like this. http://api.jquery.com/live/

(untested - didn't have my reference code at hand)
$('input[type=checkbox]').live('click', function() { $( this ).val( $(this).is(':checked').toString() ); });

Not sure if that catches state change caused by keyboard though.

If you don't need continuous update of the checkbox values, but rather at a single event, this works as well:
// Set Checkbox values to reflect checked state so SU Ruby's $('input[type=checkbox]').val( function(index,value){ return $(this).is(':checked').toString() } );

TIG

The question is can you get it to have a checkbox that when it is checked/unchecked [true/false] controls 4 other checkboxes, so that they are all set to be unchecked and disabled if it is unchecked, and if it is checked then they all become enabled and the first one is also ticked by default. I got this working fine on a PC with true/false etc but the MAC version refused to work when resetting from the SKP's attributes on a load etc - that is where I found the checked=null PLUS a follow up remove_checked_attribute and remove_disabled_attribute worked across all platforms...

Dan Rathbun

A few Safari questions:

Does Safari automatically keep it's WebKit up to date?

Did you ask your testers what WebKit version their Safari was using?

Still wondering if this behaviour is a WebKit bug...

TIG

They are such a varied and clueless bunch they almost certainly won't know - I can't press it as they have helped above and beyond the call of duty already.