Printable Form Inputs

On January 19, 2010, In Development, By Brant Messenger

In recent days I’ve been working on the ability to print forms. For the sake of KISS principle I used the same form, for printing, that was used for data entry. I figured that the CSS would handle the look and feel. And for security I would use jQuery to disable the fields. Everything worked great as long as you don’t use Microsoft Internet Explorer. It seems that CSS in IE will not allow you to style a disabled form element. Here is a simple fix using jQuery to handle this. You may modify as needed. Let me know what you think and post back new modifications.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

securePrintInput = function() {
 
	$(":input").each(function(){
		if ($(this).val() == "" || ($(this).context.type == "checkbox" && $(this).attr("checked") == false)) {
			$(this).attr("disabled","disabled");
		}
		else {
			if ($(this).context.type == "text") {
				$(this).keydown(function(){
					return false;
				});
			}
			else if ($(this).context.type == "checkbox") {
				$(this).click(function(){
					$(this).attr("checked","checked");
				})
			}
			else if ($(this).context.type == "select-one") {
				$(this).keydown(function(){
					return false;
				});
				$(this).find("option").each(function(){
					if ($(this).attr("selected") == false) $j(this).remove();
				});
 
			}
		}
	});
}

Tagged with: • • • •
 
0 Comments
Leave A Response

Fix IE Select Width using jQuery

On October 16, 2009, In Development, By Brant Messenger

It seems like every time you need something to work IE (MS Internet Explorer) really messes things up. So, I thought I’d publish this workaround.

1
2
3
4
5
6
7

fixIESelectWidth = function(obj) {
	if (!isFireFox()) {
		var w = $(obj).width();
		w = w + 5;
		$(obj).width(w);
	}
}

Tagged with: • • •
 
0 Comments
Leave A Response

IE select option disabled fix using jquery

On October 15, 2009, In Development, By Brant Messenger

I spent a good couple hours fighting with IE and finally found a solution to fix the disabled option issue. Hope it helps you out.

1
2
3
4
5
6
7
8
9
10
11
12
13

ieLessThan8OptionDisable = function() {
    if ($.browser.msie && parseFloat($.browser.version) < 8) {
        $("select").find("[disabled]").addClass("disabled").removeAttr("disabled");
        $("select").change(function(){
            var selected = $(this).val();
            var disabled = $(this).find("[value="+selected+"]").hasClass("disabled");
            if (disabled) {
                alert("This option is disabled.\nSelect will be set to the first option.");
                $(this).find("option:first").attr("selected","selected");
            }
        });
    }
}

Tagged with: • • • • •
 
1 Comments
Leave A Response
Go To Top »