0

I have developed the javascript email form, which was discussed here:

HTML Assigning the checkbox to the form action already defined

and everything works fine, also with jQuery elements.

The problem unfortunately lies in the textarea, where the text input seems to be limited for no reason.

According to the word counter here: https://textool.io/character-counter/ I can work only with 220 characters. If I exceed this limit, the mailto: fails.

When I put i.e. one sentence, everything is alright. The problem emerges when I cross some unknown limit of characters. Then the email is not populated.

The full code is here:

https://jsfiddle.net/pq63e4yr/

and the situation depicted here:

enter image description here

I have "discovered" it by using the lorem ipsum text from here:

https://www.lipsum.com/

and now I am trying to find where the problem might be. I saw, that MS Edge has the similar problem

FormData constructor loses textarea value in Edge

but it looks like the Chrome too...

The sample of code (apart from the link above) looks as this:

document.getElementById("cfsubmit").addEventListener("click", function() {
  var check = document.getElementById("cfemail");
  var formEl = document.forms.cityfibre_form;
  var formData = new FormData(formEl);

  var jobAddress = formData.get('address');
  var jobPostcode = formData.get('postcode');
  var surveyorName = formData.get('surveyor');
  var feedback = formData.get('feedback');

  var subject = jobAddress + ", " + jobPostcode + " - site survey submission from " + surveyorName;

  var body = 'SURVEYOR:  ' + surveyorName + '\n' +
    'ADDRESS:  ' + jobAddress + ' ;    POSTCODE:  ' + jobPostcode + '\n' +
    'FEEDBACK:  ' + feedback;

  var mailTo = "mailto:mk@gmail.com?subject=" + encodeURI(subject) + "&body=" + encodeURI(body);

  if (check.checked == true) { // If checked then fire
    let link = document.createElement("a");
    link.href = mailTo;
    link.click();
    link.remove();
  }

  mainForm.submit();
});
<figure class="feedback">
  <label class="feedtitle" for="Message">Leave 
                      feedback</label>
  <textarea id="opfeedback" name="feedback"></textarea>
  <br>
  <div class="emailreceipt">
    <input type="checkbox" id="cfemail" name="email">
    <label class="checking" for="cfemail">Send me an email 
                                receipt of my responses</label>
  </div>
</figure>

and I have no idea what's going on here. Is the formData.get attribute limited with characters?

The similar question:

Getting around mailto / href / url character limit

says about the 2083 characters limit, since according to this counter: https://textool.io/character-counter/

I can work only for 220 characters. I use the Chrome browser.

Is there some reason behind it?

Geographos
  • 827
  • 2
  • 23
  • 57
  • 2
    URLs are limited in length, and you are creating a `mailto:` URL in order to get the email working. You're probably hitting that limit (depends on the browser). – Heretic Monkey Jul 15 '21 at 14:19
  • 1
    Does this answer your question? [Getting around mailto / href / url character limit](https://stackoverflow.com/questions/4067391/getting-around-mailto-href-url-character-limit) – Heretic Monkey Jul 15 '21 at 14:21
  • It somewhat does. However, could be possible at least to send an email with the text cut down? The worst thing is, that once I hit the limitation, email is not sent at all. – Geographos Jul 15 '21 at 14:32
  • 1
    A limit of 2000 characters works on most browsers. This can be easily applied to the – goldenbanana42 Jul 15 '21 at 14:33
  • According the https://textool.io/character-counter/ I am allowed to put 220 characters only. I work in Chrome. – Geographos Jul 15 '21 at 14:38
  • I have edited my question and rejected the similarity with the one proposed because I can reach 220 characters only. – Geographos Jul 15 '21 at 14:44
  • @MKR Then maybe that is a limit with the email client? – goldenbanana42 Jul 15 '21 at 14:45
  • This website https://www.emailonacid.com/blog/article/email-development/line-length-in-html-email/#:~:text=The%20998%20character%20limit%20is,a%20line%20for%20robustness%20sake. says about 998 characters. I am still far away from this value, which makes my situation troublesome. – Geographos Jul 15 '21 at 14:46
  • What do you mean you are "allowed to put 220 characters only"? I'm using Chrome and I can put as many characters as I want in there. – Heretic Monkey Jul 15 '21 at 15:09
  • When I put more, I am unable to send an email, because it simply doesn't work. 220 characters is the limit – Geographos Jul 15 '21 at 15:11
  • @MKR Can you provide a jsfiddle? – goldenbanana42 Jul 15 '21 at 15:16
  • The link is above: https://jsfiddle.net/pq63e4yr/ – Geographos Jul 15 '21 at 15:18
  • You could work around it by doing an AJAX POST to the server with the body and getting the email sent there. – goldenbanana42 Jul 15 '21 at 15:32
  • I don't know how to do this yet – Geographos Jul 15 '21 at 15:39
  • See [here](https://www.w3schools.com/js/js_ajax_intro.asp) for a simple AJAX intro. But you would need to be able to run server-side scripting e.g. with PHP, Node.JS etc. However this is off topic now, and you would need to do your own research if it is a feasible solution. I'd recommend it if possible since mailto clearly isn't a reliable method. P.S your jsfiddle appears to be broken with many console errors that you might want to fix first. – goldenbanana42 Jul 15 '21 at 15:53

0 Answers0