function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
RustyboyRustyboy 

Command button not firing in apex component

Hi,

I have read lots of different posts, and tried lots of different varieties but whatever I do I cannot get commandbuttons to fire an apex method in my component.

Here is the main page:
<apex:page Controller="DemoModalController" sidebar="false" tabstyle="My_Meetings__tab" >
    <apex:pageMessages />
	<apex:form id="theForm">
		<h1>Demo Modal</h1>
		<p>Now is the time for all good men to come to arms</p>
		<apex:pageBlock id="theDialog" >
			<apex:commandButton value="Open Dialog"
		        		     	action="{!openDialog}" 
		            		 	title="Open the modal dialog"
		            		 	rerender="theDialog"/>

			<apex:outputPanel id="theDialog" rendered="{!demoDialogObj.displayDialog}" >
				<c:DemoDialog showDialogObj="{!demoDialogObj}" />
			</apex:outputPanel>
		</apex:pageBlock>
	</apex:form>
</apex:page>

And the main controller
public with sharing class DemoModalController {

	public demoModalDisplay demoDialogObj {get; set;}

    public DemoModalController()
    {
    	demoDialogObj = new demoModalDisplay();
    	demoDialogObj.displayDialog = false;
    }
	
    public PageReference openDialog()
    {            		
    	demoDialogObj.displayDialog = true;
	    return null;      
    }
}

The component page
<apex:component controller="DemoDialogController"
				allowDML="true">

    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.12.1.custom/external/jquery/jquery.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.12.1.custom/jquery-ui.js')}"/>
    <apex:stylesheet value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.12.1.custom/jquery-ui.css')}"/>

    <apex:attribute name="showDialogObj"
    				assignTo="{!demoDialogObj}"
    				description="Should the dialog be shown?"
                    type="DemoModalDIsplay"
                    required="true"/>
  
    <div id="dialog">
    
        <apex:pageMessages />

		<p>This dialog box has been created using a jQuery visualforce component!</p>

		<apex:pageBlock id="pageBlock">
		
			<apex:outputPanel id="counter" >
				<apex:actionRegion >
					<apex:outputText value="Click Me {!count}" />
					<apex:actionSupport event="onClick" action="{!incrementCounter}" rerender="counter" status="counterStatus"/>
				</apex:actionRegion>
        	</apex:outputPanel>
        	<apex:actionStatus id="counterStatus" startText=" (Incrementing...)" stopText=" (done)" />
			
			<br />	
			<br />	
			<apex:outputPanel id="actionF">
				<input type="button" value="Click for Action Function" onclick="doME();" />
				<apex:actionFunction name="doME" action="{!doNothing}" rerender="actionF" />
			</apex:outputPanel>
			
			<br />	
			<br />	
			<apex:commandButton value="Do Nothing"
			       		     	action="{!doNothing}" 
			           		 	title="Do nothing" 
			           		 	rerender="theForm"/>
			<br />
			<br />	
			<apex:commandLink value="Do Nothing"
			       		     	action="{!doNothing}" 
			           		 	title="Do nothing"
			           		 	reRender="me" />	 	
			<br /> 	
			<br />	
			<apex:commandButton value="Close Dialog"
			       		     	action="{!closeDialog}" 
			       		     	onClick="closeTheDialog()"
			           		 	title="Close the modal dialog" />
		</apex:pageBlock>	 		
    </div>	    

    <script type="text/javascript">       
     	// Create a new alias for jQuery (j$)
		var j$ = jQuery.noConflict();
	    
	    // When document loaded show the dialog
        j$(document).ready(function(){        
            j$("#dialog").dialog(
            {
                title:"<Dialog Title here>",
                autoOpen: false,							
                width:700,
                height:700,
                modal:true,
                closeable:false,
                resizable:false,
                draggable:true
            });
            
            j$("#dialog").dialog('open');	
        }); 
 
        function closeTheDialog()
        {
            j$('#dialog').dialog('close');
        }          
    </script>
</apex:component>

I have read that action regions can be used to solve the problem, but I cannot get them to work.

I have not been struggling with this for several weeks! Any help greatly appreciated.

Thanks
 
RustyboyRustyboy
Any ideas on this one?