I am pretty new to AEM. I am following this tutorial from the official documentation. I already did it from top to bottom, but now I am trying to do it again but using Eclipse, Maven and Sightly instead of JSP.
I've been following until the step "Using your own scripts". As I am trying to use Sightly instead of JSP I've ended up with the following files:
contentpage.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<div data-sly-include="head.jsp" data-sly-unwrap></div>
<div data-sly-include="body.jsp" data-sly-unwrap></div>
</html>
body.jsp
<%#include file="/libs/foundation/global.jsp"%>
<%
%><body>
<div id="CQ">
<div class="topnav">topnav</div>
<div class="content">
<cq:include script="left.html" />
<cq:include script="center.html" />
<cq:include script="right.html" />
</div>
<div class="footer">
<div class="toolbar">toolbar</div>
</div>
</div>
</body>
left.html
<div class="left">
<div>logo</div>
<div>newslist</div>
<div>search</div>
</div>
center.html
<div class="center">
<div>trail</div>
<div>title</div>
<div>parsys</div>
</div>
right.html
<div class="right">
<div>iparsys</div>
</div>
In addition, the node apps/myproject/components/contentpage has an attribute sling:resourceSuperType="foundation/components/page" so it is inheriting from the page component provided.
Everything works as expected, but as I said before, I am trying to use only Sightly, but at the moment I've got the file body.jsp, which I think I need it to be JSP so it has the same name as /libs/foundation/components/page/body.jsp.
Is there a way to get rid of the body.jsp and use a sightly script instead? I suspect that maybe there is a components/page/body.html somewhere, but no idea where to look for it (in case it really exists).
Thanks.
As commented by rakhi4110, and as I suspected, there is a sightly version of the page component. It is located in wcm/foundation/components/page so the only thing to do is inherit from it instead of foundation/components/page.
This is a link to an article that put me on track, in case is useful for somebody else: http://scottwestover.blogspot.co.uk/2015/04/aem-tutorial-on-building-sightly-page.html
Related
This is pretty bizarre, but according to the MDN docs autocomplete has wide-spread support for TextArea element (given that the listed requirements are met):
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
But it doesn't seem to work, at least not in either Chrome or FireFox.
This is an example of what doesn't work:
<html>
<body>
<form action="index.html" method="post">
<input type="first" name="input" id="a" autocomplete="on"><br> <!-- Works! -->
<textarea name="second" id="b" autocomplete="on"></textarea><br> <!-- Doesn't work!-->
<input class="submit" type="submit" value="Submit">
</form>
</body>
</html>
So this begs the question: has there been an actual regression in two major browsers, or are the MDN docs wrong? ... or am I missing something entirely different?
Turns out it currently isn't supported from what I can tell: https://www.chromestatus.com/feature/5680387573415936
I have a html page and i am sending some parameter using post method.
now i want to get these parameter on gwt client.
is there any method in gwt to get post parameter on client.?
i use following code
<html>
<body>
<form action="http://localhost:8080/popnnn/js.html" method="post">
<input type="text" id="foo" name="foo">
<input type="submit" value="Send" name="submit" id="submit">
</form>
</body>
</html>
and in my gwt code
TextBox text=new TextBox();
text.setText(Window.Location.getParameter("foo"));
this is perfectly woking with get method but not with post
please help......
Steps to follow:
Just convert the file js.html to js.jsp.
Get the post parameter from the request parameter.
Set the value in hidden div in JSP and access it in JAVA.
Change the action attribute of form tag as shown below:
<form action="http://localhost:8080/popnnn/js.jsp" method="post">
Try any one:
JSP Scriplets
<div id="fooParameter" style="visibility: hidden;">
<%=request.getParameter("foo") %>
</div>
JSP Standard Tag Library
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<div id="fooParameter" style="visibility: hidden;">
<c:out value="${param.foo}" />
</div>
Access value from hosted HTML/JSP to JAVA code
String foo = RootPanel.get("fooParameter").getElement().getInnerHTML();
TextBox text=new TextBox();
text.setText(foo);
Find a sample code here about Acces value between two jsp with jstl
I'm trying to create a Lift chat server. I've taken everything straight from the Lift book that is linked to from Lift's main website. Upon running it, I cannot submit my messages because liftAjax is undefined and causes an error that appears in my chrome console.
Correct me if I'm wrong, but shouldn't Lift generate the liftAjax stuff upon starting up the website? I have a feeling I could import liftAjax myself from some source and it would work, but I don't feel I should have to do this.
This is my index.html file.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Home</title></head>
<body class="lift:content_id=main">
<div id="main" class="lift:surround?with=default;at=content">
<!-- the behavior of the div -->
<div class="lift:comet?type=Chat">Some chat messages
<ul>
<li>A message</li>
<li class="clearable">Another message</li>
<li class="clearable">A third message</li>
</ul>
</div>
<div>
<form class="lift:form.ajax">
<input class="lift:ChatIn" id="chat_in" />
<input type="submit" value="Say Something" />
</form>
</div>
</div>
</body>
</html>
This is what is generated:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div id="main" xmlns="http://www.w3.org/1999/xhtml">
<!-- the behavior of the div -->
<div id="F156429460218VSI1GX_outer" style="display: inline">
<div id="F156429460218VSI1GX" style="display: inline">
<div xmlns="http://www.w3.org/1999/xhtml">Some chat messages
<ul>
<li></li>
</ul>
</div><script type="text/javascript">
// <![CDATA[
/* JSON Func comet $$ F156429460221QEXVXK */function F156429460221QEXVXK(obj) {liftAjax.lift_ajaxHandler('F156429460221QEXVXK='+ encodeURIComponent(JSON.stringify(obj)), null,null);}
// ]]>
</script></div><script type="text/javascript">
// <![CDATA[
var destroy_F156429460218VSI1GX = function() {}
// ]]>
</script></div>
<div>
<form id="F156429460223BHVYIM" action="javascript://" onsubmit="liftAjax.lift_ajaxHandler(jQuery('#'+"F156429460223BHVYIM").serialize(), null, null, "javascript");return false;">
Note: the error happens on the above line
<input name="F1564294602245ECYAU" id="chat_in" xmlns="http://www.w3.org/1999/xhtml" />
<input value="Say Something" type="submit" xmlns="http://www.w3.org/1999/xhtml" />
</form>
</div>
</div>
I'm just not really sure what could be causing this. I'm just starting to learn Lift so I do not know much. Am I missing something?
If you need more information, such as build.sbt or other files just let me know and I can post them as well.
In my case, I was missing following body part that automatically seems to source liftAjax.
<body class="lift:content_id=main">
<div id="main" class="lift:surround?with=default;at=content">
......
</div>
</body>
But, in another case, sourcing jquery manually would work with JQuery module injected in Boot.scala.
<script id="jquery" src="/classpath/jquery.js" type="text/javascript"></script>
You don't need to manually include the liftAjax function, but you do need to include jquery manually. Lift will not automatically inject a reference to it since it doesn't know what version, minification level, or location you want to use. Try adding:
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
To the head section of your template.
I've a website used by over 500,000 people, but a tiny few (about 20) are reporting that one of the forms resets when clicking "submit".
I've stripped out other code, but the HTML in the FORM tags is complete:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
<body>
<form id="fProfile" action="/cv.html" method="post" enctype="multipart/form-data">
<div class="row"><label for="fName">Your Name:</label><input type="text" id="fName" name="text" /></div>
<div class="row"><label for="fEmail">Your Email:</label><input type="text" id="fEmail" name="email" /></div>
<div class="row"><label for="fCvFile">Your CV:</label><input type="file" id="fCvFile" name="cv" /><em>Please only attach a CV, up to 200kb in size.</em></div>
<input type="submit" class="submit" name="go" value="Save CV" />
</form>
</body>
</html>
There is no JavaScript involved and the form could not be simpler!
Feedback is limited, but it's being reported that this happens on MSIE/Chrome/Firefox. It must be third party software interupting the form but reports come in from computers with McAfee/AVG/Avast. I can't find a single common factor other than the HTML ...
All reports say that the form resets on clicking the submit "Save CV" button without attempting to load a page but I'm unable to replicate this.
I've never come across anything like this and am hoping one of you have!
Thanks for any help or guidance.
EDIT: I've added a name/email input form too to show that it is just the type=file input that is resetting. The remainder of the form holds on to the entered text.
It says you are posting to a HTML page - surely you would need to post to a PhP page or similar.
So basically when you hit submit the page is just refreshing. Also in your HTML page you should always have a head tag.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to use Twitter Bootstrap popovers for jQuery validation notifications?
Trying to use bootstrap's styles for form validation.
I'm using this javascript validator, that was customized for bootstrap:
https://github.com/ddarren/jQuery-Live-Form-Validation-For-Twitter-Bootstrap
In the head:
<link href="bootstrap.css" rel="stylesheet">
<script src="jquery.validate.js" type="text/javascript">
In the body:
<form id="Form" action="" method="post">
<div class="control-group">
<input type="text" class="span3" id="Mobile" placeholder="Mobile
Phone Number" name="Mobile">
</div>
<div class="control-group">
<button type="submit" class="btn btn-primary btn-large">Submit
</button></p>
</div>
</form>
And it doesn't highlight the fields with bootstrap's error styles. Any ideas where I'm going wrong? Thanks in advance.
I'm working on something similar so I think I might help you.
First of all, jQuery-Live-Form-Validation-For-Twitter-Bootstrap library is quite old (September of 2009).
It uses version 1.3.2 of jQuery (the newest is 1.7.1) and it doesn't use the original Bootstrap files at all!
If you downloaded jQuery-Live-Form-Validation-For-Twitter-Bootstrap (what I am sure you did) from github site you can easily check in css folder that there are two css files written by the author of that library.
Answering to your question, I downloaded that lib and I've pasted your code and... it works. Simply, you need to have in head this (and that files in folders):
<link rel="stylesheet" type="text/css" href="stylesheets/jquery.validate.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/style.css" />
<script src="lib/jquery/jquery-1.3.2.js" type="text/javascript">
</script>
<script src="javascripts/jquery.validate.js" type="text/javascript">
</script>
what is originally taken from jQuery-Live-Form-Validation-For-Twitter-Bootstrap.
If you really want to have Twitter Bootstrap form validation with jQuery I would like to recommend you using combined Twitter Bootstrap and jQuery Validation Plugin.
I am working on it now and it works perfectly.