Kendo Chat , Text format problem

[Deniz]

Hello Everyone, 
I use Kendo Chat. the user writes a text (promt). this prompt goes to my endpoint and returns a response. i print this response back to the chat, but there is a problem. for example, the incoming text : 
"
This is a sample article. Sample text.
Sample text on the second line.
Sample text in the third line.
Sample text in the fourth line.
"
This is what the output looks like when I print it: 
"
This is a sample article. Sample text, sample text on the second line, sample text on the third line, sample text on the fourth line.
"

I'm tired of searching for a solution. I can't find it.
My code snippet: 

  $.ajax({
            url: SendPrompt.fmt(encodedMessage, encodedUserName), 
            async: true,
            contentType: 'application/json',
            type: "POST",
            dataType: "json",
            processData: false,          
            headers: { Authorization: tokenData() },
            beforeSend: setHeader,
            success: function (data) { 
                    var answer = data.Answer.replace(/(?:\r\n|\r|\n)/g, '\n\n');                   
                chat.renderMessage({
                    type: "MyText",
                    text: answer 
                }, {
                    id: kendo.guid(),
                    name: gptName
                });
            }, error: function (jqXHR, textStatus, errorThrown) {
                console.log("Status:", textStatus);
            },
            complete: function () {
                messageTemplate.animate({ opacity: 0 }, 500, function () {
                    $(this).css({ display: 'none' });
                });
                chat.wrapper.find(".k-input").prop('disabled', false);
                chat.wrapper.find(".k-button-send").prop('disabled', false);
            }
        });

Please help me..

[Neli]

Hi Deniz,

Could you please try to log the value of the answer variable right before using it in the renderMessage method and check its value? I have tested the appearance when the string contains \n or \n\n and as you will see in the Dojo linked here the new lines are correctly added.

Looking forward to your reply.

Regards,

Neli

[Deniz]

Hello Neli, first of all thank you for your reply. But I don't completely understand what you mean, do you have a chance to show it as code? By the way, on the trial page of the kendo chat template in the web page, you can use \n to move to a new line. But it does not happen in my project. where exactly should I make changes? This is very important for me. thank you.

[Neli]

Hi Deniz,

In the Dojo example I have sent in my previous reply, the messages are displayed with new lines when the text value is added as demonstrated below:

 chat.renderMessage({
        type: "text",
        text: "This is a sample article. \n\n Sample text. \n Second line. \n\n Third line. \n\n Forth line."
    }, chat.getUser());

Could you please double check if the characters for the new lines are correctly added to the string used as a text in the application on your side?

Regards,

Neli

[Reza]

Can the type "text" be markdown? What are all the accepted value for this type property? I need to parse markdown but still struggling.

[Neli]

Hi Reza,

Please find below a link to a thread in the forum where sending HTMl in the Chat message is described in details:

- https://www.telerik.com/forums/kendo-chat-control-for-jquery#5746339

I hope this helps.

Regards,

Neli

[Heythem]

A little late to the party, but i  had the same issue with Kendo Chat, sending new lines from the backend are somehow disappearing. But with static text containing new lines it works as described above in the snippets. I found the solution with CSS configuration : 

white-space: pre-wrap;

[Neli]

Hi Heythem,

Thank you for sharing your approach with the community. We always appreciate sharing solutions. I am sure it will be helpful to the other users who have the same issue.

Regards,

Neli