Forum Discussion

AlexusHill's avatar
AlexusHill
Qrew Member
5 years ago

Help fix ellipsis, need all text to be shown

I already have a working button that works as a pop up alert, but after adding more text I see an ellipsis, when I need all text to be shown. I've tried several statements with no success. Below is a bit of my code, if anyone has suggestions. 
/***********
var text button ="<a class=\"Vibrant Success\" title=\"Help\" style=\"text-align:center; text-decoration:none; &'text-overflow:visible'&\" href=\"javascript:void(0);\" onclick=\"alert('FAQ\\'s \\nQ. Why is the cost showing \\'????\\' ? \\nA. All fields must be filled out, including insurance options.;\">Help</a>";

#css #javascript #Button​​​​​​​
Button
css
javascript

5 Replies

Sort By
  • AustinK's avatar
    AustinK
    Qrew Commander
    5 years ago
    So by default before you added "text-overflow:visible" it still had the ellipsis? Did this even change anything for you?

    Have you tried "overflow: scroll" or auto?

    The text-overflow property needs other things to be set up a certain way for it to work. Overflow needs to be hidden, scroll, or auto and white-space needs to be set to nowrap. Are you doing these things as well? If not, your text-overflow property is likely being totally ignored.
    • AlexusHill's avatar
      AlexusHill
      Qrew Member
      5 years ago
      Yes, I still had the ellipsis by default that is why I tried different commands such as "text-overflow:visible" but with no success. I have not tried scroll or auto yet, let me give it a try now. Just so I'm correct my new line of code is going to look like this: 

      var text button ="<a class=\"Vibrant Success\" title=\"Help\" style=\"text-align:center; text-decoration:none; overflow:scroll &'text-overflow:visible'&\" href=\"javascript:void(0);\" onclick=\"alert('FAQ\\'s \\nQ. Why is the cost showing \\'????\\' ? \\nA. All fields must be filled out, including insurance options.;\">Help</a>";
      • TomMusto's avatar
        TomMusto
        Qrew Cadet
        5 years ago
        This appears to be a browser issue with respect to the javascript alert() function. While the javascript spec does not place a limit on the amount of text you can put into alert(), web browsers have imposed limits on how much of the alert text will be displayed before it truncates the remaining text. It looks like you're using Google Chrome and you can verify that the limit is 1920 characters using the following script:
        var alertText = "";
var i;
for(i=0; i<1920; i++) {
  alertText += "a";
}
alert(alertText);​

        This script will write a 1920 character string consisting only of the letter "a". When you trigger this in Chrome, you should see your alert pop up with no ellipsis. Now, change 1920 to 1921 in the for loop, and when you trigger the updated alert, you should see an ellipsis at the end of the alert. Firefox appears to cut off alerts at 10,000 characters (again, can be verified by changing the 1920 in the above script).

        If you need to display this information as a pop-up instead of somewhere else in the page, you may need to pop up a modal or something like that instead of using alert().



        ------------------------------
        -Tom
        ------------------------------
  • DonLarson's avatar
    DonLarson
    Qrew Commander
    5 years ago
    A.

    Please send a screen shot of the Pop Up.

    ------------------------------
    Don Larson
    Paasporter
    Westlake OH
    ------------------------------