ajaxSubmitButton: type = button?

Hello,

I were making a small example for the yii playground project (you can already find it online) and I tried to use ajaxSubmitButton in a simple form and for the first time noticed that if I hit enter on the input (text) field it won’t submit using the button ajax request but instead the page reloads (so a normal form submit happens)

I’ve solved this “forcing” the type of the button to submit with “‘type’=>‘submit’” in the htmlOptions but this sounds a bug for me cause then if you don’t have to set the ajax request type to ‘POST’ using the ajaxSubmitButton instead of just the ajaxButton, then why have you to manually specify the ‘type’ ? Or did I miss something in my code? You can see it here.

thanks.

bye,

Giovanni.

So if you don’t specify ‘type’=>‘submit’ it does not use AJAX when using TAB→ENTER?

hi,

thanks for your reply.

if I use tab => enter it should works cause if you hit tab then you move the selection to o the button and with enter or space you simulate the click action on the button, right? :rolleyes:

I mean that if you still have the focus on the text input field and you hit enter from the text input field, the form is not submitted using ajax but instead it is submitted using the standard action (and then the result is that the page is refreshed, as I don’t have specified an action)

So the button in the form is just a button while the submit button should be the default button, the one that will be “clicked” when you hit enter from another field of the form… and right now the only way to achieve this that I’ve found is to specify type’=>‘submit’.

bye,

Giovanni.

I have also same type of problem…

my ajaxSubmitButton doesn’t launch anything when clicked as it has been generated with other ajax request before.

I have heard that JQuery does not include neseccary event handlers or something when ajaxSubmitButton is called via other ajax request, so thats why nothing happens when ajaxSubmitButton is clicked.

Looking forward that someone would have ideas how to repair this problem…

You must re-bind your event.

You can do so by calling a attach_ajax_events javascript after loaded your new content:

in your custom.js :




function attach_ajax_events()

{


					

		// attach ajax post event

		$(".ajaxSubmit").live('click', function ()

		{

			ajaxSubmit($(this));

		});			

}


	function ajaxSubmit (button) {

		var url = $(button).parents("form").attr('action');

		jQuery.ajax({

			'type':'POST',

			'url':url,

			'cache':false,

			'data':$(button).parents("form").serialize(),

			'success':function(html)

				{


					

					$(button).parents('.form').parent('div').html(html);

					

					// attach all events occured in ajax				

					attach_ajax_events();


				}

		});

		return false;		

	}



Or call attach_ajax_events() at the end of your view:




<script type="text/javascript"> 

/*<![CDATA[*/

jQuery(document).ready(function() {

    attach_ajax_events();

});

/*]]>*/

</script> 



I think this is not possible with the Yii ajaxSubmitButton. Therefore you have to build your own ajax submit like written above.

Hello,

actually this is another kind of problem; in my case it works when clicked with the mouse, but it is not set as default button for the form so when hitting enter from another field of the form (like a text box) nothing happens and you have to manually click the button with the mouse. A solution is to force the type to submit as I wrote but then I can’t see the advantage of having both ajaxSubmitButton and ajaxButton ::)

bye,

Giovanni.

@samdark:

you can try it yourself if you get the code of:

http://www.yiiplayground.cubedwater.com/index.php?r=AjaxModule/ajax/ajaxRequest#ajaxButton

then do the following:

  • insert some text into the "Some text" field

  • hit enter on the keyboard (you should see the ajax request result)

  • comment/remove the “‘type’=>‘submit’,” line (#55)

  • insert some text into the "Some text" field

  • hit enter on the keyboard (you should see the whole page reload: wrong behavior (?))

bye,

Giovanni.

Yay! Fixed in version 1.1.4 :) Thanks!

bye,

Giovanni.