Javascript broken (jQuery)

[kongondo]

Sorry could not think of a more apt title.

As of PW dev 2.5.6 or 2.5.7, I have noticed that some JS functionality in my Blog Module (ProcessBlog) is broken. I have confirmed it is not my code that is broken. I have checked with PW stable version and it works just fine. The code is a simple on change select to submit the form. Changing the select option does nothing. It should submit the form and reload the ProcessBlog Dashboard.

//submit form on select of limit of items to show  - posts, categories, tags
$('.limit-select').change(function ()  {
        $(this).closest('form').submit();
});

[somatonic]

Do you happen to have a button or input called name="submit" ?

What is the error?

[kongondo]

Nope :-). I confirmed that already, thanks Soma..

[somatonic]

What is the error then? What is broken?

[kongondo]

There is no error at all (I'll confirm this). The form just doesn't get submitted. It should get submitted on change of selection of number of items to show in the MarkupAdminDataTable (tags, categories, posts). So, if the user wants to see 5, 10, 15, etc number of items, all they have to do is select the quantity and the page would automatically reload jQuery having posted the form. That has been working fine until dev 2.5.6 or 2.5.7 am not sure. In stable 2.5 it works just fine. I can set up a demo if you want to have a look :-)

[somatonic]

Works fine here in 2.5.6

[somatonic]

You don't have a class "limit-select" on the select rather on the parent span ...

[somatonic]

[ryancramerdesign]

That looks like it must be it. The span.limit-select will never receive a change event. Your event attachment should look like this:

$('.limit-select > select').change(function () { ... }

or this

$('#limit').change(function () { ... }

On Fri, Nov 7, 2014 at 9:59 AM, Philipp Urlich notifications@github.com wrote:

[image: image] https://cloud.githubusercontent.com/assets/370148/4954680/b70e21a2-668e-11e4-9629-9404aca9fbc1.png

— Reply to this email directly or view it on GitHub https://github.com/ryancramerdesign/ProcessWire/issues/784#issuecomment-62155766 .

[kongondo]

No that's not it, sorry I forgot to mention that I had already tried all those suggestions you've made; it doesn't work. Funny thing is that the original code (the span.limit-select version) although 'wrong' has been working. I have tested again with #limit and .limit-select > select and it still doesn't work...in PW dev version BUT works in PW stable version, even 2.4 :-)

[somatonic]

As soon as you click the select inputfields.js adds a class "nosubmit" to form elements...

https://github.com/ryancramerdesign/ProcessWire/blob/dev/wire/templates-admin/scripts/inputfields.js#L640

Bummer. :D

[somatonic]

Not sure about the solution by Ryan complicated it all, and makes things usually simple a headache...

I think you could work around it with

$('#limit').change(function(){ $(this).closest("form").removeClass("nosubmit").submit(); });

[somatonic]

So this "nosubmit" feature will break all that have done this with their modules, yet they don't know, and it will maybe create future problems en masse :D

[kongondo]

That was my worry as well :-(. Soma, thanks your workaround code works a treat! :-). I am leaving this issue open though in light of the larger potential issues this change might lead to for Ryan to contemplate.

@Ryan, over to you....

[ryancramerdesign]

This was added in this commit: https://github.com/ryancramerdesign/ProcessWire/commit/63196b15430756d7f8e524e1ca7beeba6279b9fc

It was added per issue https://github.com/ryancramerdesign/ProcessWire/issues/748 and Soma's issue https://github.com/ryancramerdesign/ProcessWire/issues/747

I'm not really sure of a better approach to take. Maybe a special class that you can use that will prevent it from using that behavior?