open a form onclick radio button ?

Reply

Join Date: Jan 2009
Posts: 9
Reputation: MSK 7 is an unknown quantity at this point 
Solved Threads: 0
MSK 7 MSK 7 is offline Offline
Newbie Poster

open a form onclick radio button ?

 
0
  #1
Feb 3rd, 2009
Hi , to all

I want your help :-

How i can open a new file (may be called as "form1.php" ) on my current page , only by onclick of radio buttons
without using submit button ?


any suggessions will be appreciated.

Thanks & Regards.
Reply With Quote Quick reply to this message  
Join Date: Jan 2007
Posts: 17
Reputation: jeet_portal is an unknown quantity at this point 
Solved Threads: 0
jeet_portal jeet_portal is offline Offline
Newbie Poster

Re: open a form onclick radio button ?

 
0
  #2
Feb 3rd, 2009
for radio button
  1. <td><input type="radio" name="cardtype" value="s" rel="none" checked />
  2. Single Side &nbsp;&nbsp;&nbsp;<input type="radio" name="cardtype" value="b" rel="card" />
  3. Both Side</td>

this will be the js file for the radio buttons

  1. var containerTag = 'TR';
  2.  
  3. var compatible = (
  4. document.getElementById && document.getElementsByTagName && document.createElement
  5. &&
  6. !(navigator.userAgent.indexOf('MSIE 10') != -1 && navigator.userAgent.indexOf('Mac') != -1)
  7. );
  8.  
  9. if (compatible)
  10. {
  11. document.write('<style>.accessibility{display: none}</style>');
  12. var waitingRoom = document.createElement('div');
  13. }
  14.  
  15. var hiddenFormFieldsPointers = new Object();
  16.  
  17. function prepareForm()
  18. {
  19. if (!compatible) return;
  20. var marker = document.createElement(containerTag);
  21. marker.style.display = 'none';
  22.  
  23. var x = document.getElementsByTagName('select');
  24. for (var i=0;i<x.length;i++)
  25. addEvent(x[i],'change',showHideFields)
  26.  
  27. var x = document.getElementsByTagName(containerTag);
  28. var hiddenFields = new Array;
  29. for (var i=0;i<x.length;i++)
  30. {
  31. if (x[i].getAttribute('rel'))
  32. {
  33. var y = getAllFormFields(x[i]);
  34. x[i].nestedRels = new Array();
  35. for (var j=0;j<y.length;j++)
  36. {
  37. var rel = y[j].getAttribute('rel');
  38. if (!rel || rel == 'none') continue;
  39. x[i].nestedRels.push(rel);
  40. }
  41. if (!x[i].nestedRels.length) x[i].nestedRels = null;
  42. hiddenFields.push(x[i]);
  43. }
  44. }
  45.  
  46. while (hiddenFields.length)
  47. {
  48. var rel = hiddenFields[0].getAttribute('rel');
  49. if (!hiddenFormFieldsPointers[rel])
  50. hiddenFormFieldsPointers[rel] = new Array();
  51. var relIndex = hiddenFormFieldsPointers[rel].length;
  52. hiddenFormFieldsPointers[rel][relIndex] = hiddenFields[0];
  53. var newMarker = marker.cloneNode(true);
  54. newMarker.id = rel + relIndex;
  55. hiddenFields[0].parentNode.replaceChild(newMarker,hiddenFields[0]);
  56. waitingRoom.appendChild(hiddenFields.shift());
  57. }
  58.  
  59. setDefaults();
  60. addEvent(document,'click',showHideFields);
  61. }
  62.  
  63. function setDefaults()
  64. {
  65. var y = document.getElementsByTagName('input');
  66. for (var i=0;i<y.length;i++)
  67. {
  68. if (y[i].checked && y[i].getAttribute('rel'))
  69. intoMainForm(y[i].getAttribute('rel'))
  70. }
  71.  
  72. var z = document.getElementsByTagName('select');
  73. for (var i=0;i<z.length;i++)
  74. {
  75. if (z[i].options[z[i].selectedIndex].getAttribute('rel'))
  76. intoMainForm(z[i].options[z[i].selectedIndex].getAttribute('rel'))
  77. }
  78.  
  79. }
  80.  
  81. function showHideFields(e)
  82. {
  83. if (!e) var e = window.event;
  84. var tg = e.target || e.srcElement;
  85.  
  86.  
  87. var fieldsToBeInserted = tg.getAttribute('rel');
  88.  
  89.  
  90. if (tg.type == 'radio')
  91. {
  92. removeOthers(tg.form[tg.name],fieldsToBeInserted)
  93. intoMainForm(fieldsToBeInserted);
  94. }
  95. else if (tg.type == 'select-one')
  96. {
  97. fieldsToBeInserted = tg.options[tg.selectedIndex].getAttribute('rel');
  98. removeOthers(tg.options,fieldsToBeInserted);
  99. intoMainForm(fieldsToBeInserted);
  100. }
  101. }
  102.  
  103. function removeOthers(others,fieldsToBeInserted)
  104. {
  105. for (var i=0;i<others.length;i++)
  106. {
  107. var show = others[i].getAttribute('rel');
  108. if (show == fieldsToBeInserted) continue;
  109. intoWaitingRoom(show);
  110. }
  111. }
  112.  
  113. function intoWaitingRoom(relation)
  114. {
  115. if (relation == 'none') return;
  116. var Elements = hiddenFormFieldsPointers[relation];
  117. for (var i=0;i<Elements.length;i++)
  118. {
  119. waitingRoom.appendChild(Elements[i]);
  120. if (Elements[i].nestedRels)
  121. for (var j=0;j<Elements[i].nestedRels.length;j++)
  122. intoWaitingRoom(Elements[i].nestedRels[j]);
  123. }
  124. }
  125.  
  126. function intoMainForm(relation)
  127. {
  128. if (relation == 'none') return;
  129. var Elements = hiddenFormFieldsPointers[relation];
  130. for (var i=0;i<Elements.length;i++)
  131. {
  132. var insertPoint = document.getElementById(relation+i);
  133. insertPoint.parentNode.insertBefore(Elements[i],insertPoint);
  134. if (Elements[i].nestedRels)
  135. {
  136. var fields = getAllFormFields(Elements[i]);
  137. for (var j=0;j<fields.length;j++)
  138. {
  139. if (!fields[j].getAttribute('rel')) continue;
  140. if (fields[j].checked || fields[j].selected)
  141. intoMainForm(fields[j].getAttribute('rel'));
  142. }
  143. }
  144. }
  145. }
  146.  
  147. function getAllFormFields(node)
  148. {
  149. var allFormFields = new Array;
  150. var x = node.getElementsByTagName('input');
  151. for (var i=0;i<x.length;i++)
  152. allFormFields.push(x[i]);
  153. var y = node.getElementsByTagName('option');
  154. for (var i=0;i<y.length;i++)
  155. allFormFields.push(y[i]);
  156. return allFormFields;
  157. }
  158.  
  159. /** ULTRA-SIMPLE EVENT ADDING **/
  160.  
  161. function addEvent(obj,type,fn)
  162. {
  163. if (obj.addEventListener)
  164. obj.addEventListener(type,fn,false);
  165. else if (obj.attachEvent)
  166. obj.attachEvent("on"+type,fn);
  167. }
  168.  
  169. addEvent(window,"load",prepareForm);
  170.  
  171.  
  172. /** PUSH AND SHIFT FOR IE5 **/
  173.  
  174. function Array_push() {
  175. var A_p = 0
  176. for (A_p = 0; A_p < arguments.length; A_p++) {
  177. this[this.length] = arguments[A_p]
  178. }
  179. return this.length
  180. }
  181.  
  182. if (typeof Array.prototype.push == "undefined") {
  183. Array.prototype.push = Array_push
  184. }
  185.  
  186. function Array_shift() {
  187. var A_s = 0
  188. var response = this[0]
  189. for (A_s =0; A_s < this.length-1; A_s++) {
  190. this[A_s] = this[A_s +1]
  191. }
  192. this.length--
  193. return response
  194. }
  195.  
  196. if (typeof Array.prototype.shift == "undefined") {
  197. Array.prototype.shift = Array_shift
  198. }



Enjoy...........
Reply With Quote Quick reply to this message  
Join Date: Oct 2006
Posts: 1,067
Reputation: ardav will become famous soon enough ardav will become famous soon enough 
Solved Threads: 137
ardav's Avatar
ardav ardav is offline Offline
Veteran Poster

Re: open a form onclick radio button ?

 
0
  #3
Feb 3rd, 2009
That's a lot of code! What about having hidden sections and displaying them/hiding them with the onlick event? It's not as slick or as professional as the last post, but it's a lot quicker.

The documents are 'loaded' before the page is displayed. Only one file will be displayed at a time. Notice the first file is shown by default and the first radio button is checked.

  1. (...)
  2. <input id="first" name="first" onclick="document.getElementById('firstfile').style.display='block'; document.getElementById('secondfile').style.display='none';return false;" checked="checked" />
  3. <input id="second" name="second" onclick="document.getElementById('secondfile').style.display='block'; document.getElementById('firstfile').style.display='none';return false;" />
  4. (...)
  5. <div id="firstfile" style="display:block;">
  6. <?php include('includes/myfirstfile.php"); ?>
  7. </div>
  8.  
  9. <div id="secondfile" style="display:none;">
  10. <?php include('includes/mysecondfile.php"); ?>
  11. </div>
  12.  
Happy Humbugging Christmas
Reply With Quote Quick reply to this message  
Reply

This thread is more than three months old.
Perhaps start a new thread instead?
Message:


Thread Tools Search this Thread



Tag cloud for PHP
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC