Dijit form stops validating when mvc Group is used in it - model-view-controller

I have a page which uses dijit/form/Form to validate all of the form widgets in it.
Validation works correctly if I put widgets directly under the Form (tag).
Once I surround the widgets with a dojox/mvc/Group (within the form), Form validation stops completely and none of the widgets seem to validate when I call Form::validate().
Debugging the Dojo code shows that nested widgets are never considered validatable in the Form so when I surround widgets with Group they get excluded from validation.
Is there a workaround for this?

AFAICT from dijit/form/_FormMixin#_getDescendantFormWidgets() and dijit/_WidgetBase#getChildren(), the issue can be solved by adding data-dojo-mixins="dijit/_Container" to the element having data-dojo-type="dojox/mvc/Group".
Also (though I'm not sure if it meets your requirement), dojox/mvc/tests/test_mvc_new_loan-stateful.html example shows form validation solution with dojox/mvc.
Hope it helps.
Best, Akira

It seems like there is no easy way to solve this with dijit/form/Form. At the very least, it should be subclassed or monkey-patched to make it consider nested widgets.
However, it seems that dojox/form/Manager handles nested widgets properly, so I have switched to it.
Switching to Manager required some refactoring since it cannot be simply converted into an object with dom-form (dijit/form/Form can be converted).
HTML code before:
<div
id="_pg_detailForm"
data-dojo-type="dijit/form/Form"
encType="multipart/form-data"
action="" method=""
>
... form widgets (surrounded with MVC Groups...etc)
</div>
After:
<form id="_pg_detailForm">
<div
id="_pg_detailFormManager"
data-dojo-type="dojox/form/Manager"
>
... form widgets (surrounded with MVC Groups...etc)
</div>
</form>

Related

Migrate spring Form htmlEscape attribute behavior to Thymeleaf

I'm currently working on a Spring MVC project where we are migrating all our jsp files to thymeleaf. I'm aware that the spring form tag has an htmlEscape attribute that will escape user input when rendering, such as when the user submits an invalid form and the user input is rendered bound to the form. An example of this:
<form:form method="post" id="someForm" modelAttribute="${commandName}" htmlEscape="true" autocomplete="off">
<div class="form-group">
<input type="text" id="username" value="<c:out value='${inputValue}'/>"/>
<input type="password" id="password" />
<input type="submit" class="btn btn-lg btn-block-sm" value="<spring:message code="header.content.close"/>" tabindex="0" />
<input type="hidden" name="_eventId" value="continue"/>
</div>
</form:form>
This fits under the umbrella of output-escaping, which is something that happens on the server side when processing a template to render.
An example of an xss attack this prevents is if the user entered
<script>alert("gotcha");</script> for the username, and some arbitrary value for the password. The form will rerender with the entered username bound to the form. The htmlEscape="true" attribute in the form tag will cause this output to be escaped to mitigate xss. So the username field will contain <script>alert("gotcha");</script> when the bound form rerenders with the error, instead of the actually entered valid html
Is there a standard way to achieve this same functionality in thymeleaf?
A few possibilities I see:
This is already built into thymeleaf.
I'm aware that the spring thymeleaf package uses unbescape to perform output escaping on some attributes, for example SpringValueTagProcessor which I believe escapes output on th:value attributes. However, I'm not sure this is equivalent, and fear there may be security holes left unfilled if this was done in a way that only partially mitigates what the spring form htmlEscape fully mitigates.
If so, please explain how this covers the same cases that htmlEscape does.
There is an existing Spring / Spring MVC solution that is flexible enough to not rely on jsp.
If so, what?
There is a common solution to this for thymeleaf which involves some modification of the template parsing engine.
If so, please explain.
Here is a brief article to give you an idea of what I mean regarding the spring form behavior. Regarding this article, it appears that setting the defaultHtmlEscape to false globally in the web.xml only overrides the default value of HtmlEscapeTag, which appears to only work for spring tags. Thus I don't think the solution can be applied to thymeleaf.
I would appreciate any direction here.
Escaping of output text is done automatically if you use th:text. In rare cases, you can use th:utext if you want to use unescaped text, but you have to be aware of the security implications. See Process thymeleaf variable as html code and not text for some more info.
I ended up getting an answer on the GitHub discussions for the Thymeleaf project here, which I will summarize and clarify:
HTML escaping is built into Thymeleaf form elements by default.
This is evidenced by th:input processor source code. Note the use of getDisplayString which performs html output escaping via org.springframework.web.util.HtmlUtils
I went through and manually checked all the uses of getDisplayString where htmlEscape is false and can verify that in these cases, the output is HTML escaped before displaying (in the case of SpringErrorTagProcessor and SpringUErrorsTagProcessor), they don't output any content to escape (SpringSelectedValueComparator returns a boolean), or the expression is a bound object (SPELVariableExpressionEvaluator).
See GitHub issue thymeleaf/thymeleaf-docs#84 for information regarding the docs being updated accordingly.

Custom Html.ValidationSummary()

I'm having problems the default Html.ValidationSummary() in MVC 3.
As default it adds this code:
<ul>
<li style="display:none"></li>
</ul>
And that empty <ul> causes space I would like to get rid of.
Is there some way to work around this problem? Make it toggle some div around it or similar?
how about conditionally showing ValidationSummary
if(!ViewData.ModelState.IsValid)
{
#Html.ValidationSummary()
}
important if you do this you won't be able to use client-side javascript validation (as the div wont be present)
You can create your own validation summary, for example, like here: Custom ValidationSummary template Asp.net MVC 3

How to recognaize which ajax form it is in Django?

I have view which takes care of all the Ajax submits from the client side. And to differentiate them by I uses different submit button names such as this one
<input type="submit" value="Send" name="send_message">
Suggested from this question.
The only problem is that from the view side it doesn't seems to carry the name to the server side so I cannot use the following if-statement
if 'send_message' in request.POST:
It works if I send it normally with page fresh. But I want to use it with Ajax.
I came up with a hack that you can add this name with jQuery. Simply by after serializing() your data you then concatenate the name attribute by data += "&send_message"
Then the if statement will work. But it doesn't seems so clean. So I wonder if there's a better way to handle this? Or should I make different views to handle the different Ajax calls I have?
You really should post each form to a different URL.
If not, you could add a hidden input with the name of the form as the value.
<input name="form_name" type="hidden" value="form_1" />
views.py:
form_name = request.POST['form_name']

Grails formRemote

I have DateFrom and DateTo fields. I want to submit those data to action which will do some business logic but nothing changes on the original GSP, and nothing is updated. How do I manage this? I've tried this:
<g:formRemote name="formName" url="[action: 'myAction']">
Everything is fine but except my action tries to render myAction.jsp.
This is a great place to read how it works.
Basically you need to specify what controller as well:
<g:formRemote name="formName" update="updateMe" url="[controller: 'controller', action:'myAction']">
The "updateMe" is the id of an html-object, preferably div, that you want to alter after submit (but it's not mandatory). It also uses the actionName.gsp to "supply" the answer, this is why you need to have this page create as well.
Remote forms are a bit tricky in the beginning, but they're super simple once you get a hang of it!
This is how I did it:
GSP:
<g:formRemote name="formName" update="updateMe" url="[controller: 'controller', action:'myAction']">
<div id="updateMe">
<g:render template="updateTemplate"/>
</div>
Action:
...
render template:"updateTemplate"
updateTemlate and updateMe div are both empty.
If you have better solution please tell me.
you can use remoteFunction
you need to write submit button inside form and then after it will fire action and some changes shown into div..

wicket MVC best practice

Hi I'am working for sone time with wicket and in my team we argue a lot abot the place that should be given to the design
I think that design should be only in markup in order to achive separation of concernes where others think what i am doing is a boiling plat code
for example we are using this structure to support IE8 usung round corners with pictures :
<div class="panel-wrapper">
<div class="panel-left"></div>
<div class="panel-right"></div>
<div class="panel-bottom"></div>
<div class="panel-top"></div>
<div class="panel-bottom-right"></div>
<div class="panel-bottom-left"></div>
<div class="panel-top-right"></div>
<div class="panel-top-left"></div>
<div class="panel-bg"></div>
<div class="panel-body">
//stuff
</div>
i think that allthoght it's against my belives as a developer this is the best way to achive mvc , to separate view from controler where others say that we should write this code once in wicket panel an derive from the wicket panel
what if tommarow this component would be in another place and the given markup would couse us problems such as using #override getVaration?
Why not use Behaviors?
Keep your component clean by putting the basic layout into the template but use AttributeAppender/AttributeModifiers to add CSS-Classes.
I think it's a good idea to allow designers (who should know about css and semantic markup) to create a static version of your page, then you can decide how to construct the panel and then "wicketize" your panel's markup. I think that's the role designers and developers can play.
Often when deciding how to create a panel, one might be concerned about "what if the markup changes"?.. Well, that's the reason why is useful to know the road map of your website and see how it can be reused. In my case, what I usually do is create an abstract panel with no markup and then start extending it, instead of creating styles and stuff like that, because that usually leads to changes in the panel every time you need a different style when you change the behavior of you panel depending on the style. If you think an abstract panel can be overkill, you can create a default panel with the markup that might get used the most and extend when necessary and use different markup for that new panel.

Resources