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

Add AJAX to b:dateTimePicker #482

Closed
stephanrauh opened this issue Aug 2, 2016 · 8 comments
Closed

Add AJAX to b:dateTimePicker #482

stephanrauh opened this issue Aug 2, 2016 · 8 comments
Assignees
Milestone

Comments

@stephanrauh
Copy link
Collaborator

As @ScreamingTree86 points out, we've forgotten to add AJAX to <b:dateTimePicker />. BootsFaces 1.0 should fix that.

@asterd
Copy link
Collaborator

asterd commented Aug 5, 2016

Done and documented with 9e9b7e0 . Maybe @stephanrauh you must have a look to check is all ok, please!

@stephanrauh
Copy link
Collaborator Author

stephanrauh commented Aug 13, 2016

I guess I should run a QA session on it, but it's definitely far better than before. The remaining issue is that the demo loses the time of the date picker. @asterd AFAIK, you cared about it, but I also remember you didn't push your solution to GitHub?

@MitchTalmadge
Copy link
Contributor

Using 0.9.2, I can't seem to get ajax to do anything at all. Was this tested?

@asterd
Copy link
Collaborator

asterd commented Sep 15, 2016

Hi @MitchTalmadge, the source code on GitHub was aligned with the support of Ajax in DateTimePicker (9e9b7e0 and 3532a41). I don't know if the pre-build jar contains this commit... but also in BootsfacesWeb (source code) the documentation is aligned with an example of ajax call.

@MitchTalmadge
Copy link
Contributor

MitchTalmadge commented Sep 17, 2016

@asterd It appears that ajax does work for popup and basic type fields, but not at all for inline. Also, the ajax appears to only fire when I click on the field, but not when I click on the dates inside the popup. For example, if I click on the field, which makes the popup appear, then ajax is fired. If I click a date inside the popup, even though the date changes inside the field, ajax is not fired. If I click away from the field, and then click on it again, ajax is now fired and the correct date is sent.

I understand that much of this might be the fault of the datetimepicker library creator. I'll see if there's any documentation there...

Edit: Actually, it works perfectly fine on their site: http://eonasdan.github.io/bootstrap-datetimepicker/ (See the linked pickers example)... The bootsfaces code looks fine though, so I'm confused.

@MitchTalmadge
Copy link
Contributor

MitchTalmadge commented Sep 18, 2016

Found the problem; ajax is only happening on the onclick javascript event. To get it to work with the date change event, I just added ondtchange="ajax:true" to the dateTimePicker, which caused BootsFaces to generate the necessary javascript. I would have assumed that ajax="true" was all I needed for both onclick and ondtchange, so maybe that can be an improvement in the future?

Edit: Even with this method, the inline datepicker does not work w/ ajax. The value being set is always null, no matter what.

Edit: I've determined that the reason for the problem with the inline datepicker is that the library never sets the value of the input field created by BootsFaces. In the example on https://eonasdan.github.io/bootstrap-datetimepicker/, there is actually no input field at all, hidden or otherwise. Javascript may be required to set the value properly

Edit: I was able to solve the problem with this javascript:

ondtchange="javascript:$('#searchByTimeForm\\:startTimePicker_Input').val(event.date.format('MM/DD/YYYY h:mm a'));ajax:true"

on <b:dateTimePicker id="startTimePicker" ... />

So, the best solution would be to create similar javascript automatically... I will give it a go.

Edit: oops, you guys are ahead of me a bit. I just found this code:

if("inline".equals(mode)) {
    rw.writeText("$('" + fullSelector + "').on('dp.change', function(e) { " +
                 "   $('#" + BsfUtils.escapeJQuerySpecialCharsInSelector(clientId) + "').val( e.date.format(" + displayFormat + ") ); " +
                 "});", null);

But obviously it isn't working. I will try to fix it.

Edit: Easy fix: the id of the input field was not correct.
$('#" + BsfUtils.escapeJQuerySpecialCharsInSelector(clientId) + "') should have been $('#" + BsfUtils.escapeJQuerySpecialCharsInSelector(clientId + "_Input") + "')

See the PR below.

@TheCoder4eu
Copy link
Owner

@MitchTalmadge thanks for your PR!

@TheCoder4eu
Copy link
Owner

@stephanrauh , I guess the PR solved the Issue? Or there was something left?

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

No branches or pull requests

4 participants