Ajax Call To [Object%20Object]

Yii 1.1 General Discussion
1

I have a link that fires an AJAX request inside a JavaScript function that will render a pop-up form. This pop-up form is actually an ‘edit’ form, meaning there is data already filled in each form element.

This is the code for the link:




CHtml::link('Update', "",  // the link to open the dialog box

array(

'style'=>'cursor: pointer; text-decoration: underline;',

'onclick'=>"{updateAgent(" . $agent['id'] . "); $('#dialogUpdateAgent').dialog('open');return false;}"));

This is the updateAgent() JavaScript function:




function updateAgent(id)

{ 	

	var update_id;

	update_id = '?r=site/updateuser&id='+id;

	

    <?php

	echo CHtml::ajax(array(

	'url'=>'js:update_id',

	'data'=> "js:$(this).serialize()",

	'type'=>'post',

	'dataType'=>'json',

	'success'=>"function(data)

	{

		if (data.status == 'failure')

		{

			$('#dialogUpdateAgent div.divForForm2').html(data.div);

			$('#dialogUpdateAgent div.divForForm2 form').submit(updateAgent);

		}

		else

		{

			$('#dialogUpdateAgent div.divForForm2').html(data.div);

		}		

	}",

	));

	?>

    return false; 

}

Problem:

The form does not seem to submit. And when I check the console in firebug, it causes "NetworkError: 500 Internal Server Error" everytime I hit the submit button of the form with this url: "site/updateuser&id=[object%20Object]".

The form will only submit successfully if I will hard code the id value of the JS function like this:




update_id = '?r=site/updateuser&id='+3;

instead of




update_id = '?r=site/updateuser&id='+id;

I researched about issues regarding the passing of JS variable to Ajax and did some tests but still the problem persists.

Thanks in advance!

2 

'onclick'=>"{updateAgent(" . $agent['id'] . ");

What is the value of $agent[‘id’] here ? It should be a number… but check your page source to see if in that call you are getting updateAgent(3) ;)

3

Hi there Maurizio. This is the line in the page source:




onclick="{updateAgent(3); $('#dialogUpdateAgent').dialog('open');return false;}"

It can retrieve the data from the model but when I am going to submit the form, it seems like it can’t retrieve the id from the URL.

4

Did you check the updateAgent() in the page source?

5

Here is the function in the page source:




function updateAgent(id)

{ 	

	var update_id;

	update_id = '?r=site/updateuser&id='+id;

	

    jQuery.ajax({'url':update_id,'data':$(this).serialize(),'type':'post','dataType':'json','success':function(data)

			{

				if (data.status == 'failure')

				{

					$('#dialogUpdateAgent div.divForForm2').html(data.div);

					$('#dialogUpdateAgent div.divForForm2 form').submit(updateAgent);

				}

				else

				{

					$('#dialogUpdateAgent div.divForForm2').html(data.div);

				}		

			},'cache':false});    return false; 

}
6

The code seems OK… the only thing remained is to check with a tool like firebug and to see what is the value of "id" when updateAgent() is called.

7

I reviewed again the code and I think I found where the problem persists. Here again the code:




function updateAgent(id)

{ 	

	var update_id;

	update_id = '?r=site/updateuser&id='+id;

	

    <?php

			echo CHtml::ajax(array(

			'url'=> 'js:update_id',

			'data'=> "js:$(this).serialize()",

			'type'=>'post',

			'dataType'=>'json',

			'success'=>"function(data)

			{

				if (data.status == 'failure')

				{

					$('#dialogUpdateAgent div.divForForm2').html(data.div);

					$('#dialogUpdateAgent div.divForForm2 form').submit(updateAgent);

				}

				else

				{

					$('#dialogUpdateAgent div.divForForm2').html(data.div);

				}		

			}",

			));

	?>

    return false; 

}

When I click a link that will call the JavaScript function updateAgent(id), it runs the Ajax code that is why the data fills in the form perfectly because the function can retrieve the value of ‘id’ directly from the link.

However, whenever I click the submit button, the form will call again the function updateAgent() through this line:




$('#dialogUpdateAgent div.divForForm2 form').submit(updateAgent);

This time, the value of ‘id’ is already lost and the function executes with an empty parameter.

I am thinking about how I can retain the value of ‘id’ so that I can use it when I call the function again.

Thanks!

8

And why are you passing this function as a parameter of submit() ?

I don’t know your need, but when a form is submited why woudl you call again the function that is creating/opening the form… wouldn’t you need to close the form at that point? So maybe create a separate function for that.