Unselecting options in a div (JavaScript)

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • gprisk
    New Member
    • Oct 2012
    • 2

    Unselecting options in a div (JavaScript)

    Thank you in advance for any assistance!

    We are currently trying to implement a javascript solution for CRM2011. There are 2 libraries involved. The first generates a div container and presents values from a dropdown list (option set in CRM) so the user can select multiple values. The code then saves the selected values to a separate field as delimited text.

    We have a requirement to allow for the values to be cleared. Specifically, if a function is called in a separate library, resulting in the list being hidden, then the selected values will also clear. As it stands, the function in the second library will run (hiding the multiple choice section), but the values are not cleared.

    Here are the 2 libraries in question. The second includes codes from another bytes.com post (http://bytes.com/topic/javascript/answers/712814-uncheck-checkboxes-within-single-div) and is what we've tried to make word in our solution.

    Library that creates the div container:

    [CODE=javascript]
    ///<reference path="..\Intell iSense\XrmPage-vsdoc.js"/>
    if (typeof (OptionSetToMul tiSelect) == "undefined" )
    { OptionSetToMult iSelect = {}; }
    OptionSetToMult iSelect.Functio ns = {

    ToMultiSelect: function (var_sc_options et, var_sc_optionse tvalue, required, columns, othercontrol, othercontrollab el) {

    if (othercontrol != null) {
    var MyControl = Xrm.Page.getCon trol(othercontr ol);
    var MyControlValue = Xrm.Page.getAtt ribute(othercon trol).getValue( );
    if (MyControlValue != null) {
    MyControl.setVi sible(true);
    }
    else {
    MyControl.setVi sible(false);
    }
    }

    var OS = document.getEle mentById(var_sc _optionset);
    var OSV = document.getEle mentById(var_sc _optionsetvalue );

    if (OS != null && OSV != null) {
    if (columns == null)
    columns = 1;
    OS.style.displa y = "none";
    if (required) {
    OS.parentNode.p arentNode.first Child.appendChi ld(document.cre ateElement('<IM G class=ms-crm-ImageStrip-frm_required alt=Required src="/_imgs/imagestrips/transparent_spa cer.gif?ver=-137896071">'));
    }
    OSV.parentNode. parentNode.styl e.display = 'none'

    // Create a DIV container
    var divHight = (OS.options.len gth < 4 ? 80 : (OS.options.len gth - 1 * 20));
    var addDiv = document.create Element("<div id='div1' style='overflow-y:auto; height:" + divHight + "px; border:1px #cecece solid;' />");
    OS.parentNode.a ppendChild(addD iv);

    var count = 0;
    var totalPerColumn = (OS.options.len gth - 1) / columns;
    OS.nextSibling. appendChild(doc ument.createEle ment("<div id='div2' style='width:90 px;float:left;' />"))

    // Initialise checkbox controls
    for (var i = 1; i < OS.options.leng th; i++) {
    var pOption = OS.options[i];

    if (!OptionSetToMu ltiSelect.Funct ions.IsChecked( pOption.text, OS, OSV)) {
    var addInput = document.create Element("<input type='checkbox' id='input1' style='border:n one; width:25px; align:left;' value='" + pOption.text + "' />");
    }
    else {
    var addInput = document.create Element("<input type='checkbox' id='input2' checked='checke d' style='border:n one; width:25px; align:left;' value='" + pOption.text + "' />");
    }


    addInput.onclic k = function () {

    var valuesField = Xrm.Page.getAtt ribute(var_sc_o ptionsetvalue);
    var customFields = OS.nextSibling. getElementsByTa gName("input");
    var values = "";

    for (var j = 0; j < customFields.le ngth; j++) {
    if (customFields[j].checked) {
    values += customFields[j].value;
    values += ";"

    if (othercontrol != null) {
    if (customFields[j].value == othercontrollab el) {
    var MyControl = Xrm.Page.getCon trol(othercontr ol);
    var MyControlAttrib ute = Xrm.Page.getAtt ribute(othercon trol);
    MyControl.setVi sible(true);
    MyControlAttrib ute.setRequired Level("required ");
    }
    }

    }
    else {
    if (othercontrol != null) {

    var MyControl = Xrm.Page.getCon trol(othercontr ol);
    var MyControlAttrib ute = Xrm.Page.getAtt ribute(othercon trol);
    MyControl.setVi sible(false);
    MyControlAttrib ute.setRequired Level("none");
    Xrm.Page.getAtt ribute(othercon trol).setValue( null);
    }
    }
    }

    values = values.substrin g(0, values.length - 1);
    valuesField.set Value(values);
    };

    var label = document.create Element("<label style='width:15 0px' />");
    label.appendChi ld(addInput)
    var labelText = document.create Element("<span style='white-space:nowrap;'/>");
    labelText.inner Text = pOption.text;
    label.appendChi ld(labelText)

    if (count >= totalPerColumn) {
    OS.nextSibling. appendChild(doc ument.createEle ment("<div style='width:90 px;float:left;' />"))
    count = 0;
    }

    OS.nextSibling. lastChild.appen dChild(label);
    count++;
    }

    if (required) {
    OptionSetToMult iSelect.Functio ns.OptionSetToM ultiSelectRequi redFields.push( var_sc_optionse tvalue);
    }
    }
    },

    // Check if it is selected
    IsChecked: function (pText, OS, OSV) {
    if (OSV.value != "") {
    var OSVT = OSV.value.split (";");
    for (var i = 0; i < OSVT.length; i++) {
    if (OSVT[i] == pText)
    return true;
    }
    }
    return false;
    },

    // Save the selected text, this field can also be used in Advanced Find
    OnSave: function (var_sc_options etvalue, var_sc_optionse t, required) {
    //save value
    control = Xrm.Page.getCon trol(var_sc_opt ionsetvalue);
    valueControl = Xrm.Page.getCon trol(var_sc_opt ionsetvalue).ge tAttribute()

    if (required && valueControl.ge tValue() == null) {
    alert("You must provide a value for " + var_sc_optionse t);
    event.returnVal ue = false;
    return false;
    }
    },
    CheckAllMultiCh eckboxWithLayer sRequiredFields : function () {


    for (var i = 0; i < OptionSetToMult iSelect.Functio ns.OptionSetToM ultiSelectRequi redFields.lengt h; i++) {
    var valueControl = Xrm.Page.getCon trol(OptionSetT oMultiSelect.Fu nctions.OptionS etToMultiSelect RequiredFields[i]);
    var isDisabled = valueControl.ge tDisabled();
    if (valueControl.g etAttribute().g etValue() == null && !isDisabled) {
    alert("You must provide a value for " + valueControl.ge tLabel().replac e("Values", ""));
    OptionSetToMult iSelect.Functio ns.OptionSetToM ultiSelectValid ationTriggered = true;
    event.returnVal ue = false;
    return false;
    }
    }
    },
    OptionSetToMult iSelectRequired Fields: new Array(),
    OptionSetToMult iSelectValidati onTriggered: false
    }
    [/CODE]

    Library that contains the function to show/hide the section with the div container, and ALSO attempt to clear the values. (Please note, I realize the show/hide is always showing - I wanted to see if it was clearing.)

    [CODE=javascript]
    // OnLoad

    function Form_onload() {

    }

    function testTrigger_onc hange() {

    var triggerAttribut e = Xrm.Page.getAtt ribute("me_pick anoptiontotrigg ermultiselect") ;
    var trigger = triggerAttribut e.getValue();

    if (trigger == 134320002) {

    Xrm.Page.ui.tab s.get("section_ 1").sections.ge t("item_3").set Visible(true);
    alert("Toggled On");

    } else {

    Xrm.Page.ui.tab s.get("section_ 1").sections.ge t("item_3").set Visible(true);
    alert("Toggled Off");

    function unselect(div2) {
    var inputs = document.getEle mentById(div2). getElementsByTa gName(input2);
    for (var i = 0; i < inputs.length; i++) {
    var obj = inputs[i];
    if (inputs[i].type == "checkbox") {
    inputs[i].checked = false;
    }
    }
    }

    alert("Ran Clear");

    }

    }
    [/CODE]

    Any thoughts on how to go about clearing the values from the div?
  • gprisk
    New Member
    • Oct 2012
    • 2

    #2
    Additional information from a coworker:

    The home for technical questions and answers at Microsoft. Get started asking, answering, and browsing questions about products like .Net, Azure, or Teams.

    Comment

    Working...