SuiteCRM Version 7.2.1
Sugar Version 6.5.20 (Build 1001)
Okay so to be clear here, I know how to add an onClick event to a checkbox, the problem is that I am unsure how to do this specifically within SugarCRM.
I have a Multi-Select field in SugarCRM. It needed to be a Multi-checkbox, but HTML fields within SugarCRM are "Read-only". So I needed to edit the existing field and change it a Multi-checkbox. If found that answer here.
Well, now I have a multi-checkbox such as below with a "none" option. What I want now to happen is in the EditView, when a user clicks "none of the above", all other options are disabled and un-checked.
Here is the normal code that's generated for the HTML:
<p style="height: 200px; overflow: scroll; margin-bottom: 1.5em; width:30%" class="select">
<input type="hidden" id="typesoflicenses_c_multiselect" name="typesoflicenses_c_multiselect" value="true">
<label><input type="checkbox" name="typesoflicenses_c[]" value="1" id="typesoflicenses_c" title="">Life Insurance</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="2" id="typesoflicenses_c" title="">Securities</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="3" id="typesoflicenses_c" title="">CPA</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="4" id="typesoflicenses_c" title="">Attorney</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="5" id="typesoflicenses_c" title="">Mortgage Broker</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="6" id="typesoflicenses_c" title="">Real Estate</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="7" id="typesoflicenses_c" title="">Enroller</label><br>
<label><input type="checkbox" name="typesoflicenses_c[]" value="8" id="typesoflicenses_c" title="">None</label><br>
</p>
So I need to add an onclick function to the "none" option and call a function. My problem is:
A) If I add a 'customCode' => option inside the editviewdefs.php file for that field, it will overwrite the entire field with whatever I put in there, and If I copy and paste the whole field html there, then nothing saves to the DetailView. I just simply want to append to the already existing html field.
Here is my javascript file:
//disable all other checkboxes if "none" is checked
function hideshowlicense(){
if (document.getElementsByName("typesoflicenses_c[]")[7].checked){
//Disable checkboxes
document.getElementsByName("typesoflicenses_c[]")[0].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[1].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[2].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[3].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[4].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[5].disabled=true;
document.getElementsByName("typesoflicenses_c[]")[6].disabled=true;
//Uncheck any other checked options
document.getElementsByName("typesoflicenses_c[]")[0].checked=false;
document.getElementsByName("typesoflicenses_c[]")[1].checked=false;
document.getElementsByName("typesoflicenses_c[]")[2].checked=false;
document.getElementsByName("typesoflicenses_c[]")[3].checked=false;
document.getElementsByName("typesoflicenses_c[]")[4].checked=false;
document.getElementsByName("typesoflicenses_c[]")[5].checked=false;
document.getElementsByName("typesoflicenses_c[]")[6].checked=false;
}else{
document.getElementsByName("typesoflicenses_c[]")[0].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[1].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[2].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[3].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[4].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[5].disabled=false;
document.getElementsByName("typesoflicenses_c[]")[6].disabled=false;
}
}
SUGAR.util.doWHEN("typeof($('#loa_c'))!= 'undefined'"), YAHOO.util.Event.addListener(YAHOO.util.Dom.get('loa_c'), 'change', dep);
SUGAR.util.doWHEN("typeof($('#typesoflicenses_c'))!= 'undefined'"), YAHOO.util.Event.addListener(YAHOO.util.Dom.get('typesoflicenses_c'), 'change', hideshowlicense);
Right now I am getting an error in the chrome console and nothing is changed in the HTML. But if I pull up the same thing in firefox, no error is present.
Here is also an article I read on modifying fields you've made changes too so that they retain there value in the detailview.
I added in this before my javascript (the javascript listed above) and it fixed my issue. I had typed doWHEN instead of doWhen. I had some syntax errors.
SUGAR.util.doWhen("typeof($('#typesoflicenses_c'))!= 'undefined'",
function() {
YAHOO.util.Event.addListener(YAHOO.util.Dom.get(document.getElementsByName("typesoflicenses_c[]")[7]), 'change', hideshowlicense);
}
);
@Lelio Faieta, in this case, the HTML is being generated by Sugar, not me, and secondly the javascript can call by name instead of id using document.getElementsByName. -W3 Schools, document.getElementsByName
customCode was also simply unnecessary in this case.
Credit to Jeff Bickart for helping through this via email. He was a major help.