Issue with UTF-8 and Checkboxes on multiselect

Hello,

I'm using a variable on the placeholder of my multi-select. It has a problem with UTF-8.

Image :



Javascript :

var checkList = new ej.dropdowns.MultiSelect({
            dataSource: codes,
            fields: {
                value: "IDEL",
                text: "Value"
            },
            mode: 'CheckBox',
            showSelectAll: true,
            showDropDownIcon: true,
            placeholder: allConfirmDeleteSelect,
            value: codes.Value
});
checkList.appendTo('#dropdownCheckboxDeleteCode');

How can i fix this ?

And I can't find a way to have all my checkboxes pre-selected in the multi-select. I can't find any answer in the documentation. Can you tell me how can i do that too ?

Thanks.


Regards,

David.


5 Replies

KV Karthikeyan Viswanathan Syncfusion Team August 31, 2018 08:57 AM UTC

Hi David, 

Thanks for contacting Syncfusion support. 

Based on your scenario, you can encode the placeholder text using @Html.Raw(). It will helps to encode the controller returned values. And also you can select all the items using selectAll public method. 

Please refer the below code example: 

<code> 
<script type="text/javascript"> 
   var checkList = new ej.dropdowns.MultiSelect({ 
        dataSource: codes, 
        fields: { 
            value: "IDEL", 
            text: "Value" 
        }, 
        mode: 'CheckBox', 
        showSelectAll: true, 
        showDropDownIcon: true, 
        placeholder: allConfirmDeleteSelect, 
        created: function () { 
            this.selectAll(true); 
        } 
 
    }); 
    checkList.appendTo('#dropdownCheckboxDeleteCode'); 
</script> 

</code> 



Regards, 
Karthikeyan V. 



DC David Caraiannis September 4, 2018 12:48 PM UTC

Hello,

Thank you for your answer.

selectAll did worked very well.

On the another hand, i cannot use Html.Raw() because i'm using javascript and a multiselect with checkboxes.

var checkList = new ej.dropdowns.MultiSelect({
            dataSource: codes,
            fields: {
                value: "IDEL",
                text: "Value"
            },
            mode: 'CheckBox',
            showSelectAll: true,
            showDropDownIcon: true,
            placeholder: allConfirmDeleteSelect,
            created: function () {
                this.selectAll(true);
            }
        });
        checkList.appendTo('#dropdownCheckboxDeleteCode');

As you can see, on "placeholder" I have a variable "allConfirmDeleteSelect" which is a string.

What should I use instead of Html.Raw ?

Regards,

David.



KV Karthikeyan Viswanathan Syncfusion Team September 5, 2018 05:21 AM UTC

Hi David, 

Based on your shared details, we suspect that the issue is raised due to the HTML failed to encode the special character in your application . So, We suggested to use the meta tag for special character encoding.  

Please refer the code example:  


<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

Even, Please ensure the placeholder variable value in browser’s source tab whether it is encoded or not. 

Please refer the below screenshot: 

 



Still, you have an issue the please share the below details . it will help us to provide a solution at earlier. 

  • Share the issue reproducing sample if possible.
  • Share the shared sample as issue reproducible one.
  • Share the code snippet which will help to reproduce this issue.

Regards, 
Karthikeyan V. 



DC David Caraiannis September 5, 2018 01:25 PM UTC

Hello,

Thanks for your help.

I found a solution with Html.Raw like you suggested, but also using resources :

var allConfirmDeleteSelect = "@Html.Raw(@Resources.allConfirmDeleteSelect)";

Regards,

David.



KV Karthikeyan Viswanathan Syncfusion Team September 6, 2018 04:34 AM UTC

Hi David, 
 
Thanks for the update. 
 
We are glad to hear that your issue has been resolved. 
 
Regards, 
Karthikeyan V. 


Loader.
Up arrow icon