Google type app

Yii 1.1 Tips, Snippets and Tutorials
1

Hi all,

I am not sure if something similar was posted so hear me out.

Google uses a lot of ajax requests to load only the needed content. Well I tried to do similar with Yii, but I ran into problem when I need to create forms through ajax, but because they are generated with jQuery I need live action for code to work. How to solve this?

Does it seem to me or Google changes url with javascript. If it does I want to know how ajax request react to changed url.

Thanks in advance.

2

if your writing a javascript heavy app look at something backbone or knockout with yii would be much easy for you

3

Live is not good to use, use "on" instead.

it works alittle bit diffrent

$("#foo").live(‘click’,function(){});

turns into

$(body).on(‘click’,’#foo’,function(){});

the first selector (within $(), in this example body); is the parent element in which jQuery will begin to search for the second selector, in this case "#foo".

For performance reasons it is best to use the closest ancestor to the second selector

so with

<div id="fooDiv">

&lt;button id=&quot;foo&quot;&gt;Foo&lt;/button&gt;

</div>

the above code would work, but $("#fooDiv").on(‘click’,"#foo",function(){}); would be better.

Thats the way you should treat elements that are created /fetched/loaded after the javascript code itself. (in the cases you’ve had to use .live() )

It’s no “problem” just how jQuery works.

4

Thanks Sampa, I’m going to try that. I want my app to run as fast as posible.

5

You can read more about live vs on here, a great review with much info and explanations.

http://www.jquery4u.com/jquery-functions/on-vs-live-review/

There is often problems with using javascript in ajax loaded views.

Sometimes it is because of the wrong type of event trigger, other times when widgets are used for example jQuery can get included twice, overiding(clearing) the previous jQuery code so it stops working.

Sometimes you have to re-iniate code, with ajax pagination is a classic example where you have to use "afterAjaxUpdate" to "re-create" the code that stops working after you switch to a diffrent page.

It’s a tricky task sometimes to find out what,why,and how :P but Helps this info can help you to easier locate any errors in the future.