Every enter keys in textarea should be displayed in pdf format

Question

I have text area as below

this is how my text area is

<textarea placeholder="Booking Details " name="particular" rows="4" ></textarea>

and on submit button I want to submit full content of text area as it is on next page from which pdf is generated. I am using php code to pass data from one page to another, but as I type something with enter key in text area, on pdf it comes in one line.

this is my pdf

Please help me out with php or javascript code.

Please chekc this link if any helps http://stackoverflow.com/questions/2099661/enter-key-in-textarea — madankundu, Sep 26 '16 at 10:54
Depends on library and approach used to create the pdf. Not enough known — charlietfl, Sep 26 '16 at 10:55

score 0 · Accepted Answer · answered Sep 26 '16 at 12:02

Find this answer - you can directly post finalString to url php page now -

$(document).ready(function(){
  
  var finalString="";
  
  $('#txtArea').on('keyup',function(event){
    var code = event.which;
    if(code===13){
      finalString =finalString+"'/r/n'";
      }
   else if(code!==8)
     {
        finalString =finalString+event.key;
       }
       
  });
$('button').on('click',function(){
  $('div').text(finalString)
  
  
})

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea placeholder="Booking Details " name="particular" rows="4" id="txtArea"></textarea>
<button>submit</button>
<div id='finalString'></div>

Yes...just get final string from your text area as above and send it to your pdf making library. that's it.Just be sure about enter key string once again — Chetan, Sep 27 '16 at 10:24

score -1 · Answer 2 · answered Sep 26 '16 at 10:56

-1

Its problem of css. Use property white-space: pre-wrap in your output div -

$(document).ready(function(){
$('button').on('click',function(){
var txt = $('#txtArea').val();
  $('div').text(txt);
  
})

});

div
{
  white-space: pre-wrap 
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea placeholder="Booking Details " name="particular" rows="4" id="txtArea"></textarea>
<button>submit</button>
<div></div>

answered Sep 26 '16 at 10:56

Chetan

944
5
22

but my pdf generation code is in other php page please specify me, where to place javacript code – Akshaya Sep 26 '16 at 11:14
@Akshaya - you must be displaying entered text, before generating it to pdf, right??? – Chetan Sep 26 '16 at 11:16
@Akshaya - try to add css to that page where you displaying entered text and then convert it into pdf. – Chetan Sep 26 '16 at 11:17
i have used that white-space:pre wrap as – Akshaya Sep 26 '16 at 11:19
– Akshaya Sep 26 '16 at 11:19
which library you are using to generate pdf?? – Chetan Sep 26 '16 at 11:24
I will tel you in detail how it works, i have a page name as "index.php" in which i have created one form which contains data with a textarea. Then when i click on submit button it goes to next page named as pdf-project.php. On this page , i have one php code to insert data in db and also to generate pdf as mydata.pdf. So pdf-project.php is the hidden page, when i click submit it shows my pdf mydata.pdf. When i see text area in pdf it comes in one line. please help.\ – Akshaya Sep 26 '16 at 11:26
i am using mpdf library – Akshaya Sep 26 '16 at 11:27
Please refer this.http://stackoverflow.com/questions/24322530/how-to-put-line-break-in-mpdf-when-data-is-extracted-from-mysql-database. in your case you have to manully insert '\r\n' in your string whenever enter key is pressed through javascript. – Chetan Sep 26 '16 at 11:30
Though , i dont know much about mpdf. if mentioned link is solution in your case then you can easily insert '\r\n' whenever enter key is pressed by javascript, and then you can pass that string to your mpdf library – Chetan Sep 26 '16 at 11:32
i have added 2 more images in my above question, about how it looks live. you can check that – Akshaya Sep 26 '16 at 11:32
if you want any help to insert '\r\n' through javascript. let me know – Chetan Sep 26 '16 at 11:33
then i think i have to replace every space from 1st page to some character and again to replace dat character to space in 2nd page – Akshaya Sep 26 '16 at 11:35
if you can help me in replacing character code in javascript then it wil be very helpful to me – Akshaya Sep 26 '16 at 11:36
@Akshaya - i have posted answer now. Please check – Chetan Sep 26 '16 at 12:02

Every enter keys in textarea should be displayed in pdf format

2 Answers2