jQuery .post not executing task in URL

Question

Hello,

My issue involves jQuery .post and Joomla. I have a template with a form that is within one of the accordion areas (using jQuery UI accordion). I have a button type=submit in the form. The form html is generated via jQuery when a user clicks a button in the accordion area.

When a user clicks the form submit button, the event calls jQuery.post, which then is supposed to call a save function within the controller, which in turn calls a save to db function in the model.

The URL for .post is index.php, and I serialize() the form inputs - with the hidden elements, I have the task set to a save function that is within the controller, and the controller defined as well.

The problem is that the save task in the controller is not being called when the button is clicked, nor is the save to db function in the model. After the user clicks on the button, the page redirects to index.php (home page). No save to database.

Any help would be much appreciated.

template.php form elements:

<input type="hidden" name="controller" value="controller" />       
<input type="hidden" name="task" value="saveProgramUI" />'

.js Code:

jQuery('#new_program_form').submit( function () {
    if (jQuery('#new_program_form').valid()) {
        jQuery.post("index.php", jQuery("#new_program_form").serialize(), function(html){
            alert("Data Loaded: " + html);
         });
    }
});

Controller code:

function saveProgramUI(){



    $program = JRequest::get( 'POST' );
    $model = & $this->getModel('pfm');

    $model->saveProgramUI($program);


    $resp = "Hello World!";

    return $resp;

}

Model code:

function saveProgramUI($program)
{

 $programTableRow =& $this->getTable('programs');
// Bind the form fields to the programs table, save to db

if (!$programTableRow->save($program)) {

JError::raiseError(500, 'Error saving program');
} 

}

Answer 1

Add return false; to the end of your submit handler.

Without that, the browser will submit the form normally after running your handler, before it gets a chance to send the request.

Answer 2

SOLVED.

This was a Joomla issue, not jQuery.

Needed to add this line to the component file for the component:

$controller->execute(JRequest::getCmd('task'));

Also added the view view.raw.php and corresponding layout template as well.

This page was instructive: http://docs.joomla.org/How_Joomla_pieces_work_together

I am new to Joomla development, so went back to the basics to understand things, that page had the answer.

Thanks to everyone for the ideas!