0

I have a form which uses a JSF h:inputTextarea like so:

index.xhtml:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head></h:head>
    <h:body>
        <div id="ContentFrame">

            <h:form enctype="multipart/form-data">

                <h:inputTextarea
                    id="termineesText"
                    value="#{controller.text}"/>

                <h:commandButton
                    value="Upload and Continue" 
                    type = "submit"
                    action="#{controller.respond}"/>

            </h:form>
        </div>
    </h:body>
</html>

result.xhtml:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head></h:head>
    <h:body>
        <div id="ContentFrame">

            <h:form enctype="multipart/form-data">

                <h:inputTextarea
                    id="termineesText"
                    value="#{controller.text}"/>

                <h:outputText value="#{controller.containsNewline}"/>

            </h:form>
        </div>
    </h:body>
</html>

With this backing bean:

controller.java:

package main;

import java.io.Serializable;

import javax.enterprise.context.SessionScoped;
import javax.inject.Named;

@Named("controller")
@SessionScoped
public class Controller implements Serializable {
    private static final long serialVersionUID = 1L;
    private String text;
    private boolean containsNewline = false;

    public String respond() {
        return "result.xhtml";
    }

    public void setText(String value) {
        if (value.contains("\n") || value.contains("\r")) {
            containsNewline = true;
        }
        text = value;
    }
    public String getText() {return text;}
    public String getContainsNewline()
    {
        return String.valueOf(containsNewline);
    }
}

When the user inputs text over many lines (by pressing enter) and submits the form the newline characters disappear in the text area in result.xhtml. For example if the user enters:

abc
abc

The result.xhtml's text area has it as "abcabc", And the output text evaluates to false. The newline characters seem to get lost when the form is submitted to the server, which can be seen using the containsNewLine boolean in the controller.

I have read many posts about why newlines aren't shown on a web browser when the text comes from the server side, but my case is the other way around, for some reason new lines are not getting transferred from the Textarea to the backing bean.

What I have tried

I have tried:

<pre><h:inputTextarea id="termineesText" styleClass="termineesTextInput" onchange="enableDisableSubmitBtn()" value="#{controller.termineesText}"/></pre>

And in CSS:

.termineesTextInput { white-space: pre; }

Technology I am using

JSF 2.2 with CDI 1.2 running on Websphere Application Server, and I have done most of my testing using a Chrome incognito window.

How do I get newlines to transfer to the backing property?

Paul Roub
  • 36,322
  • 27
  • 84
  • 93
  • 1
    The English language is renowned for having words and expressions which have multiple meanings, as such I would have thought that capitals could have been interpreted as frustration. no need for the down vote. Never the less... edited. – Jerry B. no.1 intern Jul 05 '17 at 08:13
  • Downvote is not by me... But thanks... will remove my comment. But this issue is not java-se (you cannot repoduce this in just a pojo with a main), it is not java-ee (a tag rarely used and way to broad) although yes, jsf is part of this. And it is not CSS related. CSS does not play any role in submitting data from an input to a server. Adding tags that are not related or to broad mostly attracts comments/suggestions/answers that are not related. That is why I removed them (and remove them again)... Cheers. – Kukeltje Jul 05 '17 at 11:23
  • Can you try what happens when you remove the 'multipart/form-data' and explicit type attribute? – Kukeltje Jul 05 '17 at 11:28
  • Okay thank you, removing the 'enctype' attribute produces a Servlet error on form submission, not sure what you mean by 'explicit type attribute' ? – Jerry B. no.1 intern Jul 05 '17 at 11:41
  • If you have a submission error with just this form, you have some completely different problem that is not visible in this code. Are you sure this is the most minimal version of the page? And with the explicit type I meant the `type="post"`... – Kukeltje Jul 05 '17 at 11:47
  • submission error only occurs if I remove the 'enctype' attribute, the error thrown is javax.servlet.ServletException: SRVE8024E: The request is not of type multipart/form-data. Keeping enctype attr and removing explicit type also did not fix the issue I doubt this servlet error really has anything to do with this ? If you think so, I can post more information... what do you need ? – Jerry B. no.1 intern Jul 05 '17 at 11:57
  • A [mcve] would help. Minimal everything... including web.xml (any filters that might influence this?). It is not logical to get this error when using a normal plain jsf page with nothing special. There must be something else – Kukeltje Jul 05 '17 at 13:07
  • @Kukeltje edited my question to add a very simple test case which reproduces the problem, let me know if I'm missing anything – Jerry B. no.1 intern Jul 05 '17 at 22:08
  • Since the test case contains web.xml, server.xml, 2 xhtml files and a .java class I think it would very much clutter my question so I'd rather not post it inline. I believe you don't need an account to access ms-onedrive, are you having trouble accessing it ? If you like I can do google drive ? – Jerry B. no.1 intern Jul 05 '17 at 22:18
  • Yes, I get a screen to either login or register. Stackoverflow 'requires' code to ne posted here since it might 'disappear' externally, making the question 'useless'. But why 2 xhtml pages? Of you use1 page it does not demonstrate the problem? Why a server.xml? Why a web.xml? Doesn't a default 'empty' one not demonstrate the problem? – Kukeltje Jul 05 '17 at 22:26
  • Provided the test case inline, did not include web.xml or server.xml because the default web.xml is what I'm using anyway (with JSF servlet mappings and state-saving context params), and server.xml is unlikely to have anything to do with it – Jerry B. no.1 intern Jul 05 '17 at 22:34
  • Thanks... you could (should) replace the originally posted code with this! And you can do it in one page since result.xhtml is almost identical to the index. Couple of things.... value.contains... n or r? Not missing a \ there? Enctype should not be needed, no `h:head`? `type='submit` should not be needed. With jsf 2.2 you can (should?) use the new jsf namespaces. The `
    ` around the h:inputTextarea is not needed
    – Kukeltje Jul 05 '17 at 22:48
  • Suggestion: fix the SRVE8024E error. That is imo the culprit (but also be sure to check if the content encoding fails. Check the browser developer tool what is send there to!!! – Kukeltje Jul 05 '17 at 23:08
  • You're right, the enctype="multipart/form-data" is causing the newlines to be omitted, but according to [w3schools](https://www.w3schools.com/tags/att_form_enctype.asp) I need to have it if I am using file upload widgets which I am (not shown in the test case). Any suggestions ? – Jerry B. no.1 intern Jul 06 '17 at 04:33
  • this is also the reason for the servlet error, file upload form components must have multipart/form-data enctype, here's an interesting post about it: https://www.hanselman.com/blog/ABackToBasicsCaseStudyImplementingHTTPFileUploadWithASPNETMVCIncludingTestsAndMocks.aspx – Jerry B. no.1 intern Jul 06 '17 at 04:44
  • 18hours ago we talked about this, you revoved it but got an error. Next time also directly mention that in your real code, there still wa a fileupload. Creating a real mcve where you also removed the enctype it would have shown directly. i was glad to help thus far, but you could have detected this in the process of creating an mcve. It is **always** helpful, not only for us but also for you. I'll see how I can help further – Kukeltje Jul 06 '17 at 06:13
  • thanks, I might make a new question which addresses losing newline characters in multipart/form-data directly. As far as this case is concerned, the reason why newlines are lost is because of the mutlipart/form-data enctype attribute – Jerry B. no.1 intern Jul 06 '17 at 06:17
  • There are already posts on SO about problems with input fields in combination with the enctype being present. But no real solutions. What jsf impl and version do you use? Tried the latest? Tried using all this in combination with ajax (for the other inputs?) – Kukeltje Jul 06 '17 at 06:28
  • Will answer your questions in my new post which will address my case specifically, will link the new post here in my answer when I put it up. As a side note, I don't understand why someone downvoted my question, I don't think that it is "not useful or ill considered/researched", its not perfect, and Im still new on SO, and writing good questions is a muscle Im still developing, would you mind evening the scales on my question and pushing it back up to zero ? – Jerry B. no.1 intern Jul 06 '17 at 10:46
  • @Kukeltje thank you :) – Jerry B. no.1 intern Jul 06 '17 at 22:53

1 Answers1

1

The issue here as @Kukeltje pointed out was my use of enctype="multipart/form-data". For some reason this is causing the newlines to be lost when the form is submitted to the server. If you are able to remove that encoding and use the normal enctype="application/x-www-form-urlencoded" then that will fix the issue for you. Hope this helps someone.

For me removing this is not an option as I'm using a file upload control on my form which requires the use of multipart/form-data. To address this I've opened a new question: Newline characters lost when using enctype="multipart/form-data" in html form