How to make checkbox checked/unchecked in SUP 2.2 using custom.js?

[Former Member]

Hi, everyone. I am developing a hybrid mobile application using the SUP 2.2. I have encountered this problem that checkbox in my listview which i customised at the custom.js cannot be checked. I want to make these checkboxes checked/unchecked using the custom.js. Can someone please advice me how to solve this problem?

Really appreciate your help and thank you in advance.

Regards,

Theary

[Dan_vL]

This sample may be of interest as I believe it displays a set of checkboxes.

Custom Controls https://cw.sdn.sap.com/cw/docs/DOC-148847

[Former Member]

Hi Daniel Van Leeuwen,

I am unable to access the link that you have provided. It directs me to just accept the code exchange term of use. How can i see the set of checkboxes that you mentioned.

Thanks,

Theary

[Jitendra_Kansal]

Once you open that link, click on "Login" , then you will see a message "You are being logged in" , Once login is done, open the same link in a new tab, then i believe you will able to the content available to that link.

Rgrds,

Jitendra

[Former Member]

HI Jitendra,

I have followed your steps but i am still unable to see the content of that link provided.

Regards,

Theary

[former_member186566]

Hi Theary Phalla

Have you implemented checkboxes in listview?

Usually listview has a common overlapping layer on top of each row. If you have implemented checkbox, that may be overlapped within that layer. So you will just have the access for the layer not on checkbox. To fix this, increase the z-index css property value for checkbox. For you must have css knowledge.

Share the screen shot of the list view if possible.

If it is not a CSS issue, you can implement the below method in custom.js

in jquery mobile html

<input type="checkbox" id="myCheck" onClick="callCheck()">

in custom.js

function callCheck()

{

var x = document.getElementById("myCheck").checked;

alert(x);

}

Regards

Yokesvaran Kumarsamy

[Former Member]

Hi Yokedvaran kumarasamy,

This is what i wrote inside the custom.js

This is the output when i assigned to the device

Please help me check, thank you very much. Meanwhile, I will try to add in the onClick() and see whether or not it is working.

Regards,

Theary

[former_member186566]

Hi Theary Phalla

As i said, its a layer issue only. Content within list(row) cannot be accessed directly, its overlapped with one more layer and checkbox and other fields will not have access. So if you clicked on the list, it will take you to next screen.

Increase your z-index css property within a input checkbox tab,

<input type="checkbox" name="checkboxlist" style="z-index:999999999" ......

Try this. higher z-index values brings the field to front for better accessing. If possible i will share the sample code later.

Regards

Yokesvaran Kumarasamy

[Former Member]

Hi Yokesvaran kumarasamy,

Thank you for your help, i had already followed like what you mentioned to increase the z-index of the checkbox but it is still does not work.   If possible, could you please share the sample code? Your help is really appreciated.

Thank you.

Theary

[midhun_vp]

Download the sample app from here, https://www.dropbox.com/sh/wwrt0s19tws9s0c/eiM0hc8jIz

Open sample.html in the folder to see the documentation. It was the example given by Dan. it shows how to use multiple check boxes.

- Midhun VP