I have this code for a .jsp page:
<f:view>
<div class="portletBody">
<h:form id="editSectionForm" onsubmit="return numCheck(document.forms[0].elements['editSectionForm:sectionTable:0:maxEnrollmentInput'].id)">
<sakai:flowState bean="#{editSectionBean}"/>
<t:aliasBean alias="#{viewName}" value="editSection">
<%# include file="/inc/navMenu.jspf"%>
</t:aliasBean>
<h3><h:outputText value="#{msgs.edit_section_page_header}"/></h3>
<%# include file="/inc/globalMessages.jspf"%>
<t:aliasBean alias="#{bean}" value="#{editSectionBean}">
<%# include file="/inc/sectionEditor.jspf"%>
</t:aliasBean>
<t:div styleClass="act">
<h:commandButton
action="#{editSectionBean.update}"
value="#{msgs.update}"
styleClass="active"
onclick="reEnableLimits();" />
<h:commandButton action="overview" value="#{msgs.cancel}" immediate="true" />
</t:div>
</h:form>
</div>
</f:view>
and I have some javascript code that runs in the /inc/sectionEditor.jspf file. In some of that code in the sectionEdtior file, I need to somehow grab the id of this form. editSectionForm. I can't hard code it because the /inc/sectionEditor.jspf code runs in more than one page.
So pretty much, I need the javascript code in /inc/sectionEditor.jspf to be able to grab the id of the form it is currently in.
i.e:
If I'm in the editSectionForm page, it'll tell me that im in that page, if I'm in addSection Form page, it'll tell me that I'm on that page.
I'm not sure I fully understand the question. Are you trying to get the current page you are in, as in the url?
http://css-tricks.com/snippets/javascript/get-url-and-url-parts-in-javascript/
Or do you have multiple forms on the same page?
I actually figured out another way for my situation. For anyone that's ever used Sakai, they know the beast that it is.
I see you already use document.forms[0] in your jsp page, so, making assumption there is one form only, you may use the same construction inside a script section of your 'subpages' also, i.e. using document.forms[0].id will give you the id of the form.
<!DOCTYPE html>
<html>
<body>
<form id="editSectionForm">
<div id="sectionEditor">
<script type="text/javascript">
var formId = document.forms[0].id;
console.log(formId);
</script>
</div>
</form>
</body>
</html>
Related
I have the following code to open a google page and type "Hello" in the textbox.
The code opens the page but the textbox is empty.
Does anyone have an idea please ?
Thanks.
<html>
<head>
<script type="text/javascript">
function getValue()
{
var myWindow = window.open("http://www.google.com","_self")
myWindow.title = "Test"
var TextBox = myWindow.document.getElementsByName("lst-ib");
TextBox[0].value="Hello"
}
</script>
</head>
<body>
<form>
<input name="to" type="hidden" value="hoolah" />
<input type="button" onclick="getValue()" value="Get Value!" />
<form/>
</body>
</html>
You cannot:
Access the DOM of a page on a different origin
Access the DOM of a page from JavaScript that was running in the same window before you loaded the new page
What you want is impossible.
(If it was possible, it would be a security problem as your JavaScript would have access to personal data belonging to your visitors and stored on other websites.)
If I understand the question - you want to be able to pass a value to a Google search from your page. Rather than accessing the DOM of an external page - you are just trying to enter a value into the search term box on the google page.
All you have to do is append a query string to the Google url (such as "http://www.google.com?query=searchTerm" and it will pass the value to the search box on the google page.
I have slightly modified your code to show this - not how i would normally do it but I wanted to keep your code in place as much as possible so you can see whats going on.
I added a search term input and the onclick event opens the window and submits the query to Google. It could have been done as a form submit as well. Note that I put the JS at the bottom of the page - increases speed of page rendering - not important for this, but good practise movingforward. I also declared the variables together instead of using 2 'var's as well.
your code (slightly modified).
<html>
<head>
</head>
<body>
<form>
<input id="searchTerm" type="text" value="" placeholder="Search term"/>
<button type="button" onclick="getValue()">Search</button>
</form>
<script>
function getValue()
{
var term,myWindow;
term=document.getElementById('searchTerm').value;
myWindow = window.open("http://www.google.com?query="+term,"_self")
}
</script>
</body>
</html>
I am using this code in my .xhtml page
In head tag, i am using for refresh purpose,
<script type="text/javascript">
alert("hi");
setInterval(function() {
document.getElementById('myForm:btnLoadData').submit();
alert("Hello");
}, 3000);
</script>
and inside ui:define tag i am writing this code.
<h:panelGroup id="divData" layout="block">
//my jsf code..................
</h:panelGroup>
<h:form id="myForm">
<h:commandButton id="btnLoadData" value="Hidden" style="display:none">
<f:ajax execute="#form" render=":divData" />
</h:commandButton>
</h:form>
After all this I am not getting any error, but the hidden button is not working as desired in script. Even I cant see the alert("Hello").
Update: I can see the first alert("hi") but not alert("Hello")
I am newbie in jsf. I have to implement polling type thing or auto refresh.
I also tried this example. But its not working.
Problem 2
I dont know that much jsf. At some places I am using normal HTML tags. I dont know why URL is not showing the page name. Its always like host/myProjectName. I am expecting host/projectName/Login.xhtml or host/projectName/SomeOtherPage.xhtml
Even browser back button or reload for that particular page not works. It reloads from first page of my project i-e Login page. Are both problems interrelated. How can I handle this.
Somebody please help me with the problem.
I am trying to make a website, where a user can input some data. I would then run a number of methods on this data using sinatra and then display the results on the same input page (i.e. without refreshing (or redirecting) the page - as such the input data is still the form).
I understand that I would probably have to use javascript to watch the submit button and use that to stop the redirection.
I know ruby quit well, but do not know javascript that well; so please bear with me.
I have done quite a bit of research on this, but I haven't got anything to work. (This question is similar, but I haven't even been able to successfully use that).
This is the my sinatra file. Currently, pressing the submit button redirects to an another page.
require 'sinatra'
get '/' do
erb :search
end
post '/' do
#the_input = "<h2>ID header</h2>#{params[:input]}"
end
__END__
## search
<!DOCTYPE html>
<html>
<head></head>
<body>
<form action="/#result" method="post">
<input type="text" name="input">
<input type="submit">
</form>
<div class="result" id="result" style="display: none;">
<div class="content">
<!-- this is where the Results should display... -->
</div>
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#result').submit(function(){
//parse AJAX URL
var action = $(this).attr('action');
var index = action.indexOf('#');
var url = action.slice(0, index);
var hash = action.slice(index, action.length);
$('.result').show();
$('.result .content').html(index);
})
})
</script>
</body>
</html>
I would really be grateful if someone could help me to get this to work so that the input of the form is displayed into the content div. Any explanation of what you are doing would also be extremely helpful.
Many Thanks for all your help.
This may help you
Basically prevent default redirecting.
I'm writing several JSP pages and i need to attach a function to a button in an existing form. In this form, the submit button performs a navigation to another jsp view (I'm using MVC pattern with Slim3 framework, on Google AppEngine), and I need another button (next to submit button) to perform a navigation to another different JSP view. So, to achieve this, i create another button of "button" type in the existing form, create a .js file where I put my JavaScript code to perform "alternative" navigation and included the .js in the JSP view. But, it doesn't works ._. Here's the code:
JSP page containing the form:
...
<body>
<%# include file="script.js" %>
<%# include file="../header.jsp" %>
<%# include file="sidebar.jsp" %>
<div id="content">
<div id="main">
<p>Hello main admin testimonials edit Index !!!</p>
<h2><b>Modifica Testimonial</b></h2>
<form action="update" method="post">
<h3>Nome: </h3>
<textarea name="name">${f:h(testimonial.name)}</textarea><br />
<h3>Cognome: </h3>
<textarea name="surname">${f:h(testimonial.surname)}</textarea><br />
<h3>Dettagli: </h3>
<textarea name="details">${f:h(testimonial.details)}</textarea><br />
<h3>Progetto:</h3>
<select name="projectKey" selected="${f:h(testimonial.projectRef.key)}">
<c:forEach items="${projectsList}" var="project">
<option value="${f:h(project.key)}">${f:h(project.name)}</option>
</c:forEach>
</select>
<br />
<input type="submit" value="Aggiorna"/>
<input type="button" value="Elimina" onclick="delete()"/>
<input type="hidden" ${f:hidden("key")}/>
</form>
</div>
</div>
</body>
</html>
script.js:
<script type="text/javascript">
function delete()
{
if (confirm('Ask navigation confirm'))
{
window.navigate("bla bla new view url");
}
else
{
return;
}
}
</script>
EDIT: I change the name of function, replacing with the real name in my original code.
Ok, <%# include file="script.js" %> works well, putting the code in script.js in page. Now, it works rightly! I changed the function name, passing from "delete()" to "fdelete()", seems that "delete" name can create issues, I'm thinking that because I tried to write directly the JavaScript in the page (a really simple alert) and call it from button, with "delete()" function name the script didn't run! I can't understand why, but there it is.
EDIT: After many years of web development I stepped into this question again. Of course a function named "delete" can't work, because "delete" it's a JavaScript reserved word!
JavaScript God, please forgive my sins, I was young and inexperienced :(
I have a jquery fancyzoom box. In that box ,I have a contact form which sends an email on submission. But I am not able to call form submit function due to fancyzoom.
Code is like :
("req_quote.php")
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/fancyzoom.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#popup1_link').fancyZoom({width:610});
$("#submit").css('cursor', 'pointer');
$('.reqfrm').submit( function(){
alert("hell");
});
});
</script>
<body>
<form class="reqfrm" id="frm">
<input type="text" name="name" />
<input type="submit" name="submit" id="submit" value="Submit" />
</form>
</body>
</html>
Above file is included in "index.php" which contains the actual link to open the form in fancyzoom box.
(index.php)
< a href="#popup1" id="popup1_link">< div class="blink">Request a Quote< /a>"
If I remove $('#popup1_link').fancyZoom({width:610}); then i get alert on submission otherwise it goes on form action directly.
Are you getting any JavaScript errors with the fancyZoom call in? Are you including the script file you need to use it? It's hard to say without seeing some more data, or a jsbin / jsfiddle.
The form is submitted in the fancybox js file.
As mentioned by Raul, you need to provide more info for us to help out. You could try any of these things:
See if you can reproduce this issue within a simple html file, that doesn't have any of the extra stuff that your current page may have. If the issue still persists, put it into jsFiddle and post the link here.
If you haven't already, install the Firebug addon for Firefox, and use it's console to check for any JS errors.
Have a look at the jsFiddle that I've created. Is this similar to what you are doing? Mine works wihtout any issues.