Ajax Trigger In Yii

Hello, i need help form pro’s.

How do i make form that when i click on Submit, it makes Ajax request instead of submitting/refreshing page?

This is what i have currently, but it is not working:

The form HTML code:




	<div class="row">

		<label for="Book_author">Author</label>        <div class="ajax-form">

	<div class="row">

		<label for="Person_fname">First Name</label>		<input size="60" maxlength="64" name="Person[fname]" id="Person_fname" type="text" />		<label for="Person_lname">Last Name</label>		<input size="60" maxlength="64" name="Person[lname]" id="Person_lname" type="text" />	</div>

</div><!-- form -->

        <div class="row buttons">

            <input class="add" type="button" obj="Person" url="/cbdb/index.php?r=book/createAuthor&id=7&ajax=1" value="Add" />

        </div>



And here is book/createAuthor function code:




    public function actionCreateAuthor($id){

        // request must be made via ajax

        if(isset($_GET['ajax']) && isset($_GET['person'])){

            $model=  $this->loadModel($id);

            $author=new Person();

            $author->attributes=$_GET['Person'];

            if(($author->fname!=null) && ($author->lname!=null)){

                $model->addAuthor($author);

                $this->renderPartial('_li',array('model'=>$model, 'author'=>$author),false,true);

            }

        }else{

            throw new CHttpException(400,'Invalid request.');

        }

    }



Unfortunately when i click on Add button nothing appends.

I am following "Yii Rapid Application Development Hotshot [eBook].pdf" book, chapter 2 (page ~69)

I wouldn’t say i am complete beginner in PHP and Yii, but when it comes to Ajax i am beginner.

Any help will be highly appreciated.

You can try the ajaxSubmitButton. http://www.yiiframework.com/doc/api/1.1/CHtml#ajaxSubmitButton-detail




<?php 

echo CHtml::ajaxSubmitButton( 'Send', CHtml::normalizeUrl(array('site/ajaxSubmit')),

    array(

        'error'=>'js:function(){

            alert(\'error\');

        }',

        //if you add a return false in this, it will not submit. 

        'beforeSend'=>'js:function(){

            alert(\'beforeSend\');                                            

        }',

        'success'=>'js:function(data){

            alert(\'success, data from server: \'+data);

        }',

        'complete'=>'js:function(){

            alert(\'complete\');

        }',

        'update'=>'#where_to_put_the_response',

    )

);

?>



Pep, thanks for replay.

It turned out that in ""Yii Rapid Application Development Hotshot" tutorial, it was never mentioned to include .js file that does all the Ajax work. That was the problem.

Hi,

if you call an ajax on submit button please see it…

http://www.yiiframework.com/forum/index.php/topic/43977-ajax-client-side-validation-without-refreshing-page/page__p__208536__fromsearch__1#entry208536

hope it will be helpful.

Guntars,

Was sample code provided with the book? I think I didn’t mention the include because it was my understanding accompanying files would be provided to the consumer when the book was purchased. Packt still contacts me about errata, and I’d like to fix anything that is wrong.

Thank you,

James Hamilton

Co-Author, "Yii Rapid Application Development Hotshot"

P.S. Sorry for the late reply, just saw your post. I see you got it sorted, but would like to make sure I have done what I can for others.