Custom Field Selected Value not highlighted on load

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

Custom Field Selected Value not highlighted on load

tadluedtke
I have a custom multi-select field. When I open a piece of content that has previously been saved, the selected value is not highlighted. The correct value is stored correctly in content and appears correctly in the field's value attribute. The "selected" attribute even gets placed on the correct option when the content opens, but it is not actually highlighted. 
I haven't been able to find any good documentation on the this, so what I have is mostly copied directly from how dotCMS handles regular Multi-select fields. Below is my code for the custom field value:

<script>


       
function updatelocationMultiSelect() {
           
var valuesList = "";
           
var multiselect = $('locationSelect');
           
for(var i = 0; i < multiselect.options.length; i++) {
               
if(multiselect.options[i].selected) {
                   
if (valuesList != ""){
                        valuesList
+= ","
                   
}
                    valuesList
+= multiselect.options[i].value;
               
}
           
}
            $
('location').value = valuesList;
       
}


        updatelocationMultiSelect
();
 
</script>


<select name="locationSelect" dojoType="dijit.form.MultiSelect" id="locationSelect" onchange="updatelocationMultiSelect" size="10" multiple="multiple" value="$location">
        #foreach($con in $dotcontent.pull("+contentType:Location +(conhost:SYSTEM_HOST)",50,"Location.title"))
        #set($locationList = "$con.title ($con.airportCode)")
       
   
<option #if($locationList == $location) selected #end value="$!{con.title} ($!{con.airportCode})">$con.title ($con.airportCode)</option>
    #end  
</select>


Any help would be appreciated.

Thanks!

--Tad Luedtke

--
http://dotcms.com - Open Source Java Content Management
---
You received this message because you are subscribed to the Google Groups "dotCMS User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Reply | Threaded
Open this post in threaded view
|

Re: Custom Field Selected Value not highlighted on load

Mark Pitely
This is more of a javascript issue than a dotCMS one, more of an issue with Multi-selects instead of a normal select.
Try something like this:
<option #if($locationList == $location) selected  style="color:#000;background-color:bada55"    #end value="$!{con.title} ($!{con.airportCode})">$con.title ($con.airportCode)</option>

That just adds an extra style to the selected option. I t might behave a little weird when they are actually choosing/editing when existing, which you could fix, you guessed it, with more javascript.
Plus, your option will now be totally bada55, which is always a bonus.

Mark Pitely
Marywood University

On Wed, Nov 8, 2017 at 6:12 PM, Tad Luedtke <[hidden email]> wrote:
I have a custom multi-select field. When I open a piece of content that has previously been saved, the selected value is not highlighted. The correct value is stored correctly in content and appears correctly in the field's value attribute. The "selected" attribute even gets placed on the correct option when the content opens, but it is not actually highlighted. 
I haven't been able to find any good documentation on the this, so what I have is mostly copied directly from how dotCMS handles regular Multi-select fields. Below is my code for the custom field value:

<script>


       
function updatelocationMultiSelect() {
           
var valuesList = "";
           
var multiselect = $('locationSelect');
           
for(var i = 0; i < multiselect.options.length; i++) {
               
if(multiselect.options[i].selected) {
                   
if (valuesList != ""){
                        valuesList
+= ","
                   
}
                    valuesList
+= multiselect.options[i].value;
               
}
           
}
            $
('location').value = valuesList;
       
}


        updatelocationMultiSelect
();
 
</script>


<select name="locationSelect" dojoType="dijit.form.MultiSelect" id="locationSelect" onchange="updatelocationMultiSelect" size="10" multiple="multiple" value="$location">
        #foreach($con in $dotcontent.pull("+contentType:Location +(conhost:SYSTEM_HOST)",50,"Location.title"))
        #set($locationList = "$con.title ($con.airportCode)")
       
   
<option #if($locationList == $location) selected #end value="$!{con.title} ($!{con.airportCode})">$con.title ($con.airportCode)</option>
    #end  
</select>


Any help would be appreciated.

Thanks!

--Tad Luedtke

--
http://dotcms.com - Open Source Java Content Management
---
You received this message because you are subscribed to the Google Groups "dotCMS User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--
http://dotcms.com - Open Source Java Content Management
---
You received this message because you are subscribed to the Google Groups "dotCMS User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/dotcms/CAFeiKqNXGWSrK5jk8xy93u3Pz_wVwC9dyi60sciEcSNQ10NSkw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
Reply | Threaded
Open this post in threaded view
|

Re: Custom Field Selected Value not highlighted on load

tadluedtke
Thanks for the suggestion Mark. Your javascript comment got me thinking. Turns out there must have been some kind of conflict between some custom javascript and Dojo. I totally removed the dojoType attribute, that seems to have taken care of it. Still needed the velocity conditional in there, but it's a step in the right direction. Guess I'll have to wait on the bada55 options for now. Thanks again for the seed!

--Tad Luedtke


On Friday, November 10, 2017 at 8:47:59 AM UTC-6, Mark Pitely wrote:
This is more of a javascript issue than a dotCMS one, more of an issue with Multi-selects instead of a normal select.
Try something like this:
<option #if($locationList == $location) selected  style="color:#000;background-color:bada55"    #end value="$!{con.title} ($!{con.airportCode})">$con.title ($con.airportCode)</option>

That just adds an extra style to the selected option. I t might behave a little weird when they are actually choosing/editing when existing, which you could fix, you guessed it, with more javascript.
Plus, your option will now be totally bada55, which is always a bonus.

Mark Pitely
Marywood University

On Wed, Nov 8, 2017 at 6:12 PM, Tad Luedtke <<a href="javascript:" target="_blank" gdf-obfuscated-mailto="RIGhuftFAAAJ" rel="nofollow" onmousedown="this.href=&#39;javascript:&#39;;return true;" onclick="this.href=&#39;javascript:&#39;;return true;">tadlu...@...> wrote:
I have a custom multi-select field. When I open a piece of content that has previously been saved, the selected value is not highlighted. The correct value is stored correctly in content and appears correctly in the field's value attribute. The "selected" attribute even gets placed on the correct option when the content opens, but it is not actually highlighted. 
I haven't been able to find any good documentation on the this, so what I have is mostly copied directly from how dotCMS handles regular Multi-select fields. Below is my code for the custom field value:

<script>


       
function updatelocationMultiSelect() {
           
var valuesList = "";
           
var multiselect = $('locationSelect');
           
for(var i = 0; i < multiselect.options.length; i++) {
               
if(multiselect.options[i].selected) {
                   
if (valuesList != ""){
                        valuesList
+= ","
                   
}
                    valuesList
+= multiselect.options[i].value;
               
}
           
}
            $
('location').value = valuesList;
       
}


        updatelocationMultiSelect
();
 
</script>


<select name="locationSelect" dojoType="dijit.form.MultiSelect" id="locationSelect" onchange="updatelocationMultiSelect" size="10" multiple="multiple" value="$location">
        #foreach($con in $dotcontent.pull("+contentType:Location +(conhost:SYSTEM_HOST)",50,"Location.title"))
        #set($locationList = "$con.title ($con.airportCode)")
       
   
<option #if($locationList == $location) selected #end value="$!{con.title} ($!{con.airportCode})">$con.title ($con.airportCode)</option>
    #end  
</select>


Any help would be appreciated.

Thanks!

--Tad Luedtke

--
<a href="http://dotcms.com" target="_blank" rel="nofollow" onmousedown="this.href=&#39;http://www.google.com/url?q\x3dhttp%3A%2F%2Fdotcms.com\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNGFT4ej1MQxQ2vu3iAUqYQgS59efw&#39;;return true;" onclick="this.href=&#39;http://www.google.com/url?q\x3dhttp%3A%2F%2Fdotcms.com\x26sa\x3dD\x26sntz\x3d1\x26usg\x3dAFQjCNGFT4ej1MQxQ2vu3iAUqYQgS59efw&#39;;return true;">http://dotcms.com - Open Source Java Content Management
---
You received this message because you are subscribed to the Google Groups "dotCMS User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to <a href="javascript:" target="_blank" gdf-obfuscated-mailto="RIGhuftFAAAJ" rel="nofollow" onmousedown="this.href=&#39;javascript:&#39;;return true;" onclick="this.href=&#39;javascript:&#39;;return true;">dotcms+un...@googlegroups.com.
To post to this group, send email to <a href="javascript:" target="_blank" gdf-obfuscated-mailto="RIGhuftFAAAJ" rel="nofollow" onmousedown="this.href=&#39;javascript:&#39;;return true;" onclick="this.href=&#39;javascript:&#39;;return true;">dot...@....
To view this discussion on the web visit <a href="https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com?utm_medium=email&amp;utm_source=footer" target="_blank" rel="nofollow" onmousedown="this.href=&#39;https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com?utm_medium\x3demail\x26utm_source\x3dfooter&#39;;return true;" onclick="this.href=&#39;https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com?utm_medium\x3demail\x26utm_source\x3dfooter&#39;;return true;">https://groups.google.com/d/msgid/dotcms/1915e7f3-6c21-40c1-953a-6905ae8950fc%40googlegroups.com.
For more options, visit <a href="https://groups.google.com/d/optout" target="_blank" rel="nofollow" onmousedown="this.href=&#39;https://groups.google.com/d/optout&#39;;return true;" onclick="this.href=&#39;https://groups.google.com/d/optout&#39;;return true;">https://groups.google.com/d/optout.

--
http://dotcms.com - Open Source Java Content Management
---
You received this message because you are subscribed to the Google Groups "dotCMS User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
To post to this group, send email to [hidden email].
To view this discussion on the web visit https://groups.google.com/d/msgid/dotcms/f96b5f7e-c49d-467c-a48e-9637e941883b%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.