I have a main section that uses th:if with the same obj I'm using in my fragment but the fragment is throwing an error based on that obj.
Below, the nameInfo in mainInfo fragment is throwing an error. Even with null check.
// main.html
<section th:if="${nameInfo != null AND nameInfo.firstName != null}">
<section class="main-cont">
<div id="name-method>
<div class="main-lg-3">
<div th:replace="component/mainInfo :: mainInfo_check "></div>
</div>
</div>
</section>
</section>
// mainInfo.html
<div th:fragment="mainInfo">
<form>
<section th:if="${nameInfo != null AND nameInfo.firstName != null}">
<div class="radio_btn">
<input type="radio" tabindex="0" onchange="test(0, val)" />
<label for="test-rb" style="outline: none;">
<span class="radio"></span>
<span>Name</span>
</label>
</div>
</section>
</form>
</div>
Try to change this
<div th:replace="component/mainInfo :: mainInfo_check "></div>
To this
<div th:replace="component/mainInfo :: mainInfo"></div>
Related
I am developing an application with IONIC 4 for android and IOS.
I add a side menu (ion-menu), it works perfectly on android.
But in IOS it is giving me problems, the menu opens perfectly. But when I want to close the menu. Graphically the menu closes, but when I try to interact with the application, only the options within the side menu are activated.
Only the side menu items are useful, the rest of the application is canceled.
This is the process.
Main page normally:
I open the side menu:
I close the menu:
All this options gets blocked:
But this options still are activated, even though the menu has been hidden.
This only happen in IOS, my specifications:
My code:
<ion-menu side="start" content-id="main-content">
<ion-header class="headermenu">
<div class="spacioemenuleft">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
<img alt="logo" style="width:18.9vw; height:10.6vh; border-radius: 50%;" src="{{pictureusuariomenu}}" >
</div> </div> </div>
</div>
<div class="spacioemenuright">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div class="textsaldo2" [innerHTML]="fullname"></div>
<div class="bloque">
<div style="float:left; width:70%; height:100%" class="textsaldo2">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
PIN: {{pinusuario}}
</div> </div> </div>
</div>
<div style="float:right; width:30%; height:100%; background-color:white;" (click)="copyText()">
<img alt="logo" style="width:100%; height:100%" src="assets/imgs/compartir-b.png" >
</div>
</div>
<span class="error ion-padding" style="color:white; font-weight:bold; margin-top:1em; padding-top:0em;" *ngIf="registrado">
PIN COPIADO!!!
</span>
</div>
</div>
</div>
</ion-header>
<ion-content >
<div class="ion-padding">
<div class="espacio2 margenboton" routerLink="/recargarsaldo">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
Recargar Saldo
</div> </div> </div>
</div>
<ion-list>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/profile">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/perfil.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/profile">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Mi perfil
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/notificaciones">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/11notificaciones.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/notificaciones">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Notificaciones
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%;padding:0.8em;" routerLink="/misretiros" >
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/6dolares.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/misretiros">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Mis retiros
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/historial">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/11historial.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/historial">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Historial
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/contacto">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/contact5.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/contacto">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Contáctanos
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;">
<img alt="logo" style="width:2.7vh; height:2.6vh;" src="assets/imgs/7cerrar.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;" (click)="cerrarsession();" >
Cerrar sesión
</div> </div> </div>
</div>
</ion-item>
</ion-list>
</div>
<div style="height: 15vh; background-color:#F3F3F3; padding:0.2em;">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;" >
<div style="float:left; width:40%; height:100%;" >
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:right;">
<p class="textblue2" style="font-weight:bold;">En alianza con:</p>
</div> </div> </div>
</div>
<div style="float:left; width:60%; height:100%; padding:0.1em; padding-top: 0.6em;" >
<img alt="logo" style="width:80%; height:auto" src="assets/imgs/Grupo517.png" >
</div>
</div> </div> </div>
</div>
</ion-content>
</ion-menu>
Any ideas?
<IonContent>
... other page components
{ authenticated ? <Menu/> : null }
</IonContent>
or what i have done in my example is not even render the router code that contains the menu when the user isn't authenticated
if (!authInfo || !authInfo.initialized) {
return (
<IonApp>
<IonLoading isOpen={true} />
</IonApp>
);
} else {
return (
<IonApp>
<>
{authInfo?.loggedIn === true ? (
<IonReactRouter>
<IonSplitPane contentId="main">
<Menu />
<IonRouterOutlet id="main">
<Route path="/page/:name" component={Page} exact />
<Route path="/tabs" component={TabRootPage} />
<Redirect from="/" to="/tabs" exact />
</IonRouterOutlet>
</IonSplitPane>
</IonReactRouter>
) : (
<IonReactRouter>
<Route
path="/create-account"
component={CreateAccountPage}
exact
/>
<Route path="/login" component={LoginPage} exact />
<Redirect from="/" to="/login" exact />
</IonReactRouter>
)}
</>
</IonApp>
);
}
See full app and source code here : https://github.com/aaronksaunders/ionic-sidemenu-tabs-auth-starter
i have one model in that there are 10 classes. im getting error at Model[9]. how to handle null exception at Model[9].
error
Index was out of range. Must be non-negative and less than the size of the collection.
Parameter name: index
<div class="small-box bg-blue">
<div class="inner">
<h3> #Model[9].status<sup style="font-size: 20px"></sup></h3>
<p>N-7 NEW ST SR #Model[9].deviceid.ToUpper().Substring(11, 5)</p>
</div>
<div class="icon">
<i>
#if (#Model[9].status.ToUpper() == "CLOSE")
{
<img src="~/images/door-closed.png" />
}
else
{
<img src="~/images/door-open.png" />
}
</i>
</div>
</div>
This question already has answers here:
What is a NullReferenceException, and how do I fix it?
(27 answers)
Closed 6 years ago.
Below is my partial view call:
<div id="div-reviewgrid">
#Html.Partial("_ReviewList", ViewBag.RewiewLists as List<Pollit.Data.Review>)
</div>
this is my partial view inside shared folder under Partial:
#using Pollit.Data;
#{
List<Review> reviewList = ViewBag.RewiewLists;
}
<br /><br />
#if (reviewList != null)
{
foreach (var review in reviewList)
{
<div class="col-lg-12">
<div id="#review.Id">
<div class="col-lg-1 col-md-1 col-xs-12 col-sm-12">
#if (review.Rating != null)
{
<img src="/images/ratings/#review.Rating.Number-bars.png" class="pull-left" style="max-height: 50px; max-width: 50px; margin-left: 30px" />
}
</div>
<div class="col-lg-11 col-md-11 col-xs-12 col-sm-12">
<span>#review.Creator.Name #String.Format("{0:d}", review.Created)</span>
<br />
<h4 class="custum-memphisfontmediumitalic ">#review.Content</h4>
#*<input type="submit" value="Like" class="btn btn-info" />
<input type="submit" id="click" value="Comment" class="btn btn-info" />
<input type="text" id="comment" placeholder="Enter your comment" class="form-control" />*#
</div>
</div>
<br />
#if (Request.IsAuthenticated == true)
{
if (review.Replys != null)
{
foreach (var reply in review.Replys.OrderBy(c => c.Created))
{
<div id="reply_#reply.ReplyID" class="col-lg-8 col-md-10 col-xs-12 col-sm-12 col-lg-offset-1 ">
<span>Reply By:#reply.Creator.Name #String.Format("{0:d}", #reply.Created)</span>
<br />
<h4 class="custum-memphisfontmediumitalic">#reply.ReplyContent</h4>
</div>
}
}
<div class="col-lg-8 col-md-10 col-xs-12 col-sm-12 col-lg-offset-1 form-group ">
<input type="text" id="txtReply_#review.Id" placeholder="Enter your reply" class="form-control" />
</div>
<div class="col-lg-2 form-group"><div class="demo">
Reply
<img src="/Images/Comment rate up.png" class="img-responsive" width="40px" ><img src="/Images/Comment rate down.png" class="img-responsive" width="40px" ></div>
</div>
}
</div>
}
}
<br /><br />
Above is my partial view code so guys let me know if I am doing something wrong. Please help me. Thanks in advance for help
when you are calling your partial view the way you have written its wrong. each time you call it the new model is generating and your model goes empty`
#Html.Partial("_ReviewList", ViewBag.RewiewLists as List<Pollit.Data.Review>)
write Model instead of ViewBag.RewiewLists as List<Pollit.Data.Review>
I'm running ReactJS.NET with ASP.NET MVC, and everything renders well, except... i cannot get any kind of events to fire...
What i have tried :
1) Eliminating all JQuery references/usages - no success
2) onHover, onClick, with functions both inside and outside of the React-component - no success
Here is my code :
Attaching ProductLine React component in index.cshtml
#Html.React("ProductLine", Model)
React component
function addToCart() {
alert("Hoohohoho!!!");
};
var ProductLine = React.createClass({
render: function () {
return(
<div className="col-md-12 col-sm-12 col-xs-12" key={this.props.productData.name}>
<button onClick={this.addToCart}>Click me!</button>
<div className="row" >
<div onClick={addToCart} className="col-md-12 col-sm-12 col-xs-12 nopadding row-default" >
<div className="col-md-3 col-sm-5 col-xs-5 nopadding">
<span className="table table-col ">
<input type="checkbox" id="cbxCheck2" className="jq_select_product" />
<label htmlFor="cbxCheck2" className="jq_select_product">{ this.props.productData.name }</label>
</span>
</div>
<div className="col-md-4 hidden-sm hidden-xs nopadding">
<span className="table table-col table-text-small">
{ this.props.productData.label }
</span>
</div>
<div className="col-md-3 col-sm-4 col-xs-4 nopadding">
<span className="table table-col">
849,- (12 mnd)
</span>
</div>
<div className="col-md-2 col-sm-3 col-xs-3 nopadding">
<span className="table table-col table-text-small text-right">
<img id="imgShowMore" src="../../Images/arrow_purple_down.png" className="show-more _icon jq_expand_listview" /><label className="show-more _lbl jq_expand_listview">Vis mer</label>
</span>
</div>
</div>
<ProductDetails productData={this.props.productData} />
</div>
</div>
);
},
addToCart: function (e) {
alert("Hooooo!!!");
},
});
After 1/2 a day of trial and error, i suddenly tried to put all the JSX file references at the bottom of the _Layout.cshtml page...
That solved it all actually...
I'm new in Grails. I would like to use custom validator for matching two passwords during registration in my application. Unfortunetly doesn't work it.
Account.groovy
#Validateable
class Account {
String login
String password
String confirm
String passwordHashed
char active
static transients = ['password', 'confirm']
static belongsTo = Employee
static hasMany = [role:Role]
static constraints = {
login unique:true, blank: false
active nullable: true
password blank: false, size: 5..15, validator:{ val, obj ->
if(obj.password != obj.confirm ){
return ['dontmatch']
}
}
}
static mapping = {
id generator: 'increment'
}
}
AuthenticationController.groovy
class AuthenticationController {
def signUp(Account accountInstance){
if(accountInstance!= null){
if (accountInstance.hasErrors()) {
respond accountInstance.errors, view:'signUp'
return
}
else{
accountInstance.save(flush: true)
}
}
}
}
signUp.gsp
<%# page import="com.sarna.entity.Account"%>
<%# page import="com.sarna.entity.Employee"%>
<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="bootstrap-main" />
<title>SARNA</title>
</head>
<body>
<br />
<div class="container">
<div style="margin-top: 50px"
class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
<div class="panel panel-info">
<div class="panel-heading">
<div class="panel-title">Sign Up</div>
<div
style="float: right; font-size: 85%; position: relative; top: -10px">
<a id="signinlink"
href="${createLink(uri: '/authentication/signIn') }">Sign In</a>
</div>
</div>
<div class="panel-body">
<g:form class="form-horizontal" role="form"
url="[resource: accountInstance]"
method="POST" controller="Authentication">
<g:hasErrors bean="${accountInstance}">
<div class="alert alert-danger">
<g:renderErrors bean="${accountInstance}" />
</div>
</g:hasErrors>
<div class="form-group">
<label for="email" class="col-md-3 control-label">Email</label>
<div class="col-md-9">
<input type="text" class="form-control" name="email"
placeholder="Email Address">
</div>
</div>
<div class="form-group">
<label for="icode" class="col-md-3 control-label">Login</label>
<div class="col-md-9">
<g:textField type="text" class="form-control" name="login"
required="" value="${accountInstance?.login }"
placeholder="Login" />
</div>
</div>
<div class="form-group">
<label for="password" class="col-md-3 control-label">Password</label>
<div class="col-md-9">
<g:passwordField name="password"
class="form-control ${hasErrors(bean:accountInstance,field:'password','errors')}"
placeholder="Password" />
</div>
</div>
<div class="form-group">
<label for="icode" class="col-md-3 control-label">Confirm</label>
<div class="col-md-9">
<g:passwordField
class="form-control ${hasErrors(bean:accountInstance,field:'password','errors')}"
name="confirm" placeholder="Confirm Password" />
</div>
</div>
<div class="form-group">
<!-- Button -->
<div class="col-md-offset-3 col-md-9">
<g:actionSubmit action="signUp"
class="btn btn-lg btn-success btn-block" value="Sign Up" />
</div>
</div>
</g:form>
</div>
</div>
</div>
</div>
</body>
</html>
messages.properties
account.password.dontmatch=Podane hasła muszą się zgadzać
I don't understand it. I enter two different passwords and I click signUp button, I don't see errors messages which should be display when validation failed. Could you help me?
The call of validate() is missing:
if (!accountInstance.validate() || accountInstance.hasErrors()) {
...
}
Match the actual value from the validator with the confirm property from the actual object.
password blank: false, size: 5..15, validator:{ val, obj ->
if( obj.confirm && val != obj.confirm ) { // val is password
return ['dontmatch']
}
}
I think instead of the respond in the controller you want
render (view: "signUp", model: [accountInstance: accountInstance])
Your view expects an accountInstance object in the view model to render the errors, so you have to provide it.
You can also just do
return [accountInstance: accountInstance]
If there is a gsp that has the same name as the current action grails will automatically render it.