[CLOSED] App Studio 8201 Javascript for checkbox

January 16, 2018, 06:05 PM

Michele Brooks

I'm working with a self-serve html page that has embedded javascript. After upgrading from 8009 to 8201, some of the javascript doesn't appear to be working. The following 8009 code is not working in 8201. When the user clicks on checkbox1, a year/month option, the year/month listboxes should become active. Thanks.

 
WF 8009 code that worked in 8009 but not in 8201
function checkbox1_onclick(ctrl) {
    if (document.getElementById("checkbox1_0").checked)
       {
          document.getElementById("checkbox2_0").disabled = true;
          document.getElementById("checkbox3_0").disabled = true;
       document.getElementById("checkbox4_0").disabled = true;
          document.getElementById("listbox10").disabled   = true;
          document.getElementById("listbox11").disabled   = true;
          document.getElementById("listbox5").disabled    = false;
          document.getElementById("listbox6").disabled    = false;
          document.getElementById("listbox7").disabled    = true;
       }
       else
       {
          document.getElementById("checkbox2_0").disabled = false;
          document.getElementById("checkbox3_0").disabled = false;
       document.getElementById("checkbox4_0").disabled = false;
          document.getElementById("listbox10").disabled   = true;
          document.getElementById("listbox11").disabled   = true;
          document.getElementById("listbox5").disabled    = true;
          document.getElementById("listbox6").disabled    = true;
          document.getElementById("listbox7").disabled    = true;
//          document.getElementById("calendar1").value      = "        ";
//       document.getElementById("calendar2").value      = "        ";
       }
}
//*
//****************************************************************************************************************************************
//End function checkbox1_onclick


WF 8201 code that I tried, but does not work
//Begin function form1Submit_onclick
function form1Submit_onclick(ctrl) {
}
//End function form1Submit_onclick
//Begin function checkbox1_onclick
//****************************************************************************************************************************************
//* If Month/Year is checked, enable the Month and Year listbox and disable all other date selection options.
//*
function checkbox1_onclick(ctrl) {
    if (document.IbComposer_getComponentById("checkbox1_0").checked)
       {
          document.IbComposer_getComponentById("checkbox2_0").disabled = true;
          document.IbComposer_getComponentById("checkbox3_0").disabled = true;
          document.IbComposer_getComponentById("checkbox4_0").disabled = true;
          document.IbComposer_getComponentById("listbox10").disabled   = true;
          document.IbComposer_getComponentById("listbox11").disabled   = true;
          document.IbComposer_getComponentById("listbox5").disabled    = false;
          document.IbComposer_getComponentById("listbox6").disabled    = false;
          document.IbComposer_getComponentById("listbox7").disabled    = true;
       }
       else
       {
          document.IbComposer_getComponentById("checkbox2_0").disabled = false;
          document.IbComposer_getComponentById("checkbox3_0").disabled = false;
       document.IbComposer_getComponentById("checkbox4_0").disabled = false;
          document.IbComposer_getComponentById("listbox10").disabled   = true;
          document.IbComposer_getComponentById("listbox11").disabled   = true;
          document.IbComposer_getComponentById("listbox5").disabled    = true;
          document.IbComposer_getComponentById("listbox6").disabled    = true;
          document.IbComposer_getComponentById("listbox7").disabled    = true;
//          document.getElementById("calendar1").value      = "        ";
//       document.getElementById("calendar2").value      = "        ";
       }
}
//*
//****************************************************************************************************************************************
//End function checkbox1_onclick

This message has been edited. Last edited by: FP Mod Chuck,

January 17, 2018, 01:56 AM

Chaudhary

Michele did you checked the controls id ? after migration ids are same in both environment pages or changed ?

January 17, 2018, 03:22 AM

Frans

First check if the control is properly being called:

function checkbox1_onclick(ctrl) {
alert(IbComposer_getComponentById("checkbox1_0").checked);
if (document.IbComposer_getComponentById("checkbox1_0").checked)
{
document.IbComposer_getComponentById("checkbox2_0").disabled = true;
document.IbComposer_getComponentById("checkbox3_0").disabled = true;
document.IbComposer_getComponentById("checkbox4_0").disabled = true;
document.IbComposer_getComponentById("listbox10").disabled = true;
document.IbComposer_getComponentById("listbox11").disabled = true;
document.IbComposer_getComponentById("listbox5").disabled = false;
document.IbComposer_getComponentById("listbox6").disabled = false;
document.IbComposer_getComponentById("listbox7").disabled = true;
}
else
{
document.IbComposer_getComponentById("checkbox2_0").disabled = false;
document.IbComposer_getComponentById("checkbox3_0").disabled = false;
document.IbComposer_getComponentById("checkbox4_0").disabled = false;
document.IbComposer_getComponentById("listbox10").disabled = true;
document.IbComposer_getComponentById("listbox11").disabled = true;
document.IbComposer_getComponentById("listbox5").disabled = true;
document.IbComposer_getComponentById("listbox6").disabled = true;
document.IbComposer_getComponentById("listbox7").disabled = true;
// document.getElementById("calendar1").value = " ";
// document.getElementById("calendar2").value = " ";
}
}

if you don't get the alert you might need to check if there is a task set for it. There is also a seperate event for this: Checkbox: Check / Checkbox: Uncheck

January 17, 2018, 09:27 AM

Michele Brooks

quote:
Originally posted by Chaudhary:
Michele did you checked the controls id ? after migration ids are same in both environment pages or changed ?

Thanks for responding. I checked the control ids and they are the same. My javascript doesn't appear to be working for the checkboxes. Might have to redo the entire page.

January 17, 2018, 09:28 AM

Michele Brooks

quote:
Originally posted by Frans:
First check if the control is properly being called:

function checkbox1_onclick(ctrl) {
alert(IbComposer_getComponentById("checkbox1_0").checked);
if (document.IbComposer_getComponentById("checkbox1_0").checked)
{
document.IbComposer_getComponentById("checkbox2_0").disabled = true;
document.IbComposer_getComponentById("checkbox3_0").disabled = true;
document.IbComposer_getComponentById("checkbox4_0").disabled = true;
document.IbComposer_getComponentById("listbox10").disabled = true;
document.IbComposer_getComponentById("listbox11").disabled = true;
document.IbComposer_getComponentById("listbox5").disabled = false;
document.IbComposer_getComponentById("listbox6").disabled = false;
document.IbComposer_getComponentById("listbox7").disabled = true;
}
else
{
document.IbComposer_getComponentById("checkbox2_0").disabled = false;
document.IbComposer_getComponentById("checkbox3_0").disabled = false;
document.IbComposer_getComponentById("checkbox4_0").disabled = false;
document.IbComposer_getComponentById("listbox10").disabled = true;
document.IbComposer_getComponentById("listbox11").disabled = true;
document.IbComposer_getComponentById("listbox5").disabled = true;
document.IbComposer_getComponentById("listbox6").disabled = true;
document.IbComposer_getComponentById("listbox7").disabled = true;
// document.getElementById("calendar1").value = " ";
// document.getElementById("calendar2").value = " ";
}
}

if you don't get the alert you might need to check if there is a task set for it. There is also a seperate event for this: Checkbox: Check / Checkbox: Uncheck

Thanks for responding. I did not get an alert. There is a task set for it and an event for all of the checkboxes. The javascript for the checkboxes is no longer working.

January 17, 2018, 09:43 AM

Frans

In that case I would check your html source and see if the task is there.

it should be something like this

 
<task id="taskx" trigger="click" specifictrigger="checkbox1">
<taskitem id="JavaScript call" sourcetype="typeJScript" targettype="typeJScript" targetname="checkbox1_onclick"/></task>

I would try to remove the task and add it again.

January 17, 2018, 11:27 AM

Michele Brooks

quote:
Originally posted by Frans:
In that case I would check your html source and see if the task is there.

it should be something like this
 
<task id="taskx" trigger="click" specifictrigger="checkbox1">
<taskitem id="JavaScript call" sourcetype="typeJScript" targettype="typeJScript" targetname="checkbox1_onclick"/></task>
I would try to remove the task and add it again.

I did as you suggested. Thanks so much, but it appears that the OnClick Event does not work for one of my list boxes. I had an OnClick Event for listbox3 that was not working properly. I deleted it and tried to add the Event back in. Now, when I hover the mouse over the OnClick Event I get a gray bar that appears. When I click on the ellipse button, it doesn't trigger the Event.

January 17, 2018, 12:23 PM

Frans

Hmm but there is no listbox3 in your function. Is listbox3 dependent on one of the other listboxes in your function? You could try IbComposer_ResetDownChainControls(ctrl); to reset the chain.

January 17, 2018, 12:31 PM

Michele Brooks

quote:
Originally posted by Frans:
Hmm but there is no listbox3 in your function. Is listbox3 dependent on one of the other listboxes in your function? You could try IbComposer_ResetDownChainControls(ctrl); to reset the chain.

Listbox3 Event was there, but I had deleted because I couldn't get it to work again. Listbox3 is not dependent on any of the other listboxes. That Event triggers an action when a report in listbox3 is clicked.

January 18, 2018, 04:02 AM

Frans

Something seems to be corrupted. I've seen it before with upgrades. I think the best way forward is to manually rebuilt the page with a new htm page or open a case with IBI to let them find what went wrong. If the page is not too complex, I would rebuilt it completely and copy your javascript functions