I use latest dev versions of Webform and Webform Ajax. When i try to submit webform on it's own page - all works fine. But when i try to submit webform, displayed as block on separate page - ajax submit does not work (form submited with default non-ajax submit and redirect to results page).

Comments

jcollyer’s picture

I also have a Webform embedded in a block throughout my site, and AJAX doesn't work. The wrappers and classes appear on the form, but the submit action posts the form as if no AJAX is run at all.

Webforms v7.x-3.19
Webform AJAX v7.x-1.1
jQuery v1.8 (via jQuery Update)

The form doesn't appear twice on the page, confirmation is set to "No Redirect", AJAX is enabled, and all other form settings appear to be correct.

timgilmour’s picture

this was doing the same thing for me, but there's a setting under Webform > Form Settings > Redirection location. Set that to No Redirect and it will load the confirmation message via ajax.

jcollyer’s picture

I have No Redirect checked, and when I visit the webform's page everything works as it should.

When the webform is embedded in a block however, it doesn't use ajax, it redirects to the page.

jordiserratosa’s picture

Same issue here!
All webforms embedded in a block reload the page after submission althougt I've checked the No Redirect options.
When you use the webform through the webform node page the AJAX submission works perfect...

timgilmour’s picture

hmm, strange. i have it working via ajax, with a confirmation message (not a confirmation page redirect) and it definitely works as it should like that. i'm using webform_ajax 7.x-1.1, webform 7.x-3.19, running under Panopoly.

jcollyer’s picture

I checked over my settings. I definitely have AJAX enabled, and the confirmation set to "No Redirect".

Is there some dependant module I'm missing that Panopoly provides?

ssoulless’s picture

Hello, Im not sure what is this problem Im also facing this weird problem. When I fill for the first time a webform in a block it does not has ajax it works in the normal fashion without ajax...

But if I fill the webform in the block for the first time with an error (for example let empty a required field, or whatever) the webform reloads the page with the error messages, but if I try again the webform in the block, it woks now with ajax...

Very weird, Im using

webfrom 7.x-4.0-beta3
webform ajax 7.x-1.1+0-dev
Drupal core 7.26

Im afraid to update the drupal core to 7.27 due to they notify that modules that use custom ajax form callbacks require changes...
check this: https://drupal.org/node/2242663

So Please let us know if the problem is with the drupal core or what...

mloyat’s picture

Hi all,
i got an issue using webfor ajax in a block. I render a block in my template using module_invoke

$form = module_invoke('webform', 'block_view', 'client-block-361');
print render($form['content']);

For some unknown reason, the id of the submit button was not rendered, i forced the id attr with a template function :


function mytheme_form_webform_client_form_alter(&$form, $form_state, $form_id) {
	$form['actions']['submit']['#attributes']['id'] = 'edit-webform-ajax-submit-'.$form['#node']->nid;
}

and everything works now fine

Hope it helps

jwjoshuawalker’s picture

@ssoulless

You are safe to upgrade regarding that topic.
webform_ajax does not use ajax_get_form()

Of course, I can't speak for other modules in your stack.

i.bajrai’s picture

Confirming #8 is a fix.

Your submit ID may not match his example exactly so open the console in chrome dev tools and type Drupal.settings.ajax and look for the selector property on your ajax attachment. i.e. mine was #edit-submit and I adjusted the code appropriately.

This was on a custom handler on web form submit button, not via the module's alters.

Ingvar’s picture

#8 works fine, thanks!

fromtheindia’s picture

Yup, #8 works for me too!!

jamesvande’s picture

#8 did the trick of me.

goldii’s picture

#8 works for me to, thanks!

swim’s picture

Can someone who has implemented #8 please post back if you are rendering the block manually (like in #8) or if you are using the provided Webform block. This is only an issue if the provided Webform block doesn't submit correctly.

CatherineOmega’s picture

#15: Yes, I can confirm that the theme code on its own as provided in #8 lets my rendered-by-Webform block work correctly with AJAX.

summerg’s picture

#15 - The fix in #8 works for me as well, and I am not rendering the block manually, but placing on the Blocks page.

harsh111’s picture

Thank You So much 8 Worked for me too.

penone’s picture

# 8 worked for me too but how can I make this work for Next Page / Prev Page buttons on multipage webforms?

Update: Never Mind - All good.

Gabox’s picture

Hello, it's seems to be a JS problem with misc/jquery.form.js
The problem was solved when I installed JQueryUpdate module.
https://www.drupal.org/project/jquery_update

If this is true, this should be a requierment on the module?
Hope this solves the problem. I hope some day the module don't need JQuery Update beacause it's a module very heavy and hard to work with.

Thnx! GL!

abhishek.pareek’s picture

#8 worked like a charm for me as well, thanks buddy.

cb’s picture

#8 helped for me but wasn't a silver bullet.

I find that the module reloads several elements on the page which is causing me issues.

Ie, one page component is a streaming player, when i submit an ajax webform, the player pauses for a few seconds.

Any ideas?

Thanks!

bellagio’s picture

can you please help me to figure out where to put the code from #8?
i put below code to template.php and change 'mytheme', & 'clinet-block-361' but same behavior. thank you.

function mytheme_form_webform_client_form_alter(&$form, $form_state, $form_id) {
$form['actions']['submit']['#attributes']['id'] = 'edit-webform-ajax-submit-'.$form['#node']->nid;
}

$form = module_invoke('webform', 'block_view', 'client-block-361');
print render($form['content']);

issa.haddadin’s picture

I'm using the latest webform ajax dev version with webform 7.x-4.12 and it's not working, it reloads the page even if the user was on the node page not using a block.

sbrousseau’s picture

I just spent a long time troubleshooting the same issue. Turns out in my case it was Drupal block caching that was causing the issue. Submitting an ajax webform in a block works every time if I disable block caching.

thakurPankaj’s picture

can any1 tell me where to put this below code in template

function mytheme_form_webform_client_form_alter(&$form, $form_state, $form_id) {
$form['actions']['submit']['#attributes']['id'] = 'edit-webform-ajax-submit-'.$form['#node']->nid;
}

thanks

aswathyajish’s picture

#8 worked for me.

But one issue. For admin login, this works. But for anonymous users, this is not working.

I am using drupal 8 and the code used is :

function mytheme_form_webform_client_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id) {
$form['actions']['submit']['#attributes']['id'] = 'edit-webform-ajax-submit-'.$form['#node']->nid;
}

Any help?

vivek.kekare’s picture

for #8 $form['#node']->nid coming blank for me.
I am using webform 6.1.2 and drupal 9.2.5