&#38;quot;&#38;amp;&#38;quot; in mdb select results in &#38;

Topic: "&" in mdb select results in "&amp" visible text

Wood pro asked 5 years ago

im adding various values to an mdb_select

one of the values takes the form "D&G blah"

this results in the mdb_select showing "D&ampG blah" in the actual display text of the select as the currently selected item.

weirdly, even if I manually add the value to the list as "D&G" it displays correctly as "D&G" in the dropdown, but when it is the selected value it displays as "D&ampG".

* EDIT. had to remove the ";" char from this post as the &amp was getting stripped out, making the post unintelligble. The issue is its displaying "D & a m p ; G" minus the spaces.

any idea how I might stop mdb_select messing the name up in the selected value?

Add comment

Wood pro answered 5 years ago

0 0 Best answer

ah, is there any way we could temporarily fix this?

When will the fix be released?

Sebastian Kaczmarek staff commented 5 years ago

I don't like to say that but at the moment I don't have any temporary fix for this. It should be fixed in one of the nearest releases.

Add comment

Wood pro answered 5 years ago

0 0 Best answer

ok this seems to be fixed, but we are unable to use it because 4.7.7 now generates errors in IE11 where there were no errors previously.

https://mdbootstrap.com/support/jquery/ie11-console-errors-with-4-7-7/

Piotr Glejzer staff commented 5 years ago

I respond in your topic

Add comment

Wood pro answered 5 years ago

0 0 Best answer

we'll wait, its not critical, just visual, but you also told us it would be fixed before end of march.

Piotr Glejzer staff commented 5 years ago

Fine, it will be fixed in the next release. We had a lot of tasks to did so we are very sorry that we didn't fix before the end of March.

Add comment

Piotr Glejzer staff answered 5 years ago

0 0 Best answer

Gulp is a task runner which help to develop code to minify/compile/recompile/uglify or just put everything and watches changes with a live server when you are changing something. Gulp is a great tool and has a lot of following in front-end and also in the back-end. 
While webpack is a bundler which has a similar possibility like gulp but it's kind different, this is not a tusk runner and it's a tool which reads the JavaScript file we indicate and then performs the specified tasks on it.
 
If you want to fix this problem you have to use gulp or webpack to do this or you can find 'this.$materialSelectInitialOption' in mdb.js and change it as I said before or you can wait for us because we will fix this in the next release.

There are our tutorials about gulp and webpack : 
<a href="https://mdbootstrap.com/education/bootstrap/gulp-installation/" target="_blank">https://mdbootstrap.com/education/bootstrap/gulp-installation/</a> 
<a href="https://mdbootstrap.com/articles/jquery/md-bootstrap-webpack-tutorial/" target="_blank">https://mdbootstrap.com/articles/jquery/md-bootstrap-webpack-tutorial/</a>

Please insert min. 20 characters.

Gulp is a task runner which help to develop code to minify/compile/recompile/uglify or just put everything and watches changes with a live server when you are changing something. Gulp is a great tool and has a lot of following in front-end and also in the back-end.
While webpack is a bundler which has a similar possibility like gulp but it's kind different, this is not a tusk runner and it's a tool which reads the JavaScript file we indicate and then performs the specified tasks on it.
If you want to fix this problem you have to use gulp or webpack to do this or you can find 'this.$materialSelectInitialOption' in mdb.js and change it as I said before or you can wait for us because we will fix this in the next release.

There are our tutorials about gulp and webpack :
https://mdbootstrap.com/education/bootstrap/gulp-installation/
https://mdbootstrap.com/articles/jquery/md-bootstrap-webpack-tutorial/

Add comment

Wood pro answered 5 years ago

0 0 Best answer

we arent using gulp or webpack so not entirely sure what you mean.

we are using jquery.

please advise, or better yet, fix it in the compiled version.

Add comment

Piotr Glejzer staff answered 5 years ago

0 0 Best answer

Please insert min. 20 characters.

this is easy fix for that. You have to change

  this.$materialSelectInitialOption = $nativeSelect.find('option:selected').html() || $nativeSelect.find(
    'option:first').html() || '';

  this.$materialSelectInitialOption = $nativeSelect.find('option:selected').text() || $nativeSelect.find(
        'option:first').text() || '';

and use gulp or webpack to recompiled material-select.js

Add comment

Wood pro answered 5 years ago

0 0 Best answer

https://mdbootstrap.com/snippets/jquery/wood/540446

example posted.

you can see here, the value is correct in the drop down, the value is "D&G" in the code, yet the value displayed as the currently selected value shows as D&ampG.

Piotr Glejzer staff commented 5 years ago

Yea, sure I see it. I will try to fix in the next release. Thank you so much for this example.

Add comment

Wood pro answered 5 years ago

0 0 Best answer

not much to show.

initialise any mdbselect where the current selected value contains an ampersand.

instead of &, you get &amp.

Add comment

Piotr Glejzer staff answered 5 years ago

0 0 Best answer

Do you have some example what you can show me? I try to fix this it will be nice if will be some example to see. Thanks.
https://mdbootstrap.com/snippets/

Add comment

Wood pro answered 5 years ago

0 0 Best answer