We Keep Coding

a4j:commandButton not submitting

In my xhtml, inside a <h:form> tag I have multiple panels, a4j:jsFunction and rich:popupPanel and a rich:panel. In my rich:panel I have a few text areas. Then, in another panel, inside a rich:popupPanel I have an a4j:commandButton that calls a a4j:jsFunction. What I want is when the a4j:commandButton is clicked, all data from rich:panel to be submitted. The following code is not submitting anything.
<h:form id="createId">
<h:panelGrid columns="1">
<rich:panel
style="border-width: 1px; border-color: #6B489D; padding:30px">
<rich:panel style="width:100%" >
<fieldset>
<table ...>
...some outputText, inputText...
</table>
</fieldset>
</rich:panel>
<rich:popupPanel id="confirmEditPane" autosized="true">
<a4j:commandButton value="Cancel" onclick="#{rich:component('confirmEditPane')}.hide(); return false;" />
<h:outputText value=" " />
<h:outputText value=" " />
<a4j:commandButton value="Edit" onclick="edit(); return false;" />
</rich:popupPanel>
</h:form>

Try adding the attribute domElementAttachment="form" to your popuppanel.

I managed to resolve this by adding <p:ajas event="valueChange"/> inside every panel containing textboxes and now everytime I change the value inside a textbox it gets sent to the server. Thank you for your contribution.

Enable/disable panel on click of button in jsf/primefaces?

I have a Button called Add oncilck of add panel needs to be displayed and within the panel there is a cancel button onclick of cancel the panel should be closed my problem is onclicking the add button the panel is coming for a moment and disapperaring. actually i have incuded template_2.xhtml which has .. if i remove from template_2.xhtml the panel is working fine but these warnings are coming like this The form component needs to have a UIForm in its ancestry. Suggestion: enclose the necessary components within i want both of things to work fine and warnings should not come .Here is my codei know the problem that i am using 2 times form in 1 xhtml page but not able to overcome that help me out
`
<h:commandButton value="Add" id="show" action="#" onclick="panelwv.show()" ></h:commandButton>
<h:form>
<p:panel id="panel" widgetVar="panelwv" visible="false" header="Add Dependents">
<h:panelGrid id="myPanel" columns="3" cellpadding="5" styleClass="text-input">
<h:outputText value=""/>
<h:outputLabel value="Name" style="font-family: cursive;font-size: 18px;font-weight:normal;"/>
<h:inputText id="name" value="#{depco.depapp.dep.name}" styleClass="border" label="First Name" />
<h:outputText value=""/>
<h:outputLabel value="Relationship" style="font-family: cursive;font-size: 18px;font-weight:normal;"/>
<h:inputText id="rel" value="#{depco.depapp.dep.relationship}" styleClass="border" label="Relationship" />
<h:outputText value=""/>
<h:outputLabel value="Date of Birth" style="font-family: cursive;font-size: 18px;font-weight:normal;"/>
<p:calendar id="dob" value="#{depco.depapp.dep.dob}" showOn="button" label="Date of Birth" />
<h:outputText value=""/>
<h:outputLabel value="Emp Id" />
<h:selectOneMenu value="#{depco.depapp.dep.empId}" >
<f:selectItems value="#{coemp.empapp.itemsAvailableSelectOne}" var="emp" itemLabel="#{emp.empId}" itemValue="#{emp.empId}" />
<f:converter converterId="employeeConverter" />
</h:selectOneMenu>
<h:outputText value=""/>
<h:commandButton value="Save" action="#{depco.createDepAction()}"/>
<h:commandButton action="#" id="hide" onclick="panelwv.hide()" value="cancel"/>
</h:panelGrid>
</p:panel>
</h:form>
`

Your Example is working fine for me, [using Primefaces 3.5 JSF 2.1.13].
It might be the problem with the buttons you used.
Usually h:commandButton will not do a Ajax submit, it submits the form untill you specify f:ajax explicitly, so that might be the reason the panel is coming and disappearing.
Use p:commandButton which does a ajax submit by default.or else use f:ajax with the h:commandButton.
Since you are not calling any ManagedBean's property or method from your h:commandButtons, you can even use h:button.

JSF menu and submenu tags should be included within form tag .so i just mage a separate jsf file with some name(say xyz.xhtml) and i just included the xyz.xhtml in actual jsf page using

auto select of h:checkbox in jsf datatable

I have a datatable in which first and second column is checkbox , first one is multiselect and second one id single select, I have done till this,
Now I have to auto select the first chckbox when user click the second checkbox which is for default .
as I am new to javascript please assist.
below is my datatable
<h:dataTable value="#{roundingBean.elementDetailsDTOList}" var="v" styleClass="updateitem">
<h:column>
<f:facet name="header"> Select</f:facet>
<h:selectBooleanCheckbox id="checkBox" value="#{v.isCheckBoxSelected}" />
</h:column>
<h:column>
<f:facet name="header"> Default Category</f:facet>
<h:selectBooleanCheckbox id="radio" value="#{v.isRadioSelected}" onclick="dataTableSelectOneRadio(this);"/>
</h:column>
<h:column>
<f:facet name="header"> Category</f:facet>
#{v.categoryName}
</h:column>

You can do something like this:
<h:selectBooleanCheckbox id="checkBox" value="#{v.isCheckBoxSelected}" onclick="document.getElementById("radio").checked = true;" />

You will have to take help of css and jquery here.
If you have a unique id variable in ElementDetailsDTO, use it to define a css class for the checkbox.
<h:selectBooleanCheckbox id="checkBox" value="#{v.isCheckBoxSelected}" styleClass="#{v.id}StyleClass" />
Then for the radio button, add an onselect attribute like below
<h:selectBooleanCheckbox id="radio" value="#{v.isRadioSelected}" onclick="$('.#{v.id}StyleClass').prop('checked',true)"/>
Using id attribute to get elements inside a data table is not advisable since in the actual html that is generated, these ids will be prefixed with the table id and column id.

Required JSF input component which is hidden by JavaScript is still validated

I have a list of values from ,from the list of values i want to check some values means at that corressponding text box will show in bottom.Otherwise the text box will be hidden.I have done this process using javascript. But my issues is i have to validate using required=true attribute. But the problem is the hidden text box also validated.
Primefaces pages for List values:
<p:selectManyCheckbox onchange="checkValue();" value="#{volunteerBean.knowAbt}" layout="pageDirection" id="s" immediate="true" required="true" requiredMessage="Select how to konws about cv?" style="width:300px;height:170px;">
<f:selectItems value="#{volunteerBean.hearLst}" var="he" itemLabel="#{he}" itemValue="#{he}" />
<p:ajax event="change" update="msg1111" />
</p:selectManyCheckbox>
Input Text Box coding:
<p:inputText style="display:none;" id="searchEngine" value="#{volunteerBean.searchEngine}"><p:watermark for="searchEngine" value="Search Engine"/>
JavaScript for hidden and show inputText through checking the list of checkBox:
function checkValue() {
var chk = document.getElementById("volunteerForm:s:10");
if (chk1.checked) {
document.getElementById('volunteerForm:searchEngine').style.display='';
}else {
document.getElementById('volunteerForm:searchEngine').style.display='none';
}
}
I am using primefaces 3.0 and jsf 2.0. How to solve it

You're changing only the HTML DOM tree and you're not changing the JSF component tree. JSF is not aware at all that the HTML element has been hidden in the client side. You need to show/hide the JSF component instead by its rendered attribute and include its client ID in the <p:ajax update>.
<p:selectManyCheckbox ... value="#{volunteerBean.knowAbt}">
<f:selectItems value="#{volunteerBean.hearLst}" />
<p:ajax event="change" update="msg1111 searchEngine" />
</p:selectManyCheckbox>
<p:inputText id="searchEngine" ... rendered="#{volunteerBean.knowAbt.contains('valueOfItem10')}" />
where valueOfItem10 is the exact value of the item at index 10, like as you tried to check in JS. Note that I assume that knowAbt is a List<String>, exactly as your hearLst suggests (for which I have removed the superfluous var, itemLabel and itemValue from the above example as they are the defaults already). Otherwise you'd need to perform the job in a helper method of the backing bean instead.

getting control ID inside repeater by Jquery

I have Entries I want to comment on them . So I created a Repeater with a TextBox and a
Button inside it . How can I get the id of the button and textbox for specific row by
Jquery ?
<ASP:REPEATER runat="server">
<ItemTemplate>
...
// Entries: bind data from DB
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" />
</ItemTemplate>
</ASP:REPEATER>
Thanks .

Your big problem is that your asp repeater control is going to generate ids like this ct100_repeater_txt1 which isn't going to help you get that comment associated with its corresponding db row
The common way I have found to accomplish this (which is a pretty standard way I believe) is to assign the elements id with the row id from the database, or if you have no control over the id, to create a custom attribute.
Pseudo code I have used looks something like this: (I'll try and make it language/platform agnostic so you can learn the concept, as opposed to only the language)
<repeater template>
<textbox id="txt1" dbid='<% eval database id>'/>
<button id="btn1" dbid='<% eval database id>'/>
</repeater template>
that should generate code that looks like:
<input type="textbox" value="" id="ct100_txt1" dbid="14" />
<input type="button value="submit" id="ct100_btn1" dbid="14" />
<input type="textbox" value="" id="ct100_txt2" dbid="12" />
<input type="button value="submit" id="ct100_btn2" dbid="12" />
<input type="textbox" value="" id="ct100_txt3" dbid="39" />
<input type="button value="submit" id="ct100_btn3" dbid="39" />
Then in whatever language you want you can read from that attribute:
Button.Click{
get attribute dbid of button clicked;
save text of textbox of same dbid to a database;
}
Many cheers! Hope that works for ya
EDIT
In response the the comment "where do id save the dbid?!" I'm assuming in a database :) How should you save it? There are lots of ways. Here's one you could try with jquery:
create a javascript function to save answers that takes a parameter. when you bind the dbid to the control, bind it into an onclick function and pass that id to the function. The function then gets the text where the dbid matches and saves the comment and id to a database.
<textbox dbid="14" />
<input onclick="doStuff(14)" />
<script>
function doStuff(var id){
var comment = $('textbox[dbid=id]').value();
ajax(your url and arguments);
};
</script>

Without more information this is the best I can offer you:
for html like this (which is how asp.net will render your button/textbox):
<div id="row1"><button type="button">Click Me!</button><input type="text" name="tb_info" /></div>
<div id="row2"><button type="button">Click Me again!</button><input type="text" name="tb_info" /></div>
You could select the button and textbox for specific row by using the following jQuery:
$("#row1 > button, #row1 > input")