Conflicts Help - MooTools - Joomla

Conflicts Help - MooTools - Joomla

Hi guys,
I am really hoping you can help me here. Ive been staring at this code for 2 days and asking alot of people!

I had a guy do some JS/JQ code for me. However, he has gone on holiday for a month and i need to get this website handed over to the customer ASAP.

Its a site running on Joomla. 
The code he wrote was for a contact form.

I am having some issues. I have never done any JS/JQ before, i have only just started picking a few things up when trying to sort this out.


Basically, the form works fine if it is in a seperate file completely and not inside Joomla.

I think it is a conflict with some Joomla files.
Here is the link to the website is it on.
The orange form on the right:


Here is the code:

  1. {source}
  2. <!DOCTYPE HTML>
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>

  6. <meta charset="utf-8" />

  8. <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
  9. <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
  10. <link rel="stylesheet" href="rppalmer12/style.css">


  13. <script type="text/javascript">
  14. //$.noConflict();
  15. $(document).ready(function() {

  17. function isInt(n) {
  18. return typeof n === 'number' && n % 1 == 0;
  19. }

  21. // Form validation
  22. $(".darkBtn").click(function(e) {
  23. e.preventDefault();
  24. var email_check = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i;
  25. var email = $("form.form_contact .email").val();

  27. var zipCheck = /[A-Z]{1,2}[0-9R][0-9A-Z]? [0-9][ABD-HJLNP-UW-Z]{2}/i;
  28. var zip = $("form.form_contact .zipcode").val();

  30. var phoneCheck = /^\d+$/;
  31. var phone = $("form.form_contact .phone").val();

  33. var error = "";

  35. if(!email_check.test(email))
  36. {
  37. error = "Please give a valid email address.";
  38. }

  40. if(!zipCheck.test(zip))
  41. {
  42. error = "Please give a valid postcode.";
  43. }

  45. if(!phoneCheck.test(phone) || phone.length != 11)
  46. {
  47. error = "Please give a valid phone number.";
  48. }

  50. // Check if all is filled
  51. if($(".gender").val() == 0 || $(".title").val() == 0 || $(".fname").val() == "" || $(".sname").val() == "" || $(".phone").val() == "" || $(".email").val() == "" || $(".zipcode").val() == "" || $(".dday").val() == 0 || $(".dmonth").val() == 0 || $(".dyear").val() == 0 || $(".insurance").val() == 0 || $(".sday").val() == 0 || $(".smonth").val() == 0 || $(".syear").val() == 0 || $(".hear").val() == 0) {
  52. error = "Please fill in all the form.";
  53. }

  55. // No error ? -> Submit
  56. if(error == "")
  57. {

  59. $("form#contact_form").submit();$(".form_error").hide();
  60. } else {
  61. $(".form_error").empty().text(error);
  62. $(".form_error").show();
  63. }
  64. });
  65. });
  66. </script>
  67. </head>
  68. <body><?php if (isset($_POST['action'])) { $to = ""; $emailfrom = ""; $subject = "Insurance Quote"; $message = "\r\n Title:" . $_POST['title'] . "\r\n First Name:" . $_POST['fname'] . "\r\n Surname:" . $_POST['sname'] . "\r\n Gender:" . $_POST['gender'] . "\r\n Number: " . $_POST['number'] . "\r\n Email: " . $_POST['email'] . "\r\n Post: " . $_POST['post'] . "\r\n DOB:Day: " . $_POST['dobday'] . "\r\n DOB:Month: " . $_POST['dobmonth'] . "\r\n DOB:Year:" . $_POST['dobyear'] . "\r\n Hear: " . $_POST['hear'] . "\r\n Insurance Type:" . $_POST['type'] . "\r\n START:Day:" . $_POST['startday'] . "\r\n START:Month:" . $_POST['startmonth'] . "\r\n START:Year:" . $_POST['startyear']; $headers = "From:" . $emailfrom; if (mail($to, $subject, $message, $headers)) { echo "Thankyou for using B"; } echo "done";} else { ?>
  69. <div class="menu_contact">
  70. <h3>Get A Quote</h3>
  71. <hr />
  72. <form action="" method="POST" class="form_contact" id="contact_form">

  74. <label>Title:</label>
  75. <select class="input title" name="title">
  76. <option value="0">Please select</option>
  77. <option value="Mr">Mr</option>
  78. <option value="Mrs">Mrs</option>
  79. <option value="Miss">Miss</option>
  80. <option value="Ms">Ms</option>
  81. </select>
  82. <label>First name:</label>
  83. <input type="text" class="input fname" placeholder="John" name="fname"/>
  84. <label>Surname:</label>
  85. <input type="text" class="input sname" placeholder="Doe" name="sname" />
  86. <label>Gender:</label>
  87. <select class="input gender" name="gender">
  88. <option value="0">Please select</option>
  89. <option>Male</option>
  90. <option>Female</option>
  91. </select>
  92. <label>Contact Number:</label>
  93. <input type="text" class="input phone" placeholder="Your number" name="number" />
  94. <label>Email:</label>
  95. <input type="email" class="input email" placeholder="something@domain.com" name="email"/>
  96. <label>Postcode:</label>
  97. <input type="text" class="input zipcode" placeholder="CW3 9SS" name="post"/>
  98. <label>Date of birth:</label>
  99. <select class="input dateDay bday" name="dobday">
  100. <option value="0">Day</option>
  101. <option value="1">1</option>
  102. <option value="2">2</option>
  103. <option value="3">3</option>
  104. <option value="4">4</option>
  105. <option value="5">5</option>
  106. <option value="6">6</option>
  107. <option value="7">7</option>
  108. <option value="8">8</option>
  109. <option value="9">9</option>
  110. <option value="10">10</option>
  111. <option value="11">11</option>
  112. <option value="12">12</option>
  113. <option value="13">13</option>
  114. <option value="14">14</option>
  115. <option value="15">15</option>
  116. <option value="16">16</option>
  117. <option value="17">17</option>
  118. <option value="18">18</option>
  119. <option value="19">19</option>
  120. <option value="20">20</option>
  121. <option value="21">21</option>
  122. <option value="22">22</option>
  123. <option value="23">23</option>
  124. <option value="24">24</option>
  125. <option value="25">25</option>
  126. <option value="26">26</option>
  127. <option value="27">27</option>
  128. <option value="28">28</option>
  129. <option value="29">29</option>
  130. <option value="30">30</option>
  131. <option value="31">31</option>
  132. </select>
  133. <select class="input dateMonth bmonth" name="dobmonth">
  134. <option value="0">Month</option>
  135. <option value="January">January</option>
  136. <option value="February">February</option>
  137. <option value="March">March</option>
  138. <option value="April">April</option>
  139. <option value="May">May</option>
  140. <option value="June">June</option>
  141. <option value="July">July</option>
  142. <option value="August">August</option>
  143. <option value="September">September</option>
  144. <option value="October">October</option>
  145. <option value="November">November</option>
  146. <option value="December">December</option>
  147. </select>
  148. <select class="input dateYear byear" name="dobyear">
  149. <option value="0">Year</option>
  150. <option value="1996">1996</option>
  151. <option value="1995">1995</option>
  152. <option value="1994">1994</option>
  153. <option value="1993">1993</option>
  154. <option value="1992">1992</option>
  155. <option value="1991">1991</option>
  156. <option value="1990">1990</option>
  157. <option value="1989">1989</option>
  158. <option value="1988">1988</option>
  159. <option value="1987">1987</option>
  160. <option value="1986">1986</option>
  161. <option value="1985">1985</option>
  162. <option value="1984">1984</option>
  163. <option value="1983">1983</option>
  164. <option value="1982">1982</option>
  165. <option value="1981">1981</option>
  166. <option value="1980">1980</option>
  167. <option value="1979">1979</option>
  168. <option value="1978">1978</option>
  169. <option value="1977">1977</option>
  170. <option value="1976">1976</option>
  171. <option value="1975">1975</option>
  172. <option value="1974">1974</option>
  173. <option value="1973">1973</option>
  174. <option value="1972">1972</option>
  175. <option value="1971">1971</option>
  176. <option value="1970">1970</option>
  177. <option value="1969">1969</option>
  178. <option value="1968">1968</option>
  179. <option value="1967">1967</option>
  180. <option value="1966">1966</option>
  181. <option value="1965">1965</option>
  182. <option value="1964">1964</option>
  183. <option value="1963">1963</option>
  184. <option value="1962">1962</option>
  185. <option value="1961">1961</option>
  186. <option value="1960">1960</option>
  187. <option value="1959">1959</option>
  188. <option value="1958">1958</option>
  189. <option value="1957">1957</option>
  190. <option value="1956">1956</option>
  191. <option value="1955">1955</option>
  192. <option value="1954">1954</option>
  193. <option value="1953">1953</option>
  194. <option value="1952">1952</option>
  195. <option value="1951">1951</option>
  196. <option value="1950">1950</option>
  197. <option value="1949">1949</option>
  198. <option value="1948">1948</option>
  199. <option value="1947">1947</option>
  200. <option value="1946">1946</option>
  201. <option value="1945">1945</option>
  202. <option value="1944">1944</option>
  203. <option value="1943">1943</option>
  204. <option value="1942">1942</option>
  205. <option value="1941">1941</option>
  206. <option value="1940">1940</option>
  207. <option value="1939">1939</option>
  208. <option value="1938">1938</option>
  209. <option value="1937">1937</option>
  210. <option value="1936">1936</option>
  211. <option value="1935">1935</option>
  212. <option value="1934">1934</option>
  213. <option value="1933">1933</option>
  214. <option value="1932">1932</option>
  215. <option value="1931">1931</option>
  216. <option value="1930">1930</option>
  217. <option value="1929">1929</option>
  218. <option value="1928">1928</option>
  219. <option value="1927">1927</option>
  220. <option value="1926">1926</option>
  221. <option value="1925">1925</option>
  222. <option value="1924">1924</option>
  223. <option value="1923">1923</option>
  224. <option value="1922">1922</option>
  225. <option value="1921">1921</option>
  226. <option value="1920">1920</option>
  227. <option value="1919">1919</option>
  228. <option value="1918">1918</option>
  229. <option value="1917">1917</option>
  230. <option value="1916">1916</option>
  231. <option value="1915">1915</option>
  232. <option value="1914">1914</option>
  233. <option value="1913">1913</option>
  234. </select>
  235. <label>Insurance Type:</label>
  236. <select class="input insurance" name="type">
  237. <option value="0">Please select</option>
  238. <option>Type 1</option>
  239. <option>Type 2</option>
  240. </select>
  241. <label>Start Date:</label>
  242. <select class="input dateDay sday" name="startday">
  243. <option value="0">Day</option>
  244. <option value="1">1</option>
  245. <option value="2">2</option>
  246. <option value="3">3</option>
  247. <option value="4">4</option>
  248. <option value="5">5</option>
  249. <option value="6">6</option>
  250. <option value="7">7</option>
  251. <option value="8">8</option>
  252. <option value="9">9</option>
  253. <option value="10">10</option>
  254. <option value="11">11</option>
  255. <option value="12">12</option>
  256. <option value="13">13</option>
  257. <option value="14">14</option>
  258. <option value="15">15</option>
  259. <option value="16">16</option>
  260. <option value="17">17</option>
  261. <option value="18">18</option>
  262. <option value="19">19</option>
  263. <option value="20">20</option>
  264. <option value="21">21</option>
  265. <option value="22">22</option>
  266. <option value="23">23</option>
  267. <option value="24">24</option>
  268. <option value="25">25</option>
  269. <option value="26">26</option>
  270. <option value="27">27</option>
  271. <option value="28">28</option>
  272. <option value="29">29</option>
  273. <option value="30">30</option>
  274. <option value="31">31</option>
  275. </select>
  276. <select class="input dateMonth smonth" name="startmonth">
  277. <option value="0">Month</option>
  278. <option value="January">January</option>
  279. <option value="February">February</option>
  280. <option value="March">March</option>
  281. <option value="April">April</option>
  282. <option value="May">May</option>
  283. <option value="June">June</option>
  284. <option value="July">July</option>
  285. <option value="August">August</option>
  286. <option value="September">September</option>
  287. <option value="October">October</option>
  288. <option value="November">November</option>
  289. <option value="December">December</option>
  290. </select>
  291. <select class="input dateYear syear" name="startyear">
  292. <option value="0">Year</option>
  293. <option value='2013'>2013</option>
  294. <option value='2014'>2014</option>

  296. </select>
  297. <label>Where did you hear about us:</label>
  298. <select class="input hear" name="hear">
  299. <option value="0">Please select</option>
  300. <option value="google">Google</option>
  301. <option value="recommendation">Recommendation</option>
  302. <option value="email">Email</option>
  303. <option value="Magazine">Magazine</option>
  304. <option value="Facebook">Facebook</option>
  305. <option value="Other">Other</option>
  306. </select>
  307. <div class="form_error" style="display:none;color:red;text-align:center;text-shadow:none;width:278px;"></div><input type="hidden" name="action" value="postform" />
  308. <input class="darkBtn submit" type="submit" value="Get A Quote >" name="test">
  309. </form>
  310. </div><?php } ?>
  311. </body>
  312. </html>
  313. {/source}
Any help would be much appreciated.

Thankyou.