how to include jquery in code igniter

StackOverflow https://stackoverflow.com//questions/21014421

Question

i am new to jquery and codeigniter but not programming i have done some validation before with javascript. i wanna use jquery in my project and validate the form inputs plz help me step by step

1.how to include jquery?
2.how to use it to validate the form?

<!DOCTYPE html>
<html>
 <head>
<title><?php echo $title; ?></title>
</head>
<body>
  <form id="form" action="<?php echo $form_action; ?>" method="post">
 <center><h1><?php echo $form_h1; ?></h1></center>
<table width="800" border="1" bordercolor="BLUE" align="center" cellpadding="5"    cellspacing="2">
</tr>
<tr>
 <td>
  <b>FirstName</b>
 </td>
 <td>
  <input type="text" id="firstname" name="firstname">
   <span class="firstname_error_msg" style="color: #ff0000;"></span>
 </td>
</tr>
<tr>
 <td>
  <b>LastName</b>
 </td>
 <td>
  <input type="text" id="lastname" name="lastname">

 </td>
</tr>
<tr> You can <em>not</em> use Markdown in here.
 <td>
  <b>Address</b>
 </td>
 <td>
  <input type="text" id="address" name="address" />
  <span class="address_error_msg" style="color: #ff0000;"></span>
 </td>
</tr>
<tr>
 <td>
  <b>Email Id</b>
 </td>
 <td>
  <input type="text" id="email" name="email"/>
  <span class="email_error_msg" style="color: #ff0000;"></span>
 </td>
</tr>
<tr>
 <td>
  <b>Password</b>
 </td>
 <td>
  <input type="text" id="password" name="password" />
  <span class="password_error_msg" style="color: #ff0000;"></span>
 </td>
</tr> You can <em>not</em> use Markdown in here.
<tr>
 <td>
  <b>Gender</b>
 </td>
 <td>
  <select name="gender">
   <option value="M">Male</option>
   <option value="F">Female</option>
  </select>
 </td>
</tr>
<tr>
 <td>
  <b>Date Of Birth</b>
 </td>
 <td>
   <input type="text" id="dob" name="dob" />
 </td>
</tr>
<tr>
 <td>
  <b>Age</b>
 </td>
 <td>
  <input type="text" name="age" />
 </td>
</tr>
<tr>
 <td>
  <b>Zipcode</b>
 </td>
 <td>
  <input type="text" id="zipcode" name="zipcode"/>
  <span class="zipcode_error_msg" style="color: #ff0000;"></span>
 </td>
</tr>
<tr>
 <td>
  <b>Mobile</b>
 </td>
 <td>
  <input type="text" name="mobile"/>
 </td>
</tr>
<tr>
 <td colspan="100%" align="center"  >
  <input type="submit" id="submit" name="submit" value="Submit"/>
  <input id="reset" type="reset"  value="Reset">
 </td>
</tr>
</table>
</form>
</body>
</html>
Was it helpful?

Solution

step 1

to use jquery in your page you need too add this line in your HTML head (in your view)

<head>
    <script type="text/javascript"src="code.jquery.com/jquery-1.10.2.min.js"></script>
</head>

you can find the valid address to add; at the end of jquery page.

step 2

to test jquery included Properly add this code

<script>
  $.(document).ready(function(){ alert("hello"); });
</script>

if alert shown and firebug console didn't show any error. it's included correctly.

step 3

you can use codeigniter validaitor or jquery validiator to validate your form data. use these refrence for every offer.

validate with codeIgniter

validate with jquery

OTHER TIPS

In head sector of your code just copy paste the code given below.

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">    </script>

You can use google jquery url.

For local file, use below code in your template header to include in all pages.

<script type="text/javascript" src="<?php echo base_url();?>js/jquery.js file"></script>

Then you can use any jquery validation plugin / tool now.

Try below URL for demo and code:

http://www.position-relative.net/creation/formValidator/

http://www.position-relative.net/creation/formValidator/demos/demoValidators.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top