• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

JSF page submitting to backing bean, even javascript validation fails...

 
Greenhorn
Posts: 4
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi,

I have a datatable and buttons (like create, edit and delete) on JSF page.

if user clicks on edit button, with out selecting a row - it should give the popup saying..."Please select a row"

I am calling Javascript function to get the pop up. ( even i am getting pop up succesfully..)

But when i click on OK of pop up, it submits the page to backingBean method ( which is been specified as the action...i.e. editGroup() in case of EDIT button and deleteGroup() method incase of DELETE button)....

Even i returned "false" from javascript funciton... it's not working...

Please suggest me the solution....

see the code here...

<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="http://bea.com/faces/adapter/tags-naming" prefix="netuix"%>

<script type="text/javascript">

// this is to highlight the row which is been selected by the USER
var previouslySelectedRow = 'null';

function selectRowOnClick(selectedRow){



var tbodyElement = selectedRow.parentElement;
var dataTable = selectedRow.parentElement.parentElement;

var hiddenField=document.getElementById('SecurityGroups_1:mainForm:hiddenId1');

deselectPreviousRow(selectedRow,tbodyElement);

selectedRow.className = 'panelgrid-selected';

previouslySelectedRow=selectedRow;
alert('selected row is'+ selectedRow.id + hiddenField );

hiddenField.value=selectedRow.id;
//document.getElementById('SecurityGroups_1:mainForm:hiddenId1').value= selectedRow.id;
}

function deselectPreviousRow(row,tbodyElement,dataTable){

if(previouslySelectedRow=='null'){

return;

}

if(row.id!=previouslySelectedRow.id){

var rows = tbodyElement.getElementsByTagName('tr');

var numberOfRows = rows.length;

var i;

for(i=0;i<numberOfRows;i++){

rows[i].className='panelgrid-body';

}

}

}

// this is to display the POP up box, when user click on edit or delete button with out selecting a row.
function check() {

if(previouslySelectedRow=='null'){

alert('Please Select a row from the table' );
//return false;
}

}

</script>


<f:view>
<netuix:namingContainer id="facesContent">
<h:form id="mainForm">

<t:panelGrid id="grid1" columns="1">
<t:panelGroup id="panel1">

<t:dataTable id="secureGroupId" var="userGroup" value="#{mangUserBackBean.allSecurityGroupDetails}" width="100%"
bgcolor="gainsboro" border="1" headerClass="panelgrid-header" rowStyleClass="panelgrid-body"
rowOnClick="selectRowOnClick(this)" rowId="#{userGroup.userGroupName}?#{userGroup.network}">
<h:column>
<f:facet name="header">
<h:outputText id="col1" value="Security group" />
</f:facet>
<h:outputText id="secGroup" value="#{userGroup.userGroupName}" style="text-align: center" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText id="col2" value="Network" />
</f:facet>
<h:outputText id="network" value="#{userGroup.network}" style="text-align: center" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText id="col3" value="Network alias" />
</f:facet>
<h:outputText id="netAlias" value="#{userGroup.alias}" style="text-align: center" />
</h:column>
</t:dataTable>

<h:inputHidden id="hiddenId1" value="#{mangUserBackBean.selectedGroup}"/>

</t:panelGroup>

<t:panelGroup id="panel3">

<h:commandButton id="new" value="New" styleClass="submit-button" type="submit" rendered="true" action="#
{mangUserBackBean.newGroup}"/>
<h:commandButton id="editGroup" value="Edit" type="submit" styleClass="submit-button" onclick="check()" action="#
{mangUserBackBean.editGroup}"/>
<h:commandButton id="delete" value="Delete" type="submit" styleClass="submit-button" onclick="check()" action="#
{mangUserBackBean.deleteGroup}" />

</t:panelGroup>


</t:panelGrid>
</h:form>
</netuix:namingContainer>
</f:view>




 
Ranch Hand
Posts: 115
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
In your check() make sure you have "return false" if there is validation error, and "return true" if no validation error occurs.

try this:
<h:form id="mainForm" onsubmit="return check()">
 
Live ordinary life in an extraordinary way. Details embedded in this tiny ad:
a bit of art, as a gift, that will fit in a stocking
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic