Not sure why this isn't working.
When people click the 'edit' button of my application, the disabled textfields become editable:
$("#bewerken").click(function(e) {
$("input[disabled='disabled']").removeAttr('disabled');
});
I then want to disable the textfields again when the user saves; I have this code bound to my save button:
$("#save_school_changes").click(function(e) {
//stuff
$.ajax({
type: "POST",
url: "/school/save_changes",
data: { //stuff },
success: function(data)
{
$("#feedback_top").html("<p>" + data['message'] + "</p>").slideDown('slow').delay(2000).slideUp();
$("input[type='text']").attr('disabled', 'disabled');
}
});
e.preventDefault();
});
As far as I know, this should disable the textfields again. However, this does not seem to be working in Chrome. It does work in Firefox. I haven't had the chance to test in IE or Safari yet. Is there any way to make this work in Chrome aswell? Thanks a lot!
If you are using jQuery < 1.6 do this:
jQuery("input[type='text']").attr("disabled", 'disabled');
If you are using jQuery 1.6+:
jQuery("input[type='text']").prop("disabled", true);
See this question: .prop() vs .attr() for references why.
Or you can try this:
$('input:text').attr("disabled", 'disabled');