0

I want to amend the width of table cells if a certain condition is met, which I determine server-side in PHP. Here is the JS that will change the width:

<script type='text/javascript'>document.getElementById('QuestionDesignTable_r0c0').style.width = '20%';
document.getElementById('QuestionDesignTable_r0c1').style.width = '30%';
document.getElementById('QuestionDesignTable_r0c2').style.width = '20%';
document.getElementById('QuestionDesignTable_r0c3').style.width = '30%';</script>

If I put this into the onclick event of a button on my form, it works - the cell widths adjust. However, I want it to happen without needing to click a button. I want it to happen as soon as the form is rendered. So I thought "put it into the JS in the head". Nothing happens. "Put it into the onload event of the body tag". Nothing happens.

I think there is a related issue that I found a few days ago. I set the default table cell widths in an external CSS. If I add a button to my form with onclick

alert(document.getElementById('QuestionDesignTable_r0c0').style.width);

the dialog that pops up is blank. I can see the widths are being determined by CSS, but it is as if the control doesn't actually store the width property.

I think I lack knowledge of the construction/execution lifecycle of an HTML page with respect to how CSS feeds into the properties of the controls, but I'm not sure where to look. So I really have two questions, (i) where can I put the JS so that it executes (AND IS EFFECTIVE) as soon as the form is rendered (ii) is there a good article somewhere that would tell me more.

DJDave
  • 865
  • 1
  • 13
  • 28
  • Where is the condition that you are trying to test? – Andy G Feb 09 '18 at 14:19
  • add the script before the end of body tag reference https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element?noredirect=1&lq=1 – Punith Jain Feb 09 '18 at 14:20
  • OR wrap in `window.onload=function() {.... }` or the add to the load eventhandler using addEventListener – mplungjan Feb 09 '18 at 14:23
  • mplungjan - I think you are confusing duplicate questions with duplicate answers. But hey, respect to Punith Jain for pointing me there. – DJDave Feb 09 '18 at 14:42
  • Andy G - I don't think the condition is relevant, other than to explain the reason why I needed to change the widths straight away, which is why I didn't include it – DJDave Feb 09 '18 at 14:43

0 Answers0