Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bootstrap Modal JS conflicting with ASP.NET button postback #253

Open
1parkplace opened this issue Sep 21, 2014 · 7 comments
Open

Bootstrap Modal JS conflicting with ASP.NET button postback #253

1parkplace opened this issue Sep 21, 2014 · 7 comments

Comments

@1parkplace
Copy link

It's not throwing any errors in the console, but commenting out the Bootstrap-modal.js and modal manager fixes the issue.

Any idea why this would happen and any setting I can toggle to prevent this from occurring?

Any button I have in a modal that causes a Post Back to ASP.NET will not fire as long as I have Bootstrap-Modal.JS in the page.

@jschr
Copy link
Owner

jschr commented Sep 21, 2014

To allow for stacking modals properly this plugin will append the modals to document.body when they are opened. There shouldn't be any issues if the form you want to submit is inside the modal itself. If the modal is inside the form and the submit button is part of the modal, submitting the form won't work because the modal is no longer nested in the form when it is opened.

If for some reason the form cannot be moved to be inside the modal itself that you'll probably have to use a bit of javascript to manually submit the form.

@1parkplace
Copy link
Author

The button and the form are inside the modal-body.

This plugin does not seem to be compatible with ASP.NET web form applications though. I just looked at the output of the rendered markup and it is producing the modal outside of the ASP.NET

tag for the page. This can't work with ASP.NET, anything involved in posting back needs to exist in the tag of the overall page.

@jschr
Copy link
Owner

jschr commented Sep 21, 2014

I don't have any experience with ASP.NET web form applications so you'll have to forgive my lack of knowledge about them. Is it possible the issue can be fixed by setting a different modal container other then body?

$.fn.modal.defaults.manager = '#app'

@1parkplace
Copy link
Author

Yea! I was just trying that and wanted to report my findings.

Changed manager = 'form' and line 366 and 367 of bootstrap-modal.js to:
var $baseModal = $('

').appendTo('form'),
$baseBackdrop = $('
').appendTo('form');

It's working!

@1parkplace
Copy link
Author

ASP.NET Web form apps basically put everything inside of a

element, allowing for elements in your pages to post back to the server to update information, thus, anything appended to the body can be for display only, but if it is dynamic in nature, it breaks, causing those items to not have any "form" to post to.

@jschr
Copy link
Owner

jschr commented Sep 21, 2014

ah ok, I don't see anything wrong with your solution as long there's only ever one form element on the page. If there's ever two forms on a page you'll run into some issues.

@ivanlewis
Copy link

any other workaround for this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants