Clearing jQueryMobile DateBox value from an event - jquery-mobile

I have 2 DateBox (from & to). What I want to do is whenever I click on the "from" DateBox it will always clear the "to" DateBox.
I'm looking at the doclear method and I'm not sure if it is the right one or even know how to use it.
Just to be clear I'm using this.
Any help would be appreciated. Thanks!

In my testing setting the value of the box to an empty string ('') works.
Assuming id of fromDate and toDateon the two boxes the following code should do the trick:
$('#fromDate').click(function(){
$('#toDate').val('');
}

Related

How to select an item in MVCxGridLookup in jQuery, when page loads

I get a value in a model, but how do I set that value as the selected value in an MVCxGridLookup control in jQuery? I am able to set it in PreRender() method for the control. But now I need to do it in jQuery.
Thanks.
I've found a solution !
$("#DropdownList").val('#Model.Name'); -->this is wrong.
This^ was what I was doing before, but it wont work. 'DropdownList' was the name I gave for the GridLookup control, but the id will vary from this, because this is a DevExpress control.
When we inspect the page elements (using developer tools or just right click and inspect element), the actual id it was assigned can be found.
$("#DropdownList_I").val('#Model.Name'); -->this solved the problem.

Validation of date input into textbox when using JQueryUI Datepicker

I have a textbox that I've attached the datepicker to. If the user enters the date via the datepicker all is well but they also have the ability to go in and enter a bad date directly into the textbox. i.e. 1/55/1995
Can the text box be disabled so only the calendar can be used?
How are people preventing this?
Looks like what you need is to just disable the field or make it readonly. Check out this answer How can I disable all keyboard keys?
I would say readonly is the better option because it still allows the value to be retrieved when it is posted back; don't think disabled fields get picked up.
You can validate the input text, if entered manually to the textbox.
Have a look at the url below,
http://keith-wood.name/uiDatepickerValidation.html
Hope this helps.
Cheers

Datepicker returning uncaught typeError: undefined 'currentDay'

I've been using jQuery UI with Bootstrap and I seem to run into a problem that I haven't had before. I'm not sure what has changed; I've tried setting back different version of jQuery and I didn't update the jQuery UI in the meanwhile. So I'm not exactly sure what broke.
The error from the console when I click on any date in the datepicker returns:
Uncaught TypeError: Cannot set property 'currentDay' of undefined
The code is fairly straightforward as one would expect from a datepicker:
$(".datepicker").datepicker({
dateFormat: 'dd-mm-yy'
});
With the following HTML:
<input type="text" class="datepicker" />
Is this a bug that should be reported (since no other Google matches turn up) or is it something else I've missed?
I've found the solution. After a long time of debugging I figured out that there was a <div> that had the exact same ID, lying higher than the input field. Therefore the script took the first instance that contained the ID and picked the DIV instead of the input field.
I removed/renamed the DIV and it worked fine again.
The above jQuery datepicker error is generally caused by having a duplicate controls with the same ID, no matter whether you use id or another selector like css class or field name to instantiate it.
I solved this with create new ID for HTML DOM object. There is duplicated Id.
Try to add new ID for HTML DOM object.
I was having this error also. I found that elsewhere on the form I had some label 'for' attributes that did not match ids on the form inputs - seems like this might confuse datepicker too. Once I fixed those up, everything worked fine and the error went away. Take Andreas' advice (+1 for that!) and validate your forms - Chris Pederick's Web Developer Toolbar gives you an easy way to validate as you go.
put a selector.
<script> $("#formID #duplicatedId").datepicker({language: 'he'});
</script>
FormID: Id of the form that contains input.
duplicatedId: input element's Id.
In my case I was triggering the datepicker from a div against a hidden input field and getPos(a) was causing an undefined message on the variable "a". I experimented with moving the hidden input field outside of a div and that did the trick. Note that the input field was findable by jQuery no matter where it was, so that was not the problem - it was with positioning. Hope this helps someone else.
Might be two input box having same class without different id and for that you are trying for date picker. If it is there give two different id it will work.
I've ran into this problem too, and i was 100% sure i did not use duplicate id.
After some debugging i found out a reason - i was using DataTables mod, which duplicates contents of tfoot, thus creating exact copy of datepicker elements. And i had this datepicker inputs in tfoot row.
Fixed that issue with:
table.find("TFOOT").find("TR:first").remove();
Which is called AFTER table.DataTable(....)
This removed original, zero height row with all contents;

How do I remove the tooltip in Grails 2.0.4?

Does anybody know how to remove the tooltip in Grails 2.0.4? Currently all my mandatory fields shows a tooltip. I am trying to create a UI without the tooltip. I am using jQuery and jQueryUI.
Is there anyway that I could remove the tooltip? I think the tooltip is set by default in Grails 2.0.4.
Thanks.
you could use jQuery to remove the title attribute like so...
$(document).ready(function() {
$('[title]').removeAttr('title');
});
I think this is html 5 related. Do the fields have "required" in the tags (which I know grails puts in by default when performing scaffolding)? If so, the browser will check that those fields are filled in and prompt the user if they are not before submission. This was driving me bonkers trying to figure out what was going on.

How do I clear the JQuery Mobile list search filter?

I have a JQuery Mobile (1.0rc1) application that has a list view with a search filter implemented. It's similar to this sample.
Under certain conditions, I am dynamically loading additional items into the list with an ajax call. When this happens I want to clear anything entered in the search filter, otherwise I end up with a partially filtered list.
I've tried firing the clear button like this:
$('.ui-button-clear', $.mobile.activePage).click();
and clearing the form like this:
$("form > input", $.mobile.activePage).val('');
but neither worked. Can someone enlighten me to the proper way to accomplish this?
You should be able to clear clear the searchfilter with
$('input[data-type="search"]').val("");
Edit: To update the list you will also have to trigger the "change"-event on the searchfilter:
$('input[data-type="search"]').trigger("keyup");
JSFiddle
if you talking about Jquery mobile listview, then you need this
$('#autocomplete li').click(function () {
$('.ui-input-clear').trigger("click");
});
I use the following code:
$("form")[0].reset();
The [0] points to the DOM element method.
Also see How to reset (clear) form through JavaScript?

Resources