Hi, I am using validatious-custom-0.9.1.js framework in my project and I am trying to validate required fields for radio buttons. But it is not validating the radio buttons in IE8. I am getting the following error in console Message: 'tagName' is null or not an object Line: 7 Char: 9921 Code: 0 URI: http://validatious.org/design/js/val....js?1256063644 HTML code used. <div> <label for="_button_880">Radio List <div> <p>some text</p> </div> </label> <div> <ul> <li> <div> <div> <input type="radio" name="radio1" id="radio1" value="Radio1" class="required" title="Required."/> <label for="radio1">Radio1</label> </div> </div> </div> </div> JS where it is failing - First 2 are the examples that are given in the framework file. So you will get to know how it is implemented /* A radio button field is assumed to be either a list - ordered or unordered - with some element in front that acts as a label. This may be any element. If it is not in a list (ie the element does not have "li" parent elements), the label is assumed to be the element before the first input element. Example1 (list approach): <h2>Favourite food/h2> <ul> <li> <input type="radio" name="food" value="hamburger" id="food_hamburger" /> <label for="food_hamburger">Haburger</label> </li> <li> <input type="radio" name="food" value="pizza" id="food_pizza" /> <label for="food_pizza">Pizza</label> </li> </ul> getLabel() will in this case return the h2 element. Example2 (no list). <label class="groupLabel">Favourite food/label> <input type="radio" name="food" value="hamburger" id="food_hamburger" /> <label for="food_hamburger">Hamburger</label> <input type="radio" name="food" value="pizza" id="food_pizza" /> <label for="food_pizza">Pizza</label> getLabel() will in this case return the first label element */ Actual code getLabel: function() { var parent = this.__elements[0].parentNode; //alert(parent1.nodeName); --- Gives 'nodeName' is null or not an object IN Ie8 if (parent1.tagName.toLowerCase() === 'li') { ---Gives 'tagName' is null or not an object return v2.$(parent1.parentNode).previous(); } var element = v2.$(this.__elements[0]).previous(); return element || this.base(); } Required field validation in the js file v.reg('required', function(field, value, params) { return !v2.empty(value) && !(typeof value.length !== 'undefined' && value.length == 0); }, null, null, 'not-empty', false); It works fine in firefox, IE7 and IE9. But in Ie8, I get message tagName is null or not an object. Can somebody please help me why its is giving error in IE8 Thanks in advance.
Well, first thing I'd suggest is using VALID and/or semantic markup -- as well as obeying the block-level vs. inline-level rules even if the HTML5-tards say you don't have to anymore (which is BS since it doesn't even work right in FF, much less IE). You have DIV and P inside a label on your first text, and that's just gibberish... What the devil even makes that a grammatical paragraph? Some of your labels have no corresponding input, and appear that they should be LEGEND inside FIELDSET, since FIELDSET is the appropriate group wrapper for a group of radio buttons... Which would give you a convenient/proper hook for the input... and no matter what the inept re-re's say, a set of form elements has ALL the semantics you need, so things like LISTS have no malfing business inside them! (just as putting a input/label pair inside a paragraph or table element is gibberish nonsenese) ... and that's just the markup. For the life of me I can't figure out what you're trying to do for checks on radio buttons, since one must ALWAYS be selected so there is never an invalid value client-side... You seem to be processing your form elements nyetscape 4 style, you seem to have one bit of jquery garbage in there for no fathomable reason... I'm really stuck asking what the devil are you even trying to do here? The PROPER markup for a radio button set would be: <fieldset> <legend><span>Favourite food</span></legend> <input type="radio" name="food" value="hamburger" id="food_hamburger" /> <label for="food_hamburger">Haburger</label> <br /> <input type="radio" name="food" value="pizza" id="food_pizza" /> <label for="food_pizza">Pizza</label> </fieldset> Code (markup): The span being there to compensate for LEGEND not accepting style consistently cross browser... sucks but whaddayagonnadoaboutit. In terms of scripted 'checks' there are only two options, what's to check? Side note... the typo made me laugh. The dead man's name was Charles Haburger. Oh, I remember him... but are the memories mine, or hers? It makes no difference... he deserved to die. They all deserve to die.