SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Oct 2008
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    targeting dynamic form elements

    I am attempting to target form elements (radio buttons) whose names are generated dynamically by php. As far as I can tell, the problem is in targeting the radio buttons with the following code...

    HTML Code:
    // name = "os1"
    // i = an incremented integer starting at 0
    if (document.paypal_form.name[i].disabled==true)
    See full code below...

    HTML Code:
    function enableRadioButtons(name) {
    	var osVarNum = parseInt(name.replace("os", ""));	// "os0" becomes 0
    	osVarNum = ++osVarNum;	// 0 becomes 1
    	name = "os" + osVarNum;	// name becomes os1
    	for (i=0;i<document.paypal_form.name.length;i++) {
    		if (document.paypal_form.name[i].disabled==true) {	// IF RADIO BUTTONS ARE DISABLED
    			document.paypal_form.name[0].disabled=false;document.paypal_form.name[0].checked=true;	// SET FIRST BUTTON TO CHECKED
    			for (ii=1;ii<document.paypal_form.name.length;ii++) {
    				document.paypal_form.name[i].disabled=false;document.paypal_form.name[1].checked=false;	// SET ALL OTHER BUTTONS TO UNCHECKED
    			}
    		}
    	}
    }
    HTML Code:
    <form id="form1" method="post" action="" name="paypal_form">
    	<input name="os0" id="Front_1_1" type="text" onChange="enableRadioButtons(this.name)" />
    	<p>
    		<label>
    			<input type="radio" name="os1" id="Front_1_3" value="radio1" disabled />
    			radio1</label>
    		<label>
    			<input type="radio" name="os1" id="Front_1_4" value="radio2" disabled />
    			radio2</label>
    		<label>
    			<input type="radio" name="os1" id="Front_1_5" value="radio2" disabled />
    			radio2</label>
    		<label>
    			<input type="radio" name="os1" id="Front_1_6" value="radio2" disabled />
    			radio2</label>
    		<label>
    			<input type="radio" name="os1" id="Front_1_7" value="radio2" disabled />
    			radio2</label>
    	</p>
    	<p>
    		<label>submit
    		<input type="submit" name="submit" id="submit" value="Submit" />
    		</label>
    </p>
    </form>
    Any ideas? thanks.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    You can access them using array subscript notation instead.

    Code javascript:
    //document.paypal_form.name[0].disabled=false;
    document.paypal_form[name][0].disabled=false;
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    Oct 2008
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul. I will give that a try.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •