I have statement $("#myDiv").attr("disabled","disabled");
I thought that once I disable "parent" container, all elements inside of this become disabled. What I see actually, that text-box looks like disabled and "delete" not works within, but I can type there. check-box that inside of the same div, really looks disabled and I can't check/uncheck it. I'm not sure for 100%, but I think that I already used disabling that way and it worked as I expected (text-box not typeble). So I want to know if I need explicitly set disabled for textboxes or maybe some other CSS breaks what I'm expecting.
UPDATE:
I know how to set disable explicitly for elements that i need, I just not want tot do it and what I'm asking that if it the only way to disable it, or textbox may work exactly as checkbox (without explicitly disabling it) and just some CSS breaks this behavior.
As far as im aware doing that is not cross browser friendly nor valid markup. Best option would be to do something like
$('#myDiv').find('input,textarea,select').attr("disabled", true);
That should find all form elements within the div and apply teh disabled flag directly
Edit: or even just
$('input,textarea,select', '#myDiv').attr("disabled", true);
You can use the :input selector:
$("#myDiv :input").attr("disabled", true);
Related
I have a javascript function Display(args...) that modifies the content of a modal window depending on which button is pressed. The function contains other attributes that are hidden or displayed (depending on the arguments that are being passed). Where I am going crazy is that a particular div section refuses to hide/display. Let's say that initially I set it up to be hidden/display:none, then onClick is suppose to be display it; even if I invert the initial state the expected behavior does not occur. I set up the debugger and I see that is trying:
if ($('#SectionRefusingToShow').is(":visible") == false) {
$('#SectionRefusingToShow').show();
}
I see it enters the if statement but still not shown. Inspecting the DOM, its element attribute display:none was not removed. For other classes and ids the hidden are properly removed/added. I am using .show for this one given that hidden state for it did not work either!
I have had a similar problem before, and it turned out that I had multiple elements with the same ID value. Have you checked for that? jQuery can get a little fussy when you select elements by ID, and the ID is not unique (which is technically invalid, so it get's fussy for a good reason).
I am looking to use jQuery's "disableSelection()" function because I have a lot of drag and drop on the pages but I do not want to disable selection on input boxes, just everything else.
I have tried
$('body').disableSelection(); $('input').enableSelection();
$('body').not('input').disableSelection();
still DISABLES EVERYTHING ON THE PAGE. Thank you.
With
$('body').not('input').disableSelection();
You disable selection on every instance of body that is not an input. Since body is not an input this will just disable selection on body.
Try this:
$('body *').not(':has(input)').not('input').disableSelection();
However, like other people pointed out it's probably pretty useless disabling selection on things that aren't draggable in the first place. So maybe you should replace body with .drag or however you can select all the objects that are draggable (keeping the rest of the function the same).
I dont think so disableSelection will work for input textboxes. It's useful for making text elements, or elements that contain text, not text-selectable. For example, if you have a draggable element, you may not want text selection to occur when the user goes to drag the element.
I am trying to manually set a radio button to checked, but there is a problem. The code works just fine:
$('#'+align+'Text').attr("checked","checked");
But when I put jQuery UI into practice and make the radios a buttonset, everything breaks. Again, everything works fine until I put in the .buttonset(), then they look much better than normal radios, but the setting above does not work at all.
EMPHASIS ON THE FOLLOWING:
Has anyone been able to manually set a radio button while .buttonset() is active on those radios?
All you need to do is call the "refresh" operation on the button widget after setting the "checked" attribute.
$('#'+align+'Text').attr("checked","checked").button('refresh');
Here's the jsfiddle.
Note that setting the "checked" property can (and, some would say, should) be set with the .prop() function:
$('#' + align + 'Text').prop('checked', true).button('refresh');
I need to hide a text input field with javascript. Changing its type attribute to hidden does not work in IE (security issue).
What would be the best way to do it?
Note: No jQuery or other lib can be assumed.
I assume you have to show and hide the text field dynamically based on changing conditions in the form, otherwise you'd just make it an <input type="hidden"... to begin with.
Keep your code that shows and hides the field as it is, but also catch the onsubmit event.
In the submit handler, get your text field via document.getElementById(...) (or by accessing document.forms[i]) and check to see whether or not it's hidden.
If it is hidden, create a new DOM node for an <input type="hidden" ...> field and add that node to the form, probably via myform.appendChild(...). You'll have to give it the name your server-side code expects. Copy the contents of the hidden text field into the newly created type=hidden field, then return from your submit handler, allowing the standard submit to continue.
You could also just un-hide the text field on submit, but you'd have to move it "off screen" also or the user would see it reappear during submit processing.
Try wrapping it in a div or span and then setting the display style to none when you want to hide it, and then to block (if you used a div) or inline (if you used a span) when you want to show it.
document.myform.myelement.style.display = 'none'
works as expected even in Internet Explorer.
The only way you can change it is before you append it to the DOM. You can make a new element and then replace the current one with it.
Look at replaceChild and createElement since you want to do manual DOM scripting. I assume you know what to do.
EDIT: "Hidden" fields as far as I know are sent. Have you checked whether they are? And you can also just do position:absolute; left:-9999em; to offset them.
I had a requirement where I need to clear off the "select all" checkbox in case user manually deselects any of the data rows.
This has been accomplished by detecting this during an onRowSelect (jqgrid event) event.
The code snippet is as below and works as expected.
onSelectRow: function(){$("input:checkbox[id='cb_jqg']").removeAttr('checked');}
The thing I wonder about is whether I should check the checkbox for already selected before I clear it off or can I simply clear it (as it does not have any impact) as done above.
Is there any performance / code ethic issues with the syntax I used?
Adding a check before setting the value will be slower than just arbitrarily setting them all simply because it has to do the check.
Ethically, it's not gonna throw an error, so all's fair in love and coding, right?
This looks like you have multiple checkboxes with the same id. This is invalid in HTML. You could instead use the same name for these checkboxes.
Also, the more standard way of setting the checkedness of a checkbox is simply setting the checked property of the checkbox element to true or false, rather than rely on jQuery's attribute handling methods.