I have written a js method which runs perfectly on FF.
This js method is called on the click of a radio button.
In IE, when I click the radio button, the js method is called only when I click somewhere on the form. I have no idea about this strange behavious in IE.
Any ideas?
Thx
Here is my code.
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
HTML CODE:
<h:selectOneRadio id="pid" value="#{Bean.pid}" onchange="javascript:checkPid();">
<f:selectItem itemLabel="label1" itemValue="value1"/>
<f:selectItem itemLabel="label2" itemValue="value2" />
<f:selectItem itemLabel="label3" itemValue="value3" />
</h:selectOneRadio>
JAVASCRIPT:
<script language="javascript" type="text/javascript">
function checkPid() {
//some basic js here
//even if I just give an one-liner alert stmt here, In IE it
//shows up only when I click somewhere on the form after I click
//on the radio button
}
Thanks in advance!
Try the onclick event rather than the onchange event.
You'll need to modify your code though:
<h:selectOneRadio id="pid" value="#{Bean.pid}" onclick="checkPid(this);">
And your javascript function:
function checkPid(e) {
//do stuff with e.value
}
You should be able to validate what the user clicked on by e.value. This should work for both browsers.
Related
I'm trying to click a button after the page loading to open a pop up window with some information:
<script type="text/javascript">
function doHiddenClickPuntoAgua() {
document.getElementById("form:puntoAgua").click();
}
</script>
<p:commandButton id="puntoAgua"
actionListener="#{viewGestionBean.openDialogAgua()}"
style="display: none;">
<p:ajax event="dialogReturn"
listener="#{gestionBean.actualizaTabla()}"
update=":form:tablaUbicaciones" />
</p:commandButton>
I see that the function is calling from then backbean but the actionListener not working in my command button why?
your DOM selector is not referencing the target correctly, try
function doHiddenClickPuntoAgua() {
document.getElementById("puntoAgua").click();
}
doHiddenClickPuntoAgua()
I am using jsf 2. One part of my code is this:
<h:panelGrid id="jobDetail" columns="3" cellpadding="7">
<p:outputLabel value="#{msg['content.jobList.JobName']}" />
<p:inputText id="jobName" styleClass="BIC_search_textbox" value="#{timerConfigurationBean.selectedTimerConfigurationJob.jobName}" required="true" requiredMessage="#{msg['content.jobNew.requiredfield.errormsg']}"/>
<p:message for="jobName" styleClass="error"/>
</h:panelGrid>
<p:commandButton id="update" value="Update_Button" action="#{timerConfigurationBean.updateExportJob}" styleClass="bottomButtonsAfterFirst" update="jobDetail" oncomplete="PF('updatejobpopup').show()"/>
This is only a section of the code. What happens is that when I click on the command button "Update_Button" one of the following two things happen:
1) I enter a value in inputText "jobName" and click the command button. First the function in action="#{timerConfigurationBean.updateExportJob}" runs and then the oncomplete="PF('updatejobpopup').show()" runs. This is how it was intended to be so that is okay.
2) I don't enter anything in inputtext (it is a required field), then click on the commandbutton. I see an error message on the webpage next to the Inputtext field (this happens because I have update="jobDetail" in my commandButton) and action="#{timerConfigurationBean.updateExportJob}" is not run however the oncomplete="PF('updatejobpopup').show()" still runs. This is a problem.
I want the oncomplete to only run when there are no errors on the page just like the function in action="#{timerConfigurationBean.updateExportJob}".
Can someone please help.
You can use the callback of primefaces to give a feedback to the view.
So, in your action method yo can do:
context.addCallbackParam("ok", true);
And in the onComplete:
oncomplete ="if ( args.ok ) { PF('updatejobpopup').show(); }"
I have a JavaScript function defined in a file Common.js named showSearchAccount() which show a pop-up when called. I have also defined two radio buttons in a xhtml file as;
<h:selectOneRadio value="#{userData.data}">
<f:selectItem itemValue="Yes" itemLabel="Yes" />
<f:selectItem itemValue="No" itemLabel="No" />
</h:selectOneRadio>
I need the pop-up to apper when i click on yes radio button, but if I put onclick or onchnage inside the 1st selectItem tag the popup is not appearing. If I put the onclick in selectOneRadio tag it is working, but it gets enabled for both i.e Yes and No.
I have tried this thing with plain html and it works like charm. But I need to it work with JSF. Could anyone please help.
You can let the onclick event at <h:selectOneRadio> and then decide what popup will be shown in the javascript function. I tried the code below and it worked:
XHTML:
<h:form>
<h:selectOneRadio onclick="showPopUp(this.value)">Select:
<f:selectItem itemValue="y" itemLabel="Yes" />
<f:selectItem itemValue="n" itemLabel="No" />
</h:selectOneRadio>
</h:form>
JS:
function showPopUp(type) {
//console.log(type);
switch( type) {
case 'y' : alert('pop up y!'); <--- call your function here for pop A
break;
case 'n' : alert('pop up n!'); <--- call your function here for pop B
break;
}
}
I have a problem with javascript. I have downloaded a rating star plugin , this one to be exact: http://www.fyneworks.com/jquery/star-rating/#tab-Testing
I have multiple things to rate on one page, so i thought i could use an onclick to send it to a function, that sends it to my database with ajax. The problem is, when a rating star is clicked nothing happens, ive tried it on a regular submit button and the function gets executed.
Here is the code :
<script type="text/javascript">
function postform(){
alert('Thing is clicked');
};
</script>
And the star is actually a radio button:
<input name="adv1" type="radio" class="star {split:4}" value="0.50" onclick="postform()"/>
I can't see what is wrong with the code, because when i test it on a regular button like this :
<input type="submit" value="testbutton" onclick="postform()"/>
It gives me the alert Thing is Clicked.
Somehow the star doesn't like the onclick stuff..
Ive tested it in IE, Chrome and FF, nothing ever happens
could someone help me out here?
Thanks alot!
Edit:
As requested by Lukas , i have this in my head :
<script type='text/javascript' src='jquery.min.js'></script>
<script src='jquery.MetaData.js' type="text/javascript"></script>
<script src='jquery.rating.js' type="text/javascript"></script>
That library is handling the onclick event of the radio button for you, so you cannot handle it by adding an attribute onclick to the input element.
According to their documentation you need to put some code like this in a script:
$('.auto-submit-star').rating({
callback: function(value, link){
alert(value);
}
});
Then add the class auto-submit-star to the class list of your radio button:
<input name="adv1" type="radio" class="auto-submit-star {split:4}" value="0.50" onclick="postform()"/>
I have written this code for Firefox:
<html><head><title>No</title>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
</head>
<body>
<form action="javascript:void(alert('Yes'));">
<input type="submit" value="Submit">
</form>
<script>$($('form').submit())</script></body></html>
It correctly displays the alert box.
However, when i run this inside an iframe, with this code:
<html><body><iframe src="click.php"></iframe></body></html>
i don't get the alert box, not even if i click the submit button myself.
What is going on exactly? The same code works in Chromium
Well, don't do that then!
It doesn't make any sense to submit a form to a javascript: URL. Use a submit event handler to pick up the form submission and execute script, eg using jQuery:
$('#someform').submit(function() {
alert('Yes');
return false;
});
A good rule of thumb about when to use javascript: URLs is: never.
It looks like it's a problem with FF4 so I'll discuss it on their bugzilla if it's really their fault. I have modified the source so I'm not even sure it is a bug...