datepicker not working with jQuery dialog box - javascript

I have datattable of user data, and each row contain edit button to open edit form. I'm open it using jQuery dialog box and submit for using ajax submit, but when loading form datepickers it is not working.
How can I fix this?

You are inverting name and id attributes.
When you use:
$("#activation_on").datepicker(...
jQuery selects the element with id= activation_on because # is the id selector. But your element's id is id="activation_on1".
The same happens on your valid_to field.
You can change their ids or change the jquery to:
$("#activation_on1").datepicker(...
and
$("#valid_to1").datepicker(...
Take a look at a working example on JSFiddle: https://jsfiddle.net/dudu84/42yoLLgg/2/

Related

JQuery Selectors: How do I select the submit button of the second form on a webpage?

How do I select the submit button of the second form on a webpage?
Am I able to able to submit said form by using the .click() function on the selected submit element?
This is the script I am using in attempt to do so currently:
function Ellipsis_Mouse_Click()
{
$("form:eq(1):submit:eq(0)").trigger('click');
}
To select the second form:
$('form').eq(1);
// Or
$('form:eq(1)');
.eq() works from a zero-based index, hence using .eq(1) instead of .eq(2).
This isn't a particularly good way of selecting the form as it's vulnerable to any DOM changes (whether made manually or with more JS). Consider adding a class or ID to the form, or select it relative to a container that has a class or ID.
To submit the form:
$('form').eq(1).submit();
You don't need to find the submit button and trigger a click on that. Instead, you can just call .submit() on the form itself.

Validate form on the tab which is not selected

I use jQuery form validation plugin. I have got a webpage with "save" button and tabs. there is a form in one tab. Here is code for "save" button.
$("#save").click(function(){
$("#optionalform").valid();
});
It validates form if the tab with "#optionalform" selected. If it is not selected validation doesn`t work.
What you need to do is specify that hidden elements should not be ignored:
$("#optionalform").validate({
ignore:''
});
The default for the ignore option is ':hidden' which includes all the elements of your form, except when that tab is visible.
See it in action here: http://jsfiddle.net/ryleyb/NfmWW/

Hide the submit button if there's no generated input fields with jQuery

I would like to hide my submit button if there's not input fields in a div (maybe with a specific id for the inputs and check if there are present or not?)
Because I generate some inputs fields by pressing some buttons I have a "Save fields" button which need to appear only if you generated some fields.
I would like to trick this with jQuery, any idea?
You can easily do this. Fosco has a great suggestion of making the submit button hidden by default, and only showing it if the number of <input> elements is > 0
Furthermore, use the .size() or length() function to get the number of elements of a particular type, or class. If that value is 0, then use .hide() on the submit button to hide it, and .show() if it's > 0.
if(!$("#form input").length > 0) $("#sumbit").hide();
Quite simple!

Unselect a Select Input

I have a "select" input that is programmed to open up a modal box when clicked to get some information before proceeding. That part all works great.
The problem is that once the modal box is up, the select dropdown options are all still visible. I want that select input to go back to being a normal, not clicked on at all, select box.
What javascript or jquery code can I use to make that select dropdown clear away?
I think it is more correct to move handler from click to change. In this case select will be close and keyboard changes also will be processed
Try using this instead:
$('#mySelect').focus(function(event){
event.preventDefault();
// code here
});
If that does't work, try using the preventDefault() with the click event.
The focus will at least allows users navigating fields with the keyboard (tab, etc) instead of the mouse.
Prior to jQuery 1.6
$('#mySelectBox :selected').attr('selected', '');
jQuery 1.6 and higher
$('#mySelectBox :selected').removeProp('selected', '');
I'm not sure that you can do it with standard select tag. Maybe because it still has focus. What I did when I needed a customized select tag is to avoid the select tag completely and use a button which graphically looks like the select button. Look at this page - look at the TAX button and the button to the left of it. There is no select tag, but it works great.

Jquery button label option does not work with input type checkbox

Demoed here: http://jsfiddle.net/dRtaR/2/
The label option of the Jquery UI button does not work.
My goal is to have a label on the button WITHOUT having to specify a </label> html tag.
Can I do this?
Not with this jQueryUI method. From the .button() overview tab:
In addition to basic push buttons, radio buttons and checkboxes (inputs of type radio and checkbox) can be converted to buttons: Their associated label is styled to appear as the button, while the underlying input is updated on click.
When you specify button on a checkbox or radio button it hides the input and styles the associated label.
Is there any reason you can't just write out the label? If you don't have access to the html you could write it out with jQuery. See this horrible example. It might give you an idea of where to look next.

Categories