Databases
StackOverflow2013
Postsdbo
POJSF 2.2 - ajax in form with multipart/form-data has some error
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJSF 2.2 - ajax in form with multipart/form-data has some error
    text
    copied!<p>I try to create upload file form with JSF 2.2. In this form I have bankCode input box that will ajax to server when loss focus. And this form also contain input file box with. SO I must put enctype="multipart/form-data" attribute to h:form tag for upload file.</p> <p>Everytime I put enctype to form - the ajax will show error message in Chrome's debuger.</p> <blockquote> <p>Uncaught TypeError: Cannot read property 'length' of null<br> jsf.js.htm:359</p> </blockquote> <p>Example code</p> <pre><code>&lt;h:form id="dialogForm" prependId="false" enctype="multipart/form-data"&gt; &lt;h:commandLink action="#{bankController.initCreate()}" class="btn add" style="margin: 10px 0 20px 20px;"&gt; &lt;f:ajax immediate="true" execute="@this" render=":dialogForm"/&gt; &lt;span&gt;Add new bank&lt;/span&gt; &lt;/h:commandLink&gt; &lt;table class="dialogTable" style="margin: 10px 0 20px 20px;"&gt; &lt;colgroup&gt; &lt;col width="30%"/&gt; &lt;col width="70%"/&gt; &lt;/colgroup&gt; &lt;tr&gt; &lt;td class="label"&gt; &lt;label for="abbreviation"&gt;Bank's code&lt;span class="required"&gt;*&lt;/span&gt;&lt;/label&gt; &lt;/td&gt; &lt;td&gt; &lt;h:panelGroup id="codeBox" layout="block" class="codeBox"&gt; &lt;h:inputText id="code" value="#{bankController.curBank.code}" maxlength="10" class="input code #{bankController.isExistCode?'error':''}" onblur="return validTextInput('code',2);"&gt; &lt;f:validateLength minimum="2" maximum="10"/&gt; &lt;f:ajax execute="@this" event="blur" listener="#{bankController.existCode()}" onevent="function(e){showValidateIcon(e, 'code');}" render="codeBox"/&gt; &lt;/h:inputText&gt; &lt;span class="append2"&gt; &lt;img id="codeXLoad" src="#{cdnLocator.officeUrl}/img/load16.gif" title="On process, please wait" width="16" height="16" style="margin-top: 2px; display: none;"/&gt; &lt;img id="codeXWarn" src="#{cdnLocator.officeUrl}/css/images/error_msg_icon.gif" title="Not allowed" width="16" height="16" style="margin-top: 2px; #{bankController.isExistCode?'':'display: none;'}"/&gt; &lt;img id="codeXAvai" src="#{cdnLocator.officeUrl}/css/images/success_msg_icon.gif" title="Allowed" width="16" height="16" style="margin-top: 2px; #{bankController.isExistCode?'display: none;':''}"/&gt; &lt;/span&gt; &lt;/h:panelGroup&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td class="label"&gt; &lt;label for="icon"&gt;Bank icon file*&lt;/label&gt; &lt;/td&gt; &lt;td&gt; &lt;h:inputFile id="bankIconFile" value="#{bankController.bankIconFile}"/&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/h:form&gt; </code></pre> <p>How can I fix this error.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload